How To Make A Web Accessible Disclosure Toggle Using Shortcodes

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

How To Make Divi Accordion Accessible

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

How To Move Divi Top Header Inside Main Header

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

How To Add Current Year To Divi Footer

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

How To Move Astra Post Meta

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

How To Change Header Text In GeneratePress

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

How To Create A Child Theme For Any WordPress Theme

Child themes are a staple of every WordPress developer. There are times when the functionality provided by the theme developer doesn’t meet your needs and you want to add something else. I’ll often say in my tutorials to “edit the functions.php file”. Whenever I say that, I’m assuming you’re editing a child theme. You should

How To Change The Default Colors In WordPress Customizer

Many of the better WordPress themes add a color picker to the WordPress customizer. This makes it easier to design your website visually, rather than with code. When you use the WordPress Customizer, you may have seen something like this: The circled colours is what we’ll be changing today. Why go to the trouble of

How To Customize The Post Meta In Astra

Astra is a popular WordPress theme, that I use on many of my sites. It’s lightweight and looks great, but sometimes you just want to customize it more than it normally allows. Thankfully it has plenty of hooks. By default, the post meta in Astra looks like this: How to customize the post meta in

How To Change The WordPress Author Meta Link

I needed to change the author link in WordPress post meta. Most of the sites I work on are single author websites, so the Author page is just a copy of the blog page. I used to just use Yoast SEO to redirect the Author page to home. That’s ok, but it seems a bit