A step-by-step guide to moving a Webflow site to Cloudways using WordPress and the Webflow Pages plugin. You provision a server (1GB handles under 50k monthly views), install WordPress, connect via API token, and map your Webflow pages into the new site.
If you're annoyed with shared hosting or expensive hosting platforms like webflow or Framer, well I'm actually going to show you how to transfer your website and build it using Cloudways, a high performing cloud based hosting platform. I'm going to show you how to do it in this video. Now I want to jump into Cloudways and I'm going to go to my dashboard and you can do Autonomous which is a fully managed website if you're doing WordPress. But I'm going to click on flexible. Now I'm going to just go click on get started. They always give you a three days trial which is nice, you can test it out. So I'm just going to click on free trial and what I want to do is you can see you can add an application. So if you're doing a E commerce site you'll probably use WooCommerce or a WordPress site, you can do that. They've also do PHP and Magento and Laraverl. But I'm just going to click version 62 for WordPress and then I'm going to call it application name, my website server name. We'll just call it Jeremy Mirror Project and I'll say Portfolio Website. Cool. You've got two stacks here. You've got Hybrid stack and then also Lightning Stack. So it's just got a different optimization, faster performance and I'm just leaving a hybrid, it's just a bit more flexible and then you want to select your server. So depending on how much traffic you have, if you've got a small site you can probably do like 1 gigabyte or 2 gigabytes. It will give you a little warning sign if they think it's gonna be a massive site. You can also choose from Vulture, Linode, AWS and Google. Now if you're a have a website that always needs to be up and doesn't need any downtime and you've got like say a big, it's a big brand or big E commerce site then probably best to do AWS or Google Cloud. But if you're just a agency owner designer you can probably just do DigitalOcean and I'll do like 1 gigabyte and on the bottom will show me how what the price is only 14 bucks a month. I'm going to select my server location. I'm going to select Sydney because I'm in Australia and you can see it says recommend to Ohio. If it's low traffic it should be fine. If it's under around 50,000 views per month then 1 gigabyte should be fine. I'm going to click launch now and it's going to go ahead and set up. The server usually takes around 10 minutes and now we can see it's setting up just Jeremiah Premium Server one gigabyte basic. Adding that server take about seven minutes. Now you can see my server is ready and I can see the application installed on the service server, which is WordPress. It's got a project as well. I can left click inside of this and it'll have all the details. You got your credentials. It monitors the server health as well. So the usage and whenever the usage, you know you might get spikes from high traffic, maybe you're doing ads or something. Then you can have vertical scaling. So automatically scale the server based on your needs, which is really cool. It's also got automatic backups and a bunch of other features that we don't need to think about. Now if I go to at the top and click on the application on the right hand side, you'll get a little sidebar and I'll click on my website and to access my WordPress website. Now all I got to do is I can actually left click on this and it'll take me to the website, which is this. It's just using the standard default theme which we can change later. And then we've got the admin panel. So you want to click on this link and then all you got to do is copy and paste your email and password from the admin panel. So just copy and paste 1 and 2 and then once you do that you'll land on the back end of your WordPress website, which is really cool. Now I'm going to go down to plugins and I want to go to add a plugin and I'm going to type in webflow up the top and I'm going to activate webflow pages. And this allows us to build from from the visual builder of Webflow instead of using the inbuilt tools in WordPress. They are a bit limited, but this gives us more flexibility when we're creating our website and we're still connected to our server. It's just another way you can build. Now once we have it, you can go to the top left and click on webflow pages. And what we're going to do is you can follow this guy guide. Now I do have to go connect my API key. So we're gonna go to Web Flow and I'm just gonna get the API key and paste it into the plug so it connects perfectly. I'm going to go to the top left and click on Site Settings for my website. And what I'm going to do is go down to API App. I'm going to go to Apps and Integrations and then what we want to do is find our API key. So I'm going to generate a token and you can choose which access to give. We want to basically give access to CMS sites and also pages. And this on read only. And then we're going to say WordPress website and we'll click generate token. I'm going to copy this token and then we're going to go to Settings and paste the API key into the plugin on that back end. Sweet. It's reading my website, which is really great. Now on the left, what we want to do is click on pages and we can see we've got a few sample pages here. Let me just click on this. Cool. That's one I'm gonna click on. Add a page. Now what we can actually do, so we want to click on Settings and we want to create a redirect so it points to the right website on webflow. The right page, actually. So I've gone to my Pages section, got that link from the sample page and I'm just gonna paste it into the WordPress path. And now this should point to design guide page. I'm gonna click plus. And now we've got a new rule. So now let's see if we've got a sample page. Let's go. Clear cache. So now if I go to the website and click on the sample page. See up the top right sample page. And now links to redirects to that page that I just redirected from webflow. So whatever page you build in webflow, you can just connect it and that design will be added into your WordPress website. And then setting up a server using Cloudways. If you do want to try out Cloudways, I will put a link in the description below. You can try it out. If you don't want to see me work on another website style design, check out this video here which shows you the whole process.
