Ghost integration

Embed Orizn widgets in Ghost

Step-by-step guide to add visa, budget, and travel widgets to your Ghost site in under 2 minutes.

Ghost is built for serious publishers and ships the Koenig editor, which natively supports HTML cards with raw markup including external scripts. Embedding an Orizn widget in a Ghost post or page takes four clicks.

Tested with Ghost 5.x (Koenig editor)Free forever

What you'll get

Three quick wins

✈️

Inline visa lookup mid-article

Readers see the visa rules without clicking away, which lifts dwell time on travel newsletters.

🎨

Matches your Ghost theme

Pass data-theme='auto' and the widget follows your reader's OS preference (dark by default on Casper).

💌

Works in email newsletters? Almost

Scripts don't run in emails — use the iframe snippet so the widget still shows up as a clickable preview.

Setup

Step-by-step in Ghost

Five concrete steps from opening the editor to hitting publish.

1

Open the post or page

From the Ghost admin (yourblog.ghost.io/ghost), open Posts (or Pages), then click the title of the entry you want to embed into. The Koenig editor opens.

2

Insert an HTML card

On an empty line, click the + (plus) button that appears on the left margin, or simply type /html and press Enter. The HTML card has a code icon and lets you paste raw markup that bypasses the markdown parser.

3

Paste the snippet

Paste the two-line snippet. Ghost shows a live preview directly in the editor — you should see the widget render in place within a second. Click outside the card to commit.

4

Save the draft

Ghost auto-saves every few keystrokes, but hit Cmd/Ctrl+S to be sure. If you are editing a published post, use the 'Update' button in the top right.

5

Publish or update

Click the green Publish (or Update) button. Open the public URL in a new tab to confirm the widget mounts. Ghost serves a strict CSP by default — see pitfalls below if you are self-hosting.

Code

The snippet for Ghost

Copy the variant that matches your setup. Switch tabs to see the affiliate or iframe versions.

html
<div id="orizn-visa"></div>
<script src="https://visa.orizn.app/embed/visa.js" async></script>

Watch out

Common Ghost pitfalls

The things that catch first-timers — fix in advance.

Self-hosted Ghost CSP

Self-hosted Ghost ships with a tight default-src 'self'. Edit config.production.json or your reverse proxy to allow script-src visa.orizn.app.

Newsletter emails strip scripts

Ghost Email does not execute JavaScript. Use the iframe snippet so the widget still appears as a preview that opens in a browser when clicked.

AMP mode blocks third-party JS

If you have the AMP integration enabled, the widget will not render on /amp/ URLs. Disable AMP for travel posts or rely on canonical traffic.

Members-only posts

Behind a paywall the widget still works for logged-in members. Free preview snippets will not include the widget — paste it below the {{members}} gate.

FAQ

Questions about Ghost

Does Ghost charge extra to embed scripts?

No. The HTML card is available on every Ghost plan, including Starter and self-hosted.

Can I embed Orizn in a Ghost newsletter?

Only as an iframe preview. Email clients strip <script> tags, but the iframe variant still renders a clickable card linking to the live widget.

Will it work with Ghost(Pro) on their CDN?

Yes. Ghost(Pro) does not restrict outbound script sources, so the standard snippet runs as-is.

Can I reuse the same widget across multiple posts?

Yes. Save the HTML card as a snippet (Bookmark icon → Save as snippet) and reuse it via the /snippet menu.

Other platforms

Embed Orizn elsewhere

Ready?

Ready to embed in Ghost?

Grab the snippet, paste it where the steps above describe, and ship in two minutes.