You all are absolutely loving the customization ability with Kadence!! And there are some of you that are seeing everyone raving about their switch over to Kadence but you’re nervous about the process. Totally understandable when it comes to all things tech! We know this process can be very overwhelming and comes with a bazillion questions along the way. So today I’m going to share my guide to making the switch from Genesis over to Kadence – step by step. This is the exact process we use when you do our Installation Service for our customers.
We also have some helpful info in another blog post titled How To Switch From A Genesis Theme To Kadence – Without Wrecking Your Site that covers if you need to set up a staging site or not. I will not be covering a staging site in this guide, but if you decide to do it that way, you’ll simply work with your hosting provider to create that staging copy for you and then start with the list below. The only difference is you will skip step 3 since you won’t need a coming soon page.
So let’s dive in:
Step 1: Move the header/footer scripts into a plugin
With Genesis, they have a space for you to place your header/footer scripts directly in the customize panel. However, when changing to a non-genesis theme, this code doesn’t come over automatically unfortunately. So here is how you’ll do this process:
- Navigate to Plugins > Add New.
- In the top right, use the search field and type in “insert headers and footers” and it should be the first one that comes up. You’ll want this one.
- Hit the Install button and then hit Activate.
- Navigate to Appearance > Customize > Theme Settings > Header Footer Scripts.
- Copy everything in the Header Scripts space. Make certain you get EVERYTHING that is in this box.
- Once you for sure have it copied in your clipboard, you can delete the code that is there in the header script box. Just keep in mind that you can’t have this code in the Genesis Theme Settings AND the plugin at the same time.. it will give you an error. So be sure you delete this after copying it.
- Now navigate to Settings > Insert Headers and Footers and paste in the code you just copied and save.
- Now we are going to do the same thing again but this time we will grab the footer code. Navigate to Appearance > Customize > Theme Settings > Header Footer Scripts.
- Copy everything in the Footer Scripts space.
- Delete the code in the Footer Scripts space once you have it copied in your clipboard.
- Navigate to Settings > Insert Headers and Footers and paste in the code you just copied and save!
Step 2: Take screenshots of the important pages
We do this here at Restored 316, just so we can have a backup of what the site looked like before we made the switch. With Genesis, most of the design is held within widgets, and those don’t get transferred over in the process so I always like to have a screenshot so I know exactly what was there before switching.
I use a Google Chrome extension on my browser called GoFullPage that will take a screenshot of the entire page from top to bottom. I typically take a screenshot of the Home Page, About Page, Category Index and any other page that I feel is important to the specific site I’m on. This will vary from site to site but be sure to capture anything you want to save beforehand.
Step 3: Install and Activate a Coming Soon Page
We do this for every customer when we do an install for them. This just takes the site down for a short period of time while we work so that readers aren’t stumbling on the site when it has demo content in there.
We use this Coming Soon plugin for our customers.
Here is how we do this part:
- Navigate to Plugins > Add New
- In the Search box, search for “Coming Soon” and the one from SeedProd should be one of the top results.
- Install that plugin and Activate it.
- Once you Activate this plugin it will take you to a page with a Introductory video. You can watch that to learn more about the plugin if you’d like.
- Click to Create your first page.
- Then we are going to Set up a Coming Soon Page.
- You can choose from any of the templates you see shown on the screen. We typically chose the Rocket Coming Soon page. (This page design can be edited!)
- Once you’ve chosen your template, you can edit this page to fit your needs by changing text, images, fonts, and colors!
- Once you’re done designing, publish your new coming soon page and then turn it on with the toggle!
- Your site is now only showing Coming Soon to your readers so it’s time to get busy with your website install!
Step 4: Install Kadence
Just like with your original Genesis Child Theme installation, we have to first install the Kadence Framework. We can’t install and activate our new Restored 316 theme unless this is installed so it’s a super important first step.
- Navigate to Appearance Themes.
- Hit Add New at the top of the screen.
- Search for Kadence.
- It should be the top one you see. Hover over the image and Click Install. There is no need to Activate this!
Here is a video that will walk you through this step, along with the next two steps as well.
Step 5: Install the Kadence Starter Templates Plugin
This plugin will help get all the demo content installed once we install our new Restored 316 Kadence Child Theme. you can technically do this before or after Step 6, but I typically do it before just so it’s there and done.
- Navigate to Plugins > Add New.
- Search for Kadence in the Search bar and look for the one that says “Starter Templates by Kadence WP”.
- Install and Activate this plugin.
Step 6: Install Your new Kadence Child Theme
Note: If moving from Genesis to the same theme on Kadence, I recommend first activating a default theme or the Kadence theme itself, then delete the current Genesis theme prior to completing the Kadence installation.
Now it’s time to get to your beautiful new theme!
- Navigate to Appearance > Themes.
- Click the Add New Button at the top.
- Click the Upload Theme Button at the top.
- Upload the zip file you downloaded after purchase.
- Install and Activate!
- Now navigate to Appearance > Starter Templates (if you don’t see this, make sure that Starter Templates plugin is active.)
- Next you will either see a screen with 3 logos or one with just a screenshot of the theme. If you see the 3 logos, just click on our logo and then you’ll see the screenshot of the theme.
- Click on the screenshot of the theme and a popup will come up.
- Click the Start Importing button and let it do it’s thing. Don’t leave this page… let it finish.
From time to time an issue may arise with the installation so here are a few things to note when doing your install:
- It can take up to 7-8 minutes for the theme to completely load, depending on the host.
- If you get an error code when you first activate the theme, click on Appearance > Kadence > Kadence Starter Templates in the sidebar, then click on the theme image again to install it.
- BLUEHOST & GODADDY USERS: If you continue to receive an error code during installation, contact your host and ask them to increase the Memory Limit and Post Max Size to 512KB. Once this is done, click on Appearance > Kadence > Kadence Starter Templates in the sidebar, then click on the theme image again to install it. This will finish the installation.
Step 7: Customizing your new theme with all your own content, images, fonts, colors and more!
There is so much that you can customize, so instead of writing things out, I’ve got a video for you!! We cover quite a bit so buckle your seatbelt and watch along before you dive into customizing your site!