[et_pb_section fb_built=”1″ custom_padding_last_edited=”on|phone” admin_label=”Hero Section” _builder_version=”3.0.93″ background_color=”#3644af” background_image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/header-bg-3.jpg” custom_padding=”200px|0px|200px|0px” custom_padding_tablet=”200px||200px|” custom_padding_phone=”140px||140px|”][et_pb_row custom_padding=”|||” _builder_version=”3.0.93″ animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%”][et_pb_column type=”4_4″ _builder_version=”3.0.93″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title and subhead” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_text_color=”rgba(255,255,255,0.7)” text_font_size=”16px” text_line_height=”1.8em” header_font=”Montserrat|700|||||||” header_font_size=”50px” header_font_size_phone=”40px” header_font_size_last_edited=”on|desktop” header_line_height=”1.4em” header_2_font=”||||||||” text_orientation=”center” background_layout=”dark” max_width=”600px” module_alignment=”center” locked=”off”]

Making a WordPress Theme. From Scratch.

Research + Information Architecture

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Our Services” _builder_version=”3.0.92″ custom_padding=”100px|0px|100px|0px” saved_tabs=”all”][et_pb_row custom_padding=”0|0px|39.0781px|0|false|false” admin_label=”Title Row” _builder_version=”3.0.92″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_2_font=”Montserrat|700|||||||” header_2_font_size=”40px” header_2_line_height=”1.4em” text_orientation=”center” max_width=”601px” module_alignment=”center”]

Introduction

Making a new WordPress theme from scratch can seem daunting, but it’s pretty easy if you know the steps. This series will explore the techniques you need to employ to build a WordPress theme from scratch. In the series we will be covering:

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row make_fullwidth=”on” custom_padding=”|20px||20px” admin_label=”Services” _builder_version=”3.13.1″][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Research” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-1.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#1fb6ea” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Wireframing” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-2.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#3644AF” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Design” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-3.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=” #2A3443″ border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Development” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-1.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#1fb6ea” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Testing + Security” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-2.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#3644AF” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Marketing + SEO” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-3.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=” #2A3443″ border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Web Design CTA” _builder_version=”3.0.93″ box_shadow_style=”preset7″ box_shadow_horizontal=”0px” box_shadow_vertical=”-20px” box_shadow_color=”#f3f5f9″ custom_padding=”0|0px|0|0px|false|false”][et_pb_row use_custom_width=”on” width_unit=”off” custom_width_percent=”100%” custom_padding=”||0||false|false” custom_padding_tablet=”|||10%” custom_margin=”|||” custom_padding_last_edited=”off|desktop” padding_bottom_1=”60px” padding_left_1=”10%” padding_1_tablet=”|10%||10%” padding_1_last_edited=”on|tablet” admin_label=”Contents” _builder_version=”3.0.93″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ padding_tablet=”|10%||10%” padding_last_edited=”on|tablet” padding_bottom=”60px” padding_left=”10%” parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title” _builder_version=”3.13.1″ text_font=”||||||||” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_2_font=”Montserrat|700|||||||” header_2_font_size=”40px” header_2_line_height=”1.4em” max_width=”700px” module_alignment=”left” custom_margin=”|||” locked=”off”]

Research

So, you want to make a WordPress theme, from scratch. There are a few  questions you have to ask yourself at this stage.

  1. Why do you want to make a WordPress theme from scratch?
  2. What themes out there come close to what I want?
  3. What can I do thats better or different from the themes that are available?
[/et_pb_text][et_pb_text _builder_version=”3.13.1″]

Answering question 1)
Why Do I want to make a WordPress theme?

  • I have one already, in multiloquent, but it needs a refresh
  • I have a choice whether to refresh multiloquent, or to create a new theme from scratch
  • There are advantages to each, but overall, I feel that making a second theme will give me more benefits
  • I can use my experience making and maintaining a WordPress theme to make another
  • I can also get a series of posts for my blog while I’m doing it
  • I can also get a new theme for my blog once I’m finished!
[/et_pb_text][et_pb_text _builder_version=”3.13.1″]

Answering question 2)
What themes out there come close to what I want to do

  • lots of them come close visually
  • I don’t think any of them come close to what I want to achieve
  • I want a minimal theme, that has a nice default set of features
  • I also want to learn all the new features that have appeared in WordPress since I made the first iteration of multiloquent
  • I also want the theme to contain the cleanest html code possible
[/et_pb_text][et_pb_text _builder_version=”3.13.1″]

Answering question 3)
What can I do thats better or different from the themes that are available

  • I want the code generated by the theme to be concise, valid and lean.
  • I want the code generated by the theme to be fast (in Google Pagesspeed)
  • I want the theme to have every WordPress feature (tags, customising, etc)
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/laptop-right-overflow_2x.png” align=”right” always_center_on_mobile=”off” _builder_version=”3.0.93″ module_alignment=”right” custom_padding_tablet=”|||10%” custom_padding_last_edited=”on|tablet” animation_style=”slide” animation_direction=”right” animation_intensity_slide=”10%” animation_starting_opacity=”100%”][/et_pb_image][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Work Process Section” _builder_version=”3.0.92″ background_color=”#2a3443″ custom_padding=”176px|0px|100px|0px|false|false”][et_pb_row custom_padding=”0|0px|42.7656px|0px|false|false” admin_label=”Texts And Button” _builder_version=”3.0.92″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title and subhead” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_text_color=”rgba(255,255,255,0.7)” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_text_color=”#ffffff” header_2_font=”Montserrat|700|||||||” header_2_text_color=”#ffffff” header_2_font_size=”40px” header_2_line_height=”1.4em” background_layout=”dark” module_alignment=”left”]

Workflow

At this point you have a solid starting point, you have done some research, asked yourself some questions, gotten some answers and can start digging into the making of the theme.

Having the questions and answers at this stage will help you create a specification that will achieve your goals. This will help when you come to the implementation / testing stages – as you will have some conditions to test against!

[/et_pb_text][et_pb_text admin_label=”Title and subhead” _builder_version=”3.0.93″ text_font=”Ubuntu||||||||” text_text_color=”rgba(255,255,255,0.7)” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_text_color=”#ffffff” header_2_font=”Montserrat|700|||||||” header_2_text_color=”#ffffff” header_2_font_size=”40px” header_2_line_height=”1.4em” background_layout=”dark” max_width=”600px” module_alignment=”left”]In hac habitasse platea dictumst. Vivamus adipiscing fermentum quam volutpat aliquam. Integer et elit eget elit facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. [/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Mobile Design CTA” _builder_version=”3.0.93″ background_color=”#f3f5f9″ box_shadow_style=”preset7″ box_shadow_horizontal=”0px” box_shadow_vertical=”-40px” box_shadow_color=”#ffffff” custom_padding=”100px|0px|0px|0px”][et_pb_row custom_padding=”0|0px|42.7656px|0px|false|false” _builder_version=”3.13.1″][et_pb_column type=”4_4″ _builder_version=”3.13.1″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]

Template Hierarchy

Fortunately WordPress is really well documented. We have a starting point laid out for us while we create our information architecture for our WordPress theme – the WordPress template hierarchy tells us every file we need to create for every scenario.

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row make_fullwidth=”on” _builder_version=”3.13.1″][et_pb_column type=”1_3″ _builder_version=”3.13.1″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]

Starting from the right we can make the following files:

  • index.php
  • style.css
  • functions.php

We can then look at primary templates (you only really need to create these when making a new WordPress theme from scratch):

  • index.php
  • home.php
  • archive.php
  • search.php
  • singular.php
  • single.php
  • page.php
  • 404.php

 

 

[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.13.1″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]

Secondary templates (if not present, the corresponding primary template will be used)

These are great if you want a different layout or components eg in your author pages from your tag pages

  • front-page.php
  • author.php
  • category.php
  • taxonomy.php
  • date.php
  • tag.php
  • attachment.php
  • single-post.php

 

[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.13.1″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]

Post types:

  • Post (Post Type: ‘post’)
  • Page (Post Type: ‘page’)
  • Attachment (Post Type: ‘attachment’)
  • Revision (Post Type: ‘revision’)
  • Navigation menu (Post Type: ‘nav_menu_item’)
  • single-post.php
  • single-page.php
  • single-attachment.php

Attachment Mime types: WordPress also supports mime type templates:

  • image.php
  • video.php
  • pdf.php
  • text.php
[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Web Design CTA” _builder_version=”3.0.93″ background_image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/web-design-background-01.jpg” background_position=”top_left” custom_padding=”100px|0px|98px|0px|false|false”][et_pb_row custom_padding=”5px|0|0px|0px|false|false” admin_label=”Contents” _builder_version=”3.0.93″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title” _builder_version=”3.0.93″ text_font=”Ubuntu||||||||” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_2_font=”Montserrat|700|||||||” header_2_font_size=”40px” header_2_line_height=”1.4em” max_width=”500px” module_alignment=”left” locked=”off”]

Our File Hierarchy.

[/et_pb_text][et_pb_text _builder_version=”3.13.1″]

WordPress recommend following the twentyseventeen file hierarchy.

If we add those recommendations to our template hierarchy from the previous section, 
we end up with:

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0|0px|0px|false|false” admin_label=”Contents” _builder_version=”3.13.1″ module_alignment=”left” custom_margin=”|||200px”][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]


assets (dir)
– css (dir)
– images (dir)
– js (dir)
inc (dir)
template-parts (dir)
– footer (dir)
– header (dir)
– navigation (dir)
– page (dir)
– post (dir)
languages (dir)
404.php
archive.php
comments.php
footer.php
front-page.php
functions.php
header.php
index.php
page.php
README.txt
rtl.css
screenshot.png
search.php
searchform.php
sidebar.php
single.php
style.css

[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.13.1″]


optional:
author.php
category.php
taxonomy.php
date.php
tag.php
attachment.php
—–
optional:
single-post.php
single-page.php
single-attachment.php
—–
optional:
image.php
video.php
pdf.php
text.php

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Mobile Design CTA” _builder_version=”3.13.1″ background_color=”#f3f5f9″ box_shadow_style=”preset7″ box_shadow_horizontal=”0px” box_shadow_vertical=”-40px” box_shadow_color=”#ffffff” custom_padding=”100px|0px|0|0px|false|false”][et_pb_row custom_padding=”|0px|155px|0px|false|false” padding_top_2=”80px” padding_bottom_2=”80px” padding_2_last_edited=”on|tablet” admin_label=”Contents” _builder_version=”3.0.93″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/phone-portrait-white.png” align=”center” _builder_version=”3.0.93″ max_width_tablet=”600px” max_width_phone=”600px” max_width_last_edited=”on|desktop” animation_style=”slide” animation_direction=”left” animation_intensity_slide=”10%”][/et_pb_image][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ padding_last_edited=”on|tablet” padding_bottom=”80px” padding_top=”80px” parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_2_font=”Montserrat|700|||||||” header_2_font_size=”40px” header_2_line_height=”1.4em” max_width=”500px” module_alignment=”left” custom_margin=”|||” locked=”off”]

Information Architecture.

[/et_pb_text][et_pb_text _builder_version=”3.13.1″]

Information Architecture is the cornerstone of any website (or digital project in general).

At this stage we know every file that we will make, and their relationship to the content inside a WordPress site. This is a very good starting point for our Information Architecture.
In your own blog you would also include the content in the Information architecture, but we can skip that as we are making templates for others to use.

 

[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Work Process Section” _builder_version=”3.0.92″ background_color=”#2a3443″ custom_padding=”100px|0px|100px|0px”][et_pb_row custom_padding=”|||” admin_label=”Texts And Button” _builder_version=”3.0.92″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title and subhead” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_text_color=”rgba(255,255,255,0.7)” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_text_color=”#ffffff” header_2_font=”Montserrat|700|||||||” header_2_text_color=”#ffffff” header_2_font_size=”40px” header_2_line_height=”1.4em” background_layout=”dark” max_width=”600px” module_alignment=”left”]

Page-Level IA

What we do have to do though, is to make a list of each of the components we are looking to add to each of these pages. I like to do this part on paper (you can go back and make changes multiple times) and as part of a team (everyone has ideas to contribute) – but you can do it solo if needed)

I quickly came up with this as a starting point:

[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][/et_pb_column][/et_pb_row][et_pb_row make_fullwidth=”on” admin_label=”Work Process” _builder_version=”3.13.1″][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Post” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-2.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”20%” animation=”off”]

header
breadcrumb
post title
featured image
content
tags
comments
related posts
featured posts
json+ld markup
footer

[/et_pb_blurb][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Page” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-1.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_delay=”100ms” animation_intensity_slide=”20%” animation=”off”]

header
breadcrumb
post title
featured image
content
tags
comments
featured posts
json+ld markup
footer

[/et_pb_blurb][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Homepage” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-3.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_delay=”200ms” animation_intensity_slide=”20%” animation=”off”]

header
featured posts slider
featured posts from each category?
featured posts from the top categories?
recent comments?
intro text
json+ld markup
footer

[/et_pb_blurb][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Archive page” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-4.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_delay=”300ms” animation_intensity_slide=”20%” animation=”off”]

header
breadcrumb
archive name
number of posts
post block
title
featured image
comments?
dates ?
tags ?
pagination
json+ld markup
footer

[/et_pb_blurb][/et_pb_column][/et_pb_row][et_pb_row admin_label=”Work Process” _builder_version=”3.0.92″][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Header” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-2.png” admin_label=”Step” _builder_version=”3.0.93″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”20%” animation=”off”]

logo
hamburger menu icon
search field
login icons?
social icons?

[/et_pb_blurb][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Footer” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-1.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_delay=”100ms” animation_intensity_slide=”20%” animation=”off”]

recent posts
top posts
links to privacy policy, etc

[/et_pb_blurb][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Comments” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/process-icon-3.png” admin_label=”Step” _builder_version=”3.13.1″ header_level=”h6″ header_font=”Ubuntu|600|||||||” header_text_align=”center” header_text_color=”#ffffff” header_font_size=”16px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.5)” body_line_height=”1.8em” border_radii=”on|5px|5px|5px|5px” custom_padding=”|||” animation_style=”slide” animation_direction=”bottom” animation_delay=”200ms” animation_intensity_slide=”20%” animation=”off”]

author name
gravatar?
comments

[/et_pb_blurb][/et_pb_column][/et_pb_row][/et_pb_section][et_pb_section fb_built=”1″ admin_label=”Our Services” _builder_version=”3.0.92″ custom_padding=”100px|0px|100px|0px” saved_tabs=”all”][et_pb_row custom_padding=”0|0px|39.0781px|0|false|false” admin_label=”Title Row” _builder_version=”3.0.92″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text admin_label=”Title” _builder_version=”3.13.1″ text_font=”Ubuntu||||||||” text_font_size=”16px” text_line_height=”1.8em” header_font=”||||||||” header_2_font=”Montserrat|700|||||||” header_2_font_size=”40px” header_2_line_height=”1.4em” text_orientation=”center” module_alignment=”center”]

Next Steps

At this stage, I have enough to start making wireframes! I also have enough to start looking into the features that WordPress has available for each of the sub-sections and the functions available to me.

 

[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row make_fullwidth=”on” custom_padding=”|20px||20px” admin_label=”Services” _builder_version=”3.13.1″][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Research” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-1.png” admin_label=”Service” _builder_version=”3.13.1″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#1fb6ea” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Wireframing” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-2.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#3644AF” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Design” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-3.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=” #2A3443″ border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Development” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-1.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#1fb6ea” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Testing + Security” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-2.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=”#3644AF” border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][et_pb_column type=”1_6″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_blurb title=”Marketing + SEO” image=”https://jonathansblog.co.uk/wp-content/uploads/2018/09/icon-service-3.png” admin_label=”Service” _builder_version=”3.0.93″ header_font=”Montserrat|600|||||||” header_text_align=”center” header_font_size=”20px” header_line_height=”1.7em” body_font=”Ubuntu||||||||” body_text_align=”center” body_text_color=”rgba(255,255,255,0.7)” body_font_size=”16px” body_line_height=”1.8em” background_color=” #2A3443″ border_radii=”on|5px|5px|5px|5px” background_layout=”dark” custom_padding=”60px|30px|60px|40px” animation_style=”slide” animation_direction=”bottom” animation_intensity_slide=”10%” animation=”off”][/et_pb_blurb][/et_pb_column][/et_pb_row][/et_pb_section]