How To Publish A Website Using Webflow Pages In WordPress

Mar 21, 2021

Webflow is a third-party website builder with both free and paid plans, and it requires no coding knowledge to use it. 

Webflow can be used within WordPress through a plugin, allowing you to have the best of both worlds; Webflow templates and WordPress tools and management interface. 

Webflow Pages

Webflow Pages is a free plugin that gives you access to Webflow pages inside of your WordPress dashboard. 

You can download Webflow Pages for free from your WordPress dashboard. 

Let’s learn how to publish a website using Webflow with WordPress!

Install & Activate

Login to your WordPress Dashboard, head to Plugins > Add New, fill in Webflow Pages in the top-right search field, and click Install Now:

Once installed, click Activate to activate the plugin:

Create Webflow Account

Next, we need to create our free Webflow account. Head to the Webflow Signup page, and create a new account or sign in with your Google account:

Go through the setup and answer some questions so Webflow can get to know you better:

Once completed, Webflow will guide you through a basic tutorial on how to use their website builder. After the tutorial is completed, you’ll be able to create a new project. 

Create New Project

Click Create new project to start a new project that we’ll use on our WordPress website.

Next, select a template:

Fill in the name of your project and click Create project:

Now we need to link our Webflow account with the WordPress plugin. Click the Webflow icon in the top-left corner and select Project Settings:

Click Publish on the right-hand side, select your domain, and then click Publish to Selected Domains:

Next, click Integrations, scroll down and locate the API Access section, and click Generate API token:

Copy your API token, switch to your WordPress Dashboard, and head to Webflow Pages > Settings. Fill in your API token and click Add Webflow API Key:

That’s it! Now your Webflow project is linked with your WordPress website.

Create Redirects

Now we need to create a WordPress redirect for each of our Webflow pages. Click Webflow Pages > Settings, and add redirects under the Static and Collection pages options:

Configure Caching

Lastly, you can configure caching options for your Webflow pages by clicking on the Settings tab:

That’s it! Each time you update and publish your project in the Webflow editor – Webflow will automatically push it to your WordPress website.