GoDaddy is one of the more popular website hosts because of their easy to search criteria when looking for the perfect website name, but they also offer a site builder that will allow you to generate your own website without having to study up on code and you get to modify layout with the familiar drag and drop actions.
But like other site builders, GoDaddy is also limited and as users discover they’d prefer the flexibility of a CMS (content management system), so they look for a suitable alternative like WordPress to move their sites to because they’re faced with inflexible libraries that are not often transferable.
Detailed are the steps required to transfer a website GoDaddy’s WebsiteBuilder platform to WordPress.
Step 1: Getting Prepared
Ensure you’ve gathered the relevant information about your website before transfer.
- Font styles
- Menu structure
- Page layouts
Which you will copy and paste in your WordPress website. You’ll need to create a file for this action.
Fonts and Colours
With Web Style Grabber all you need to do is to paste the URL, and it will provide the list of fonts and colours used by the GoDaddy website on that page.
Step 2: WordPress Website Set Up
For successful content transfer you’ll need to create each post and page and for the layouts, recreate them or use the default page layouts in WordPress.
Creating the layout is either by building the website on your own server and when it’s ready moving it, or transferring the domain to the live host and build the site live. If the latter is your preferred option use a maintenance mode plugin. For more information about using maintenance mode see the article 5 WordPress Tools For Creating A Maintenance Mode Or Coming Soon Page.
Creating the Layout
Choose a layout with four pages.
Any action executed is easily done using text modules. Services and contact pages are relatively standard which are replicated with the built in Divi modules without many alterations.
The homepage includes the usual blurbs, portfolio and buttons so creating the layout will be done by the drag and drop method using Divi and the Divi Builder. Other system themes including those with drag and drop page elements and drag and drop building plugins such as Visual Composer work just as well.
Create a new page in WordPress and select the Divi PageBuilder.
For flexibility, choose Portfolio Fullwidth Grid. You’ve got the option to add extra features as required. Don’t be too pedantic about getting every detail the same. Divi will do much of what you need. For example, the portfolio in the GoDaddy site provided static images that weren’t click-able, so the Divi portfolio module created a click-able dynamic portfolio with animation.
Styles and Adjustments
You can allow the Divi Theme Customizer to make your adjustments for you or if you wish, you can tweak each section, row, or module independently and add background colours as preferred.
Be courageous and experiment. You can use the same colours as the GoDaddy site, and you can use Divi’s default fonts for the body text.
Go further and use an elegant font for the title page instead of the font used in WebsiteBuilder. The font you select will be named by the style grabber, so if you want to install that font, you can use a plugin.
If you’d like to learn more about installing fonts in Divi, step over to 15 Elegant & Modern Fonts for Web Design and to create the overlap between the portfolio and the section above it, have a look at Divi Nation podcast episode 12 and change the code to adjust the bottom instead of the top. This is easy to do with CSS.
The blurbs included a solid black icon with a large header and separate text. You can add Divi’s built-in icons and adjust their size to match. If GoDaddy’s icons weren’t aren’t to your liking, you could use one similar rather than trying to match them exactly or check out 10 of the Best Places to Find Free Icons and Image Assets Online.
You might experience misaligned button placement when arranging them under blurbs. You can alleviate that by placing the buttons on their own row.
Step 3: Transferring Content
There is no other way to transfer content than the old fashioned copy and paste, and it’s going to take time. You’ll have to do it by hand, one page at a time and it is highly recommended you save your GoDaddy pages to your hard drive.
Some people copy their text files from the live site, and that’s fine, however, when you copy from stored files, you have the content you need which is easily accessible after your GoDaddy website is disabled.
There are two ways to do this:
- Right, click and save each page as a complete web page.
- Use an app such as HTTrack and download all of the pages to your PC.
Having saved your pages to your hard drive you might still need to copy and paste your images from the live site as you create the new posts.
The reason for this is that GoDaddy’s WebsiteBuilder stores templates and files on different servers and they vary from one website to another, making it difficult to download your images with the rest of the files.
Note also that if you have a WebsiteBuilder website on your regular GoDaddy hosting plan and you’re planning to use that plan for your WordPress website, you’ll need to disable the WebsiteBuilder website first. This means you won’t have access to the content.
Continue to copy and paste the content into their modules until all of the content has been transferred to the new website. This process is recreating your pages one component at a time, and it’s worth the time because of the flexibility you’re going to get from WordPress.
If you need to add padding to widen your columns go into Advanced Design Settings and add width and adjust the space between elements that are above or below the content. You’ll also have to copy and paste your images and any other media you have on your website.
You probably won’t want them anyway, but ensure your own images are copied, not the ones that were included with the GoDaddy template which will be copy written.
Step 4: Menus
Creating the menu system is easy when using WordPress’s menu customizer. Under Appearance in the dashboard select the pages you want then drag and drop them into their proper locations. Set this as the primary menu and for further instruction about creating custom menus refer to How to Create Custom Menu Structures in WordPress.
By selecting Header & Navigation, Primary Menu Bar you’re able to adjust the menu height and colours for the menu links in the Theme Customizer then paste in the text colours.
Step 5: Redirects and Permalinks
Match your links with those on your GoDaddy website. This way any links to your website still work and you don’t lose traffic and SEO.
It’s going to depend on whether you own your domain if you want to forward it. It you obtained a free domain with GoDaddy, you might have to wait a year after purchase before you’re allowed to forward it. If you bought it separately, then you can forward it using your domain registrar’s forwarding service. This service might include 301 redirects. If not then you’ll want to use a plugin.
As an example, http://www.mysamplewebsite.com/samplepage.html go to the WordPress dashboard, click Settings then select Permalinks. Under Common Settings choose Post Name. Your links will match the structure from your GoDaddy website. Your next move is to redirect the .html links.
Because your new WordPress website won’t have .html at the end of the link yet, you can redirect with a 301 redirect plugin which tells the search engines that the requested URL has been moved to a new URL. This helps keep your SEO and authority intact. Using a plugin called Eggplant 301 Redirects, it offers a free and a pro version. The pro version adds a 404 tracking feature and improved SEO.
To use it, key in your pages with /HTML in the Redirect From field. In the Redirect To field select the post type and the post name from the drop-down boxes. Click Save. Leave the ID set to 301 making it a permanent change. Now repeat this process for each URL.
For more on creating redirects, see the article How To Create Redirects With WordPress. For an overview of redirect plugins, see the article Turn Around: The 7 Best Redirect Plugins for WordPress.
It’s a good idea to create a 404 page in case there are issues with your redirects. A 404 page lets your visitors know the page they’re searching for does not exist, and basically, that’s it. But WordPress has made it easy to customise your 404 page and will give you the option to redirect your users with a message that will direct them to another page on your site.
For a look at the best 404 plugins see the article The 7 Best 404 Plugins for WordPress.
Step 6: Going Live
Your site is complete. It looks great. Now you need to road test all the links before going live. Once you’re happy everything is working as it should, disable the maintenance mode and watch your traffic. Be sure to listen to feedback and check for 404 errors, so you can make adjustments as required.
Regardless of the work involved it’s crucial that you choose the best platform for your needs. It takes time using the copy and paste method to make the transfer the flexibility but the reward is the flexibility and ease using WordPress. It’s well worth it.