Connect your site (CMS)
Step-by-step connection for WordPress, Ghost, Webflow, Wix, Shopify, Framer, HubSpot, Notion, GitHub / MDX, Next.js and your own webhook.
Connect your site so Prefera can send articles and fixes there. Prefera sends them as drafts first, and you approve before anything goes live. See Publishing for how drafts, live pages and unpublishing work.
Every connection uses the same screen: Integrations > Publish to your site. Click Connect on the tile, follow the steps in the dialog, then use Test connection and Save. Keys and passwords are stored encrypted and are not shown again. Later, Manage reopens the same form and Disconnect removes the connection.
On WordPress, HubSpot and Shopify tiles an Article style menu appears once connected, with Prefera editorial and Match my site.
Draft or live#
| Site | What Prefera creates |
|---|---|
| WordPress | A draft |
| Ghost | A draft post |
| Webflow | A draft in your blog collection |
| Wix | A draft blog post |
| Shopify | An unpublished blog article |
| Framer | A draft item in a CMS collection |
| HubSpot | A draft blog post |
| Notion | A page in your database |
| GitHub / MDX | A draft pull request |
| Next.js | A draft pull request |
| Webhook | A publish.draft event |
Going live is a separate step you approve. Disconnecting never removes pages already published.
WordPress#
What you need: your site address. Works with self-hosted WordPress and WordPress.com.
- Open Connect WordPress and type your site address.
- Click Connect with WordPress. Your own WordPress opens. Log in if asked and click Yes, I approve of this connection.
- You come back to Prefera, connected. No password to copy.
If you prefer to paste a password, open Or paste an application password instead:
- Open your profile in WordPress (Users > Profile) and scroll to Application Passwords.
- Type
Preferaas the name, click Add New Application Password and copy the password it shows once. - Paste it with your WordPress username (the one you log in with, not your email).
Prefera creates drafts. Publishing live sets the post to published.
Ghost#
What you need: your site URL and the Admin API key (not the Content API key).
- In Ghost Admin, open Settings > Integrations, click Add custom integration and name it Prefera.
- Copy the Admin API key. It looks like
64f1…:9ab3…, two parts joined by a colon. - Paste it with your Site URL.
Prefera creates draft posts.
Webflow#
What you need: a site token with Sites read-only and CMS read and write.
- In Webflow, open your site, then Site settings > Apps & integrations > API access, and click Generate API token.
- Name it Prefera, set Sites to Read-only and CMS to Read and write, generate it and copy the token. Webflow shows it once.
- Paste it in Site token and click Find my site. Prefera finds the site and its blog collection. If there is more than one collection, pick the one your articles go in.
Prefera creates drafts in the blog collection.
Wix#
What you need: an API key and your Account ID.
- Open Wix API Keys and click Generate API Key. Under Sites pick All sites (or Specific sites and add this one).
- Under All site permissions tick Wix Blog, Manage Site Media and Wix Contacts & Members. Under account permissions tick Read Site Data. Wix emails you a code to confirm.
- Copy the key. Copy your Account ID from the same API Keys page, top right (Copy ID).
- Paste both and click Find my sites. Pick the site, then who the posts are by (Posts are by).
Wix blog posts need an author who is a site member. If the list is empty, log in to your live site once (or add a blog writer), then find the site again.
Prefera creates draft posts. Covers, photos and charts go to the site's Media Manager.
Shopify#
What you need: your store domain (for example yourstore.myshopify.com) and either a Dev Dashboard app or an Admin API token. Choose with the switch at the top of the dialog.
Dev Dashboard app:
- In your Shopify admin open Settings > Apps > Develop apps, click Build apps in Dev Dashboard, then Create app. Name it Prefera and, under API access, type
read_content,write_contentin Scopes. - Click Create app, then Release. On the app's overview click Test app next to Installs, choose this store and click Install.
- Under Credentials copy the Client ID and Client secret. Paste them with your store domain.
Admin API token (for a custom app made in your Shopify admin before 1 January 2026):
- Open Settings > Apps > Develop apps and click your app.
- Under API credentials check the
read_contentandwrite_contentscopes, then reveal the Admin API access token (it starts withshpat_). - Paste it with your store domain.
Connecting a client's store? Shopify only lets the app work on stores in the same Shopify organization. Someone on the store's team with the App developer role needs to create the app there.
Prefera creates unpublished blog articles.
Framer#
What you need: a Framer API key and your project link.
- In Framer, open your project, then Site Settings > General > API Keys and create a key. Copy it.
- Copy the project link from the browser's address bar. It looks like
https://framer.com/projects/Site--abc123. - Paste both, click Load collections and pick the one for your blog.
- Check the field choices: Title field, Body field, and optionally Cover image and Date.
Prefera adds draft items to the collection. Publish live publishes your Framer site only when this page is the only unpublished change. Otherwise the item is made ready and you publish from Framer, so nothing unfinished goes out with it.
HubSpot#
What you need: a HubSpot key with the content scope.
If you see a Connect HubSpot button, click it, sign in at HubSpot and choose what Prefera may use. Nothing to copy or paste. Otherwise, or via Or paste a key instead:
- In HubSpot, open Development > Keys > Service keys and create a key. A private app token from an older account works too.
- Tick the content scope, and files.read and files.write so covers and photos upload. Copy the key.
- Paste it and click Load blogs. Pick the Blog and the Author.
If no author is picked, posts go out without a byline. To show one, add an author in HubSpot (Blog > Authors) and load the blogs again.
Prefera creates draft blog posts.
Notion#
What you need: an integration secret and a database you share with it.
If you see a Connect Notion button, use it. Otherwise, or via Or paste a key instead:
- Open notion.so/profile/integrations, click New integration, name it Prefera and under Capabilities tick Read content, Update content and Insert content. Copy the Internal Integration Secret.
- Open your blog database in Notion, click ••• (top right), then Connections, and add Prefera.
- Paste the secret and click Find my databases. Pick yours. You can also paste the database link.
Fixes go in as pages of the database. If the database has a Status property with Draft and Published, Prefera sets it.
GitHub / MDX#
What you need: a GitHub repository for your site, and permission to read and write Contents and Pull requests on it.
If you see a Connect GitHub button:
- Click Connect GitHub.
- Choose the account and the repository your site lives in, and click Install. Prefera asks only for Contents and Pull requests on that repository.
- You come back to Prefera. Pick the repository. Prefera finds the branch and the posts folder.
Or click Or paste a token instead:
- Open GitHub's new fine-grained token page. Under Repository access choose Only select repositories and pick your site's repository.
- Under Permissions > Repository permissions set Contents and Pull requests to Read and write, then click Generate token and copy it.
- Paste it as Fine-grained token with the Repository as
owner/name.
Check Base branch (default main) and Content directory (default content).
A fix opens a pull request that adds an MDX file. The file is committed on a new branch, never on the branch you name. A draft is a draft pull request. Publish live marks it ready, and you merge it to deploy. Unpublish closes it.
Next.js#
For a custom Next.js site, Prefera uses the GitHub connection. In Publish to your site, the Next.js / custom site tile has a Set up button (View setup once connected). It takes about 10 minutes.
- Add the blog starter. Run
npm install markedand copy the four starter files shown in the dialog into your app (undersrc/if your app uses it). Add an emptycontent/blog/.gitkeepand deploy./blogshows an empty list. - Make a GitHub token. In GitHub: Settings > Developer settings > Fine-grained tokens. Only this repo; Contents and Pull requests read and write.
- Connect the repo in the dialog, with
content/blogas the content directory. Prefera never commits to your base branch. - Publish. A draft is a draft pull request. Publish live marks it ready. Merge it to deploy. Unpublish closes it.
Each page is content/blog/<slug>.mdx with front matter title, description, date and, with a cover, image and imageAlt. Its images sit next to it. Links to competitors get rel="nofollow".
Webhook#
Use Your own site (webhook) for any stack: Next.js, a custom CMS, Zapier or Make. Prefera sends each page as signed JSON, first as a draft, then live when you approve.
- Copy the signing secret and the example receiver from the dialog into your site. Set the secret as
PREFERA_SIGNING_SECRET. - Publish the receiver at an https address, for example your site's
/api/prefera. - Paste that address as the Endpoint (https), click Send test, then Save.
Put the secret on your endpoint before you save. It is stored encrypted and not shown again.
Each request carries Prefera-Signature: t=…,v1=… (an HMAC-SHA256 of t.body), Prefera-Event and Idempotency-Key. Send test posts a publish.verify event, and your endpoint must echo its challenge. The example receiver also handles publish.draft, publish.live and publish.unpublish. The page arrives with ref, title, slug, html and coverUrl. Your endpoint replies with an id and a url.
This webhook publishes pages to your site. It is different from the notification webhooks on Slack, email and webhooks. For signing details see Webhooks.