HTML websites are good for their speed and purity of code. It is interesting to use them with a small amount of content and static pages when the project does not require frequent changes and content updates. They do not have control panels. Web pages need to be edited via code and then updated on the hosting, which is very inconvenient. This clarifies why many businesses decide to move their sites from HTML to WordPress – a popular content management system with a convenient admin panel and a huge selection of plugins and templates.

The use of CMS significantly increases the efficiency of the site administrator, especially when it is necessary to scale it. Opportunities for SEO optimization and refinement of functionality are also expanding. Transferring a working HTML site to WordPress is a common task. It is solved by algorithms, honed by many years of experience of thousands of developers.

This guide speaks about the steps needed to migrate an HTML site to WordPress successfully. All of them can be done independently.

Getting Ready to Move Site from HTML to WordPress

The essence of the migration task is to convert static HTML pages into a format suitable for WordPress, which also uses PHP code and HTML / CSS. That is, transferring the code without optimization under the CMS will not work.

Suppose you need to keep the site’s current design (there is good traffic, the design is familiar and recognizable among your customers. In that case, you have to tinker with adjusting the current design to the WP format without changes. You can use plugins (which we will talk about later in this post).

You can also manually assemble a similar template for WordPress, but this option is unacceptable for beginners – it requires the skills of an experienced developer, most likely, you will have to order this work from a specialist. It involves extra investments, but you will get a quality result.

Suppose you can afford to change the design without much damage to the sit. In that case, you can just take a more or less similar (or not at all similar) WordPress template, copy materials (manually or using plugins), add appropriate forms, communication channels, etc. that were on the original site, and get a site with former content that has been redesigned. This option is easier to implement. 

First, you need to analyze what functionality is involved in the HTML-based website and find the appropriate plugins or built-in tools for WordPress. The CMS has many opportunities – everything is there for you. Make a checklist of essentials, and you will find them without any problems – so as not to miss anything. And don’t forget to back up the current version of the HTML site.

STEP 1 – CHOOSE HOSTING, INSTALL WORDPRESS AND CREATE A DATABASE

Choosing a hosting provider is the most important point. Its quality determines how your site will work – whether fast, stable, or easy to administer and make fine-tuning. Since 2005, Bluehost, the largest WordPress hosting provider serving more than 2 million domains, has been officially recommended by WordPress.org.

118 data centers are scattered around the world, headquartered in Utah. Servers to manage this entire empire there occupy about 5,000 square meters. Everything works on SSDs. A lot of space is allocated, even at the minimum rate for WordPress sites ($ 2.63 / month) allocate 50 GB.

The provider is famous for reliability, durability – your site will never be closed just because one of the competitors filed a fake or even well-founded complaint. Hosting servers work in the cloud, CDN technology is used, so their location does not affect the speed of sites. 

You will need a new database to work with site materials. Go to the “Databases” section, then to the “Create a new database” field, then enter the username, database name and password to access it. Next, from the “Softaculous App Installer” section, select WP and start the automatic installation. In the process, you will need to specify the newly created database. Now you have hosting with WP installed and the database that is ready to work.

Bluehost provides round-the-clock technical support, donates a domain for the first year (if registration is required), free SSL, and provides 100% moneyback for 30 days. For optimized WordPress hosting, you will also receive automatic installation and upgrades to new versions, access to Microsoft Office 365, domain mail, hundreds of free templates, as well as a convenient and powerful control panel.

STEP 2 – WORK WITH THE DESIGN

Depending on which way you choose – the selection of a similar topic, the use of the plugin to transfer the existing or its manual adaptation to use in conjunction with WP – you can opt for three different algorithms. We present them in general terms.

Choose a new template

Find the template store using the “Design” section in the control panel in your site’s dashboard. Choose the right one, install it with one 1 click and make it active. You can adjust its design to your requirements (logo, columns, colors, background, etc.). The easiest way is to create a site from scratch on WP with a new template and then adjust its functionality and transfer content.

HTML template conversion

At this stage, third-party web services that can help you process and generate a suitable WP design based on the HTML theme (like Theme Matcher) will come in handy to you. Just enter the current domain name, and the service converts the theme files to WP format. Then you download and install them using the control panel as a new template. Usually, the result is good but may require certain refinement. This is the best option for those who want to keep the design (at least the basic elements) but do not have programming skills.

Manual adaptation of the template under WP

WordPress themes consist of several files – style.css, index.php, header.php, sidebar.php, and footer.php. You need to create empty blanks for them and then dig into the HTML template, selecting the necessary elements (styles and HTML structure) and inserting them into the desired files of the future WP template. You will also need to add elements of CMS syntax in different areas for the theme to be accepted by the system. This is a job for a specialist. Beginners can not afford it, so we will not even describe the process in detail.

STEP 3 – CONTENT TRANSFER

Transfer materials manually

If you have little content, it’s best to use this option. For this purpose, it is necessary to copy the HTML code of materials in the editor. We copy only the code enclosed in the <body> </body> tags. Everything above or below is a technical part that is not required for WordPress pages. You will need a separate copy of the pictures – it is better to leave their names the same, then the code will pick them up as is. Don’t forget to add SEO data through the editor or the interface of the corresponding plugin.

The method can lead to some display errors – it depends on the nature of the content and the WordPress template you use. Most likely, something will have to be corrected manually, bringing the formatting to the desired condition.

Important: If the link structure on the new site is different from the old one, it will stop working. You will need to configure 301 redirects to redirect visitors from old links to new ones (with small amounts of content you can edit .htaccess) or edit all site links to a new format (manually or using a plug-in like Redirection).

Automatic transfer with a plugin

This method is advantageous to those websites that have a large collection of articles published on their pages. The most popular plugins for automatic transfer are Import HTML Pages and HTML Import 2, which can be installed from the control panel by searching by name in the plugin library. They give a very similar result. The quality of design adaptation is at an average level. Much will have to be completed manually. But the plugin will help to perform routine work in large quantities, saving a lot of time and effort.

STEP 4 – PERFORMANCE TESTING

It’s time to check the work of the new site on several points:

  • Broken links. Make sure all links are working. If there are many pages and links, it is better to use the Xenu’s link sleuth or their plugins for checking links.
  • Beaten links. If you converted the design or created the template manually using the old one, there may be display errors. Inspect everything – additional actions may be required to resolve the issue.
  • Functional disorders. Test everything on the site – forms, social panels, buttons, navigation, various options, players, etc. Make sure it all works properly.

STEP 5 – CONNECTING THE DOMAIN TO THE NEW SITE

So, you already have a WordPress-based site with customized design, functionality, and transferred content. Now you need to move from the technical domain to your own. Whichever registrar you buy the domain from, the next step you should take is to correct the values ​​of DNS servers in the domain control panel to those used by the new hosting provider.

Important: if your domain has been registered in the last 60 days, you will have to wait for the same time for the transfer. This is ICANN’s policy, the process cannot be accelerated. You also need to disable anti-theft protection in the domain control panel.

Bottom Line

When you move an HTML site to WordPress, the easiest way to use the updated design is to choose one of the ready-made templates. Plugins will help you in many stages, but you will not avoid manual work and programming completely. Pay attention to testing, do not forget to configure the necessary redirects, check the functionality of links and other functionality, and fill in the SEO parameters. Pick up and install the required plug-ins in advance.

For example, we have described an algorithm when you plan to change the hosting provider for a new site to WP. It is also possible to fill the WordPress site on the hosting that serves the current HTML site. You can build an updated site on the localhost (Openhost, Denwer, etc.) and then fill it there, fixing wp-config under the existing database and removing the old site from there. But this is a slightly different story.

More articles by themes
If you notice that your website starts redirecting users to unknown websites, it is likely it was hacked. WordPress...
If you notice your WordPress website doesn’t load as fast as it used to, chances are its performance is...
Security is all we need. There are many ways to make your website a safer place on the Internet....

Contact

Feel free to reach out with a member of our team! We are excited to begin our collaboration!
Alex Osmichenko
Alex Osmichenko
CEO, Founder
Dima Osmichenko
Dima Osmichenko
COO
Clutch Logo
Reviewed on Clutch

Send a Project Brief

Fill out and send a form. Our Advisor Team will contact you promptly!

    Note: We will not spam you and your contact information will not be shared.