Skip to content
  1. Home
  2. Inbound Marketing and Sales Blog

how to create a WordPress theme from scratch?

Index Content

If you want to create your website, one of the options you can use is WordPress, it is true that it may seem complicated at first glance, especially the fact of creating a template from scratch. This is a CMS that works with a system of templates that have a simple use and rapid development. If you do not want to use any of these templates, either because you do not find the ideal or because you prefer to give it a personalized touch, here we will teach you how to create one from scratch.

Basic knowledge you need to have to be able to create a template in WordPress

  1. HTML

    It would be convenient to create your WordPress template if you know something about HTML, which is the language that browsers interpret, so it is the basis for displaying your content. It is not very difficult to learn and it will allow you to design your website.

  2. CSS
    This is the language that gives style to your page, that is to say, that which improves the appearance of the web.

  3. PHP
    This is another programming language that allows the content you create to be dynamic. It is not necessary to have great knowledge of this language, it is not necessary to create a template to program your own functions as WordPress has all the functions you may need.

  4. WordPress
    If you are going to create a WordPress template, it is normal that you know the CMS perfectly, knowing how it works, as well as the entries, pages, configuration and so on.

what do I need to create a WordPress template?

Thanks to this list of tools that we show you below, you will be able to make things easier and faster:

  1. WordPress
    Of course, this is the CMS in which you are going to create the theme, so you will need to have the latest updated version.

  2. Local server
    You can perfectly create a template from scratch on WordPress hosting, but it is better to install a local server on your computer and work from there.

  3. Code editor
    There are many code editors, the most recommended for its extension and customisation is Visual Studio Code, which is also free, another plus for using it.

  4. Codex
    This is the official documentation for developers that is useful to better understand WordPress and its different functions.

how to create a WordPress template from scratch?

  1. Create the basics

    If you want to create a template from scratch, you will have to start as with everything else, from the base, we will take the base files and work our way up.

    At this point, the only thing you have is a plain HTML that WordPress does not recognise, so in order for it to detect your template, certain requirements must first be met. You must have the style.css and index.php files.

  2. Folder system
    The theme files must be all inside the WordPress theme folder. A folder called "raiola" is created where you can create all the files of the theme. Inside this folder you must copy all the content of the base HTML template.

  3. Style.css
    Wordpress will analyse all the folders reading the information of the "style.css" file inside each one. In the "raiola" folder that you have already created, you must create the style.css file and write the code with the information of the theme. When you have saved the changes, you will see that in the "Appearance > themes" menu your theme appears. Although there are still a lot of things to do.

  4. Index.php
    This is the main file of the theme, where we will see all the entries. In order to create it, take the index.html and create a PHP file called index.php with the same content. Save this in the theme folder. From this moment on it will be recognised as a WordPress theme, so you can activate it.

  5. Loop of posts

    This is the query WordPress makes to the database for posts. To use it in the template, go to the "BLOG POST" section and copy the HTML below:

    loop de entradas

    To be able to see the posts, you have to specify the properties of the WordPress functions. Here it will be used:

    • Title
    • Short description
    • Read more
    • Date
    • Author
    • Featured image

    After this, replacing the text with its PHP function, the posts are generated. We can now see something clearer!

  6. Theme functions

    There is a place to put all the functionality code: the functions.php file. Here we can find all the code that builds a specific functionality. Once we get to this step, to create the theme in WordPress, you will need to use a number of functions. First of all, create the functions.php file in the theme folder and write the code you need for the following functions:

    • Image size

    WordPress has five different image sizes by default: thumbnail, small, medium, medium, large and full size, so you should register the image size you need.

    tamaño de imagen

    • Title support

    You should let WordPress know that your theme does not include the <title> meta tag and that it can generate it.

    • Register styles

    It must also know the elements it is going to load, so you should queue the CSS stylesheets you need, using the wp_enqueue_style hook for them.

  7. Parts of the template

    In WordPress you can group the repeated elements in the web, the ones that are constant in all the web are:

    • header.php

    Go to the theme folder and create the file header.php, once there, cut the HTML code from <!DOCTYPE> to </NAV> and paste it in header.php. Now you have to go to index.php and call the file at the beginning of the document:

    header

  8. Custom Logo

    Enable the custom logo option and place it in functions.php. Now you can select a logo from Appearance > Customize > Site Identity. Then go to header.php and delete the site name line:

    logo personalizado

  9. Menu
    You must register it in functions.php and display it in header.php, so you can modify it under Appearance > Menus.

  10. Pagination
    If you have more items than you can display on a page, you should make it easier for the user to reach them, for this you can use the WordPress pagination function, paginate_links(), which creates them automatically.

With these simple steps you will be able to create a WordPress theme from scratch, now you only need to create the templates and you will have everything ready for your fully customised website.

Nueva llamada a la acción

You can be interested as well...

Elements, plots and benefits of storytelling Elements, plots and benefits of storytelling
how should I create a crypto ICO? how should I create a crypto ICO?
Create your buyer persona template step by step Create your buyer persona template step by step