• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

virusword.com

Learn Wordpress

  • Home
  • WordPress Shop
    • Fotopress
    • SEO Tool Kit
    • Social Contact
    • Tag Machine 2
    • Video Profits
  • Latest News
  • WordPress
    • Plugins
    • Themes
    • Tutorials
    • Videos
    • Woocommerce
  • About Us
  • Contact Us
    • Terms of Service
    • Privacy Policy
  • Show Search
Hide Search
Home/Videos/WordPress Theme Development Tutorial 2020

WordPress Theme Development Tutorial 2020



WordPress Theme Development Tutorial 2020

This wordpress theme tutorial will help those looking to make a new custom wordpress theme 2020. The wordpress tutorial covers how to create a WordPress theme using understrap, so if you are interested in how to make your own WordPress theme, this should have you covered. We use a combination of HTML, css, js with bootstrap.

00:00:00 – Introduction to WordPress Custom Theme Development
00:00:24 – WordPress Custom Theme Design
00:02:14 – Installing WordPress, Understrap, Database
00:07:02 – WordPress and Setup Custom Theme Understrap
00:10:27 – Website Custom Theme CSS and Header Preparation
00:12:00 – Header Layout
00:19:50 – Header and Navigation CSS Styling
00:26:10 – Website Custom Fonts Imported Google
00:28:42 – Header Menu Layout and Styling
00:33:54 – Header Top Section Logo Links
00:48:27 – Header Responsive Design
00:59:30 – Header Mobile Menu Button and Nav
01:27:10 – Header Logo and Nav for mobile
01:34:30 – Home Page Hero Banner
01:48:14 – Home Call to Action Section
02:10:20 – Home Welcome to Section
02:35:05 – Home News Section
03:07:35 – Home About Us Section
03:42:16 – Home Testimonials Section
03:55:30 – Home Newsletter Signup Section
04:15:26 – Home Social Media Section
04:34:17 – Home Footer and Contact Form Section
04:53:44 – Home Animation using Wow Animation.css
05:06:25 – WordPress Home Page Review
05:10:14 – Conclusion

WordPress Theme Development Tutorial 2020 | Part 2
Developing Internal Pages, Posts, Contact Us
https://youtu.be/ANGVvpe7oCw

Follow along on Figma with the Design UI:
https://www.figma.com/file/zrPD4gbiEi2J0YZYq5lrkt/WordPress-Theme-Development-2020?node-id=0%3A1

Code Snippets:
https://github.com/adriantwarog/code-snippets/blob/master/moshi.php

This WordPress tutorial for beginners 2020 will help you create WordPress theme for those people who are WordPress for beginners. WordPress theme 2020 tutorials are many, but this is a real world example of a WordPress theme 2020 for real world projects. If you are create WordPress theme and you want more content on how to make your own WordPress theme for the future, I can do more videos like this on the HTML, CSS, even the bootstrap designs and how I go about developing them!

Design for Developers – Enhance UI
A book I’ve created to help you improve the look of your apps and websites.
๐Ÿ“˜ Enhance UI: https://www.enhanceui.com/

#wordpress #theme #development

Follow and support me:
๐Ÿฆ Twitter: https://twitter.com/adrian_twarog
๐Ÿ’ฌ Discord: https://discord.gg/nGdThpE
๐Ÿ’ธ Patreon: https://www.patreon.com/adriantwarog
๐Ÿ–ฅ๏ธ Dev.to: https://dev.to/adriantwarog

source

Written by:
Abdul Wahid
Published on:
January 10, 2021

Categories: VideosTags: bootstrap, bootstrap 4, create wordpress theme, css, how to, how to create wordpress theme, how to make wordpress theme, how to make your own wordpress theme, html, theme, tutorial, wordpress, wordpress for beginners, wordpress theme, wordpress theme 2020, wordpress theme 2020 tutorial, wordpress theme development, wordpress theme development in easy steps, wordpress theme development tutorial, wordpress theme development tutorial 2020, wordpress theme tutorial, wordpress tutorial

Reader Interactions

Comments

  1. Adrian Twarog

    January 10, 2021 at 11:13 pm

    I am trying to grow my channel, so if you find this video useful, #subscribe & hitting the #bell ๐Ÿ™‚ Thanks for watching and hope you liked and learnt something new!

  2. ma3ster ูƒุจูŠุฑ

    January 10, 2021 at 11:13 pm

    Great. This is what i am looking for. Cool bro

  3. Karim Ayari

    January 10, 2021 at 11:13 pm

    This Part just static Page but what about dynamic I want to now how can I work with sections in WordPress
    But this is nice tutorial thank you ๐Ÿ˜Š

  4. James Welbes

    January 10, 2021 at 11:13 pm

    Can I use SASS without using GULP? Seems overcomplicated. I see there's a style.css in the root, and then a style.scss in the sass folder. If I save the style.scss file, it generates a style.css in sass/. Do I just need to enqueue that in functions.php or is there another/better way? If I do that should I "un-enqueue" the style.css in the root folder?

  5. Onesmus Manasseh Ziki

    January 10, 2021 at 11:13 pm

    I am stuck on the first part. I am trying to run gulp, It is refusing, It keeps on telling me no gulp file found. I tried copying the file to the main wordpress files folder. Now when I run the gulp, It asks me to install all dependences one at a time (eg plumber-gulp etc). What do I do ?

  6. soni singh

    January 10, 2021 at 11:13 pm

    Hello sir,

    I am stuck on one step in my project I want your help, will you help me to resolve it.

    I want to create on front end form which contains 5 fields Author name, Author Designation, Author LinkedIn link, Author Twitter link, and Author Summary.

    It's a taxonomy form. I have created a custom taxonomy in my theme the name of the taxonomy is a writer, but I want to user submit the writer details from the front end. But my code is not working. it's only accepting term name.
    Thanks for your time and help

  7. said hlimi

    January 10, 2021 at 11:13 pm

    Hi Adrian, amazing video thanks a lot for that!
    I ran into this issue, when i change the home-banner's image on sass->theme.scss it doesn't get reflected because there is an other version of it on css->theme.css!
    Any idea how to fix that please

  8. SADU Thinking

    January 10, 2021 at 11:13 pm

    Here is a special offer for you. To get the services of a giant who is one of the top ten web hosts in the world, at a low price. Go to https://www.bluehost.com/track/sadu_editors/ and GET STARTED now. Monthly packages and many more packages starting at $ 2.95 after experiencing the website for free. 24 hour service, Free Domain Name for 1st year, free SSL certificate Included, 1-Click WordPress install. Get your service today as the offer is limited. https://www.bluehost.com/track/sadu_editors/ Have a nice Day for you.

  9. THIEN.LDN5368 2175368

    January 10, 2021 at 11:13 pm

    Can you add subtitles? Please.

  10. Dhaloh

    January 10, 2021 at 11:13 pm

    Oh my.. this video is going to save my life. I have to develop a WP website as my final year school work and holy shit am I not ready. I was never taught to develop a WP site from scratch. THANK YOU SO MUCH

  11. Michael Allmis

    January 10, 2021 at 11:13 pm

    Why do you code things hard? The customer cannot change any texts himself. Doesn't that make the sense of a CMS superfluous or do I not understand something?

  12. Hemanta kakati

    January 10, 2021 at 11:13 pm

    when you can build theme in elementor too, why we should build it from scratch ???

  13. Ravi Kumar Rana

    January 10, 2021 at 11:13 pm

    What are the things to be considered while looking for a wordpress development agency in any particular area. If a business is looking to invest in redesigning the website on wordpress it definitely require the experts. I was search for wordpress development agency in Melbourne and landed up on https://www.sharpinstincts.com.au/wordpress-development/ can anyone share a review about this?

  14. neo90sr

    January 10, 2021 at 11:13 pm

    Is there a way to practice wordpress without paying? Ive tried using wordpress but im very limited with the free version

  15. Abhishek Sharma

    January 10, 2021 at 11:13 pm

    you just copied the host folder and pasted it .. you should explain the newbies like me how to create it and use it

  16. Zake AD

    January 10, 2021 at 11:13 pm

    just a question how we can add the slide by using the template of home (code) or something else

  17. Goldmaster

    January 10, 2021 at 11:13 pm

    nice music what is it?

  18. 1k In one month

    January 10, 2021 at 11:13 pm

    U are pro in this

  19. B F

    January 10, 2021 at 11:13 pm

    Did not understand the hosts file setup. Just leaving the hosts file in The Backbeach folder does not work. hosts file location should be in the drivers folder, no?

  20. Luis Gudmalin

    January 10, 2021 at 11:13 pm

    A good tutorial , but the way u write the scss and the styling overall is quite bad imo.

  21. Ricardo Mejia

    January 10, 2021 at 11:13 pm

    Where do I get that host file?

  22. Herramientas Digitales Para Emprendedores

    January 10, 2021 at 11:13 pm

    Me ayudo mucho para detallar unas dudas que tenia, muchas gracias, con esto ya podre implementar unas ideas que tengo para mi canal! ๐Ÿ˜€ te lo agradezco mucho! saludos!

  23. Ripon Roy

    January 10, 2021 at 11:13 pm

    Please do some some freelance based project.

  24. Al Sherif Ahmed Khalaf

    January 10, 2021 at 11:13 pm

    43456708 likes and thanks from me โ™ฅ๏ธ

  25. Crow

    January 10, 2021 at 11:13 pm

    Awesome tutorial, but I am a bit stuck with this.

    I checked the blog posts or any other type of posts and what I am getting is a broken nav bar.
    Could you please tell me if you have any videos for blog posts development or if you know any resource that can be of help
    Thank you

  26. ctrl_alt_delete

    January 10, 2021 at 11:13 pm

    I'm a great front end developer but I haven't learned any backend stuff, is it possible for wordpress do all the backend coding for me while I design the front end stuff. The reason is because I dont know php at all but I'm really good with python (but haven't tried django).

  27. Crow

    January 10, 2021 at 11:13 pm

    The tutorial is awesome, but do you have anything for customizing the blog post and single blog post pages. I am really curious about it

  28. sarjanadadakan

    January 10, 2021 at 11:13 pm

    5 hours and its free.. you're awesome

  29. Viola Blomsterbed

    January 10, 2021 at 11:13 pm

    Database ..intoxicating :)) Love it!

  30. rajan giri

    January 10, 2021 at 11:13 pm

    Awesome Content bro

  31. Goldmaster

    January 10, 2021 at 11:13 pm

    20:41 what if we want something like https://moby.com/homepage/ with just a navigation bar and a colour changing background?

  32. Goldmaster

    January 10, 2021 at 11:13 pm

    10:33 i get The term 'gulp' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path
    was included, verify that the path is correct and try again. i have got node js installed

  33. Omni Versal

    January 10, 2021 at 11:13 pm

    How do I make my theme multilingual? I used Loco Translate to translate my pages, but I want to add a language switcher to my navbar. I tried doing that with polylang and I added it to my mobile menu area but the flags' image tags don't appear in the html code when I want to display them in the dropdown list. I think that polylang is an extra work out and it might not be compatible with understrap. Is there a way to add a language switcher on my own?

  34. Rani Milne

    January 10, 2021 at 11:13 pm

    Hello Adrian! I am new hhear and I do sub and like your videos. Can you do tutorial how to do programming lesson from scratch and what are the structures and meaning of it. THanks in advance!

  35. Maarten Gruson

    January 10, 2021 at 11:13 pm

    Exactly what I needed! Thanks! I have one question, I downloaded an Enfold Theme. But there is no option to upload it in my WordPress account. Can someone help me with this?

  36. Ripon Roy

    January 10, 2021 at 11:13 pm

    Make a site using ACF, CPT, Shortcode & contact form/gravity form

  37. k d

    January 10, 2021 at 11:13 pm

    So I'm following along and I haven't finished everything yet, but at the moment I have made the template and I'm creating my own banner and editing the nav and everything. I'm noticing because of removing what you did earlier has caused the loss of the functionality of using blocks in WordPress editor as nothing typed in there affects the page now unless its just edited in the theme editor. Do you address this later in the video and if you do can you point me in that direction?

    Sorry for long-winded question. Still learning. I appreciate the video in general. So far it's been pretty helpful

Primary Sidebar

Wordpress

  • Content Management Systems (2)
  • Digital Marketing (4)
  • Internet Marketing (6)
  • Latest News (458)
  • Online Business (2)
  • Plugins (519)
  • Themes (521)
  • Videos (1,350)
  • Website Development (1)
  • Woocommerce (589)
  • WordPress (6)

Recent Articles

Unlock Your Internet Marketing Success with WordPress: The Ultimate CMS for Achieving Online Goals

WordPress: A Powerhouse for Achieving Internet …

Continue Reading about Unlock Your Internet Marketing Success with WordPress: The Ultimate CMS for Achieving Online Goals

Unlock Your Internet Marketing Potential with WordPress: A Comprehensive Guide

How to Use WordPress to Achieve Your Internet …

Continue Reading about Unlock Your Internet Marketing Potential with WordPress: A Comprehensive Guide

Search our site

Explore more

Get our Wordpress Guide Get Plugins Get Connected

Footer

VirusWord by Promaps, Inc.

Barnes Place
Colombo 7, Western 00700

Copyright © 2025 ยท Promaps, Inc.

Keep In Touch

  • Email
  • Facebook
  • Instagram
  • Pinterest
  • Twitter