How to convert an HTML Template to a WordPress Theme (2019)
You may have your own static HTML website that you want to convert to your own WordPress theme, or you found an amazing HTML Template that you want to use with WordPress but they do not have a WordPress theme available. This tutorial will explain to you how to convert an HTML Template to a WordPress Theme the simplest way possible.
To convert the HTML template to a WordPress theme, we will be using the latest version of WordPress, along with a handy plugin for WordPress called “Advanced Custom Fields” – this will allow you to retain the overall design which is hard to maintain if you purely use WordPress’ code editor. We will not use Gutenberg, so don’t worry.
Why would you convert a static html template or website to WordPress theme? Well, the reason is so that you can easily update it in future, it has all of WordPress’ SEO benefits and is much simpler to edit.
Converting an HTML Template or Website to a WordPress theme is not as hard as you think. This tutorial is 1.5 hours, and it will explain some basic fundamentals of converting your HTML theme to a WordPress theme but it does not mention absolutely everything.
If there are things you still want to know regarding converting an html template to WordPress, feel free to ask in the below comments and I will try my very best to assist you.
The HTML template we used was “Luigis” located here:
We used Advanced Custom Fields
Comments ( 45 )
Im cofused about how to show news that i wrote on the standard wp on my converted website ?
will this support woocommerce and other plugins?
I think this is not the correct way of developing a wordpress theme from HTML. Here you are using plugins to edit fields like best sellers but in actual if you want to add home page, you should do it by navigating to the appearance section.
in 32:39 im getting this error which breaks my website:
Parse error: syntax error, unexpected 'endif' (T_ENDIF), expecting end of file in C:xampphtdocswpthemewp-contentthemesthemefront-page.php on line 28
The site is experiencing technical difficulties.
I have a theme I want to convert to WordPress. Can you do that for me. How would it cost?
Thanks
thanks!!!!!!!!!!!!!!
"Our Menu" is not working for me!! what can i do
Mr Digital, please send me an email to carlsuccess@gmail.com. I need your help. Thanks
Dear sir I have created team section but now I am confuse to create single team member page that unique Id will fetch and pass to single team member page to fetch dynamic data…plz help…thanks
Awesome tutorial:-)
Thanks for the great tutorial Mr Digital!
I have a question:
If you want to add a 'contact us' page or other pages, should you add more template-*.php files (eg. template-contact, template-blog, template-services) and paste a corresponding HTML code in?
Bless you – I was hopelessly lost before I found this video! It's honestly the single most helpful tutorial I've ever found for WordPress
Hello, first of all thank you for this video. I did it so far til 16:23. Everything worked, but now, the images are not loading. I hav Windows XP 64 bit using a local Server with Wamp.
Do you have any idea what the problem yould be?
This person is underrated.. Great WordPress tutorial. I mean this man is the best wordpress youtuber i think
Thanks bro!
Great , Thanks 😉
sir please guide me ….. i do same as per your video guide line but images are not showing ….. what i'll do plz guide me???
Custom fields do not save. I get no error, nothing. Idk what is wrong…
Hello Sir, your video is really helpful. liked & followed.But i got 2 questions if you feel free please answer me:
Now i'm using elementor page builder & astra theme for e commerce website and i downloaded a beautiful e commerce Bootstrap4 HTML template on envato elements and i want this template overwrite my website.
So questions is how to do make the woocommerce data [products & users & reviews] & the sql data fit in the HTML template and previously i installed some plugin for customise the price calculation & options.So will those customised woocommerce set up be affected if i live the HTML template.
2nd question will the HTML template cause conflict with the elementor page builder?.If not will i still be able to edit the website front-end using the elementor page builder.
Hey, Mr D, can you please tell us the exact VS Studio Code theme you use, please. It's really clear and easy to copy from. Thanks.
Hi, Mr digital,
I watched the video it was so nice and it was helpful to completely your using custom fields for home. Your didn't used custom fields for inner pages means about and contact pages could please tell me how to use custom fields for inner pages.
Your using background image in the home page it but how to custom fields for sliders or carousels.Can please tell me..
Thsnk you, how to add breadcrumbs?
Thanks for this step-by-step tutorial, I really found it very comfortable to follow it, I tried to go a little further and do it with my own page created in html and bootstrap to try and I left almost everything at face value I was very happy, until I had an error in the navigation bar section. I don't get to take the classes well, I'm using bootstrap 4 the code that embed is this
array (
'theme_location' => 'top_menu',
'menu' => 'mainNav',
'container' => 'ul',
'menu_class' => 'navbar text-uppercase',
)
);?>
but it shows me badly the pages of the menu
This tutorial rocks! thank-you Mr Digital
I am getting this error:
Warning: get_headers() expects at least 1 parameter, 0 given in D:MainWorkXampphtdocswordpresswp-contentthemesgorsishopfront-page.php on line 2
when I add "<?php get_header(); ?>" it did not give me any error but it also didn't show the header.
The code editor I am using is suggesting me to use "<?php get_headers(); ?>". But when I use this it gives me the above-mentioned error.
UPDATE:
I just get my header code (Everything in index.php) and put it in the "front-page.php" and removed the "<?php get_heaeder();?> " line it worked for the most part at least.
Need large html template to convert into WordPress with CPT Custom post type
Sir i can't connect my css file to my frontpage. Php plz help me sir
Please make video HTML to wordpress dynamic wocommerce
Can you make 1 more HTML to WordPress but use CPT with ACF, explain different between those, try with more complex site
The package could not be installed. PCLZIP_ERR_BAD_FORMAT (-10) : Unable to find End of Central Dir Record signature
This is what i get when i try to upload theme on live wp… Can anyone help???
Hello, I have a problem with the code when I put it doesnt show me that section .
This is my initial code
<?php if( have_rows('servicios') ): ?>
<section class="section_servicios">
Hello sir Advanced Custom Fields pro download link
Thanks this video was a big help!
After activating the customized theme there shows nothing only a blank page i've copied section part to frontpage.php still it's blank. Can anyone help me? Thanks in advance
Brilliant!! ? Good job! Just… Wow…
Everyone saying this is so amazing – but you have to pay to create repeated fields with ACF so it's effectively useless if you aren't an ACF pro member
It's really nice that you allow us to rewrite your code from film. It's always a pleasure when I can do it. Good for you.
Regarding the pizza image … There is a 200size class added to the html code that resizes the images to 200 using css … I guess you missed that; more reason why you weren't sure why its acting as it was acting … Nice video
Thank you Mr Digital for such a nice tutorial.
what a time wasting in teaching PAID stuff however i learnedalot before pro stuff!!
Hi! Thanks so much for this awesome tutorial, it's exactly what I was looking for 🙂 I'm stuck on enqueuing CSS sheets, for some reason all I'm getting is a preloader on loop when I refresh the page. Any ideas? Any help would be appreciated 🙂
Hi, I am your fan you define everything very clearly and believe me I am here appreciate for all your efforts, I want you to create a another tutorial on the topic how to convert html to wordpress with visual composer or if you have it please give me a link I will be thankful to you
先ずテーマファイルがわからんか・・
Hello sir nice tutorial, but am facing a problem is not loading the bootstrap files and other files after enqueueing it .