Digital MarketingGeneral

Website Theme from a Static Html Template

How to Create a Website Theme from a Static Html Template

Some few years back creating a web site was a difficult task as surfers have to develop their site from static HTML and text. This was a technical process for many web owners who had to employ the services of experts to help them out. Customizing and upgrading the design on a website was equally technical and hard to accomplish.

Nevertheless, with the advent of WordPress and its open source system, this issue has been somewhat eliminated. Nevertheless, there are still some individuals who are stuck with sites that are created using the previous procedure. This is due to the fact that they do not know how to upgrade their website to a WordPress compatible one and they did not have trusted, expert hands to assist them with it.

A static HTML website could be manually upgraded to WordPress without modifying the design and web content on it, by creating a custom theme. This may sound like a difficult job to you too, but with the ideal guidance, you will be able to do the conversion with much ease. This article will furnish you with a step by step guide on how to develop a theme from an HTML template.

First, you have to create a folder for your theme and its files on your device. There is no particular place to save the folder. All you have to do is make sure it could be easily found when you require it. Afterward, you have to create files for index.php, style.css, sidebar.php, header.php, and footer.php by launching the code editor. The files should be saved in the folder that was created and saved in your device.

The following phase is easy and it requires to copy the CSS of your website and paste it into the new style.css file that you already developed. Nevertheless, you should only carry this out if you do not want to change the old design of your website. Otherwise, you can get an updated one that will develop a design of your choice.

Additionally, you should open your header.php file and after that copy and paste the code from the index.html and after that save the file. The part you should copy is code above the opening div class=” main”. In addition, you should copy all the code in the index.html file of your web site with the exception of class=” sidebar” and after that paste in the sidebar.php file you developed above and save.

Immediately after copying for and pasting into the sidebar.php file, you should copy the code that is left in your index.html file and paste it into your footer.php file and save. The same code from the index.html file that was pasted into the footer.php file should at the same time be pasted and saved in the recently developed index.php file. The next phase involves putting this code “<?php get_header ();?>” at the top of the index.php file of your updated theme.

You are at the same time required to paste this code “<?php get_sidebar (); ?>” and this code “<?php get_footer (); ?>” at the bottom of the updated index.php file. The former should be placed directly above the latter. To finalize the creation of the theme, you will require to incorporate some PHP code into the updated index.php file, which will display contents to your site’s visitors, and after that save and close the file. The updated theme is ready for upload. That’s all and you are good to go, read more on WordPress themes.

Tags
Show More

Leave a Reply

shares
Close
Close