These are the features we're going to change:


So, these are widgets - to modify them we'll go to Appearance > Widgets - Below Content Features

You'll see 3 text widgets - they all work the same way - let's open one and look at the HTML inside.


Let's also paste this HTML so it's easier for you:


<a href=""><span class="sr-only">Our Services</span></a>

<span class="footer-picture" style="background-image: url('');"></span>

<div class="footer-text">
<h3 class="footer-title">Our Services</h3>
<p class="footer-subtitle">Discover more</p>


Let's break it up into pieces and explain each piece.

  • The a href part is the link to a page. Replace whats between the "" with a link to your own page or post.
  • The sr-only part is not actually displayed on screen - it is for accessibility but should reflect the content.
  • The background-image: url('') part is the image. You can upload your own in the Media section and replace this path.
  • The footer-title part is the Title displayed on screen
  • The footer-subtitle part is displayed when the user hovers over a feature