If you’ve not worked with it before, the WordPress Theme Customizer can be frustrating. The documentation assumes you already understand how it works. I’ll save a long discussion on how everything works for another day and dive right into adding a super basic item. The basic default Theme Customizer looks like this: We’re going to
For accessibility reasons, I needed to change the heading levels in the WordPress Divi footer widget titles on one of the sites I’m building. They are set to <h4> by default, but I needed them to be <h2>. The code to change the heading levels is: How This Works Divi’s setup for widget titles is
A friend had a question on how to add a custom class to the header search box in Astra that was too complex to answer in a Facebook post, so I’ll put it here. Essentially, he wanted to add a class to the input field which already has the class “search-field”. The class he wanted
Sometimes it’s nice to add a bit of custom styling to the WordPress admin area to make things stand out a bit better. Today I needed to resize a meta box in the sidebar of the Gutenberg editor. We had lots of options for membership levels, but it was annoying to have to scroll through
I spoke previously about how to make Divi’s toggle module web accessible, but what if you weren’t using Divi? I needed to have a disclosure pattern toggle independent of any theme. It needed to be setup using a shortcode with customizable content. Ideally, you’d want to wrap this into a plugin, but I’m going to
I was building an accordion in Divi, using the standard accordion widget. Checking it against the Aria Design Patterns for Accordions and the Accordion Example from W3, the Divi accordion module wasn’t following the correct labelling requirements. Perhaps by the time you’re reading this, it has been fixed. If not, I hope you find this
On the default Divi install, the top header sits outside the <header> section. For accessibility and web standards reasons, Divi’s <div id=”top-header”> should be contained within the main <header> section. The alternative is to wrap it in <div role=”banner”>, as explained at Deque University. How to move Divi top header inside the main header: Install
On all the websites I build, I put a “Copyright © 2020” in the footer, where the year gets automatically updated. The site that I was just working on had “Copyright 2018” in the footer. It was following the way Elegant Themes said to do it. No one wants to have to go in and
This tutorial is in response to a question from one of our readers. This tutorial will work with both the free and paid versions of Astra. We also have a tutorial on customizing the post meta appearance for Astra. You’ll need to have a child theme active. See our tutorial on building a child theme
I needed to change the header text in GeneratePress by adding a span around one of the words. I was trying to change the color of the last word of the title to a different color as illustrated below: Under most circumstances, to do a basic change to the header text in GeneratePress, go to
