[](https://badge.fury.io/js/%40tryghost%2Fportal)
Drop-in script to make the bulk of Ghost membership features work on any theme.
Ghost automatically injects Portal script on all sites running Ghost 4 or higher.
Alternatively, Portal can be enabled on non-ghost pages directly by inserting the below script on the page.
``html`
The data-ghost attribute expects the URL for your Ghost site, which is the only input Portal needs to work with your site's membership data via Ghost APIs.
By default, the script adds a default floating trigger button on the bottom right of your page which is used to trigger the popup on screen.
Its possible to add custom trigger button of your own by adding data attribute data-portal to any HTML tag on page, and also specify a specific page to open from it by using it as data-portal=signup.
The script also adds custom class names to this element for open and close state of popup - gh-portal-open and gh-portal-close, allowing devs to update its UI based on popup state.
Refer the docs to read about ways in which Portal can be customized for your site.
Portal runs automatically when using Ghost's development command from the monorepo root:
`
yarn dev
This starts all frontend apps (including Portal.)
---
To run Portal in a standalone fashion, use yarn start and open http://localhost:3000.
To create a production minified bundle in umd/portal.min.js:`
yarn build
To run tests in watch mode:
`
yarn test
Portal is primarily tested via Ghost's e2e browser tests, see our Playwright docs for more details.
1. Run the Ghost e2e tests in the top-level of the monorepo, providing ENV variables for Stripe:
`
STRIPE_ACCOUNT_ID=acct_xxx STRIPE_PUBLISHABLE_KEY=pk_test_xxx STRIPE_SECRET_KEY=sk_test_xxx yarn test:browser
A patch release can be rolled out instantly in production, whereas a minor/major release requires the Ghost monorepo to be updated and released. In either case, you need sufficient permissions to release @tryghost packages on NPM.
If you're releasing new code that should not immediately go live _always_ use a minor or major version when publishing.
In order to have Ghost's e2e tests run against the new code on CI or to test the new code in staging, you need to publish to npm following the Minor / major release process below.
1. Run yarn ship and select a patch version when promptedmain
2. Merge the release commit to
1. Run yarn ship and select a minor or major version when promptedmain
2. Merge the release commit to
3. Wait until a new version of Ghost is released
and
https://purge.jsdelivr.net/ghost/portal@~${PORTAL_VERSION}/umd/main.css in your browser, where PORTAL_VERSION is the latest minor version in ghost/core/core/shared/config/defaults.json` (code)Copyright (c) 2013-2026 Ghost Foundation - Released under the MIT license.