How To Make A Full Width Divi Template For Gutenberg

Sometimes we want to use the Gutenberg editor for some of the simpler pages on a Divi site. I know, there are better ways, like using GeneratePress or Astra with Elementor or Beaver Builder. Those are my usual combinations when I know I’ll be building out a bunch of Gutenberg pages. But sometimes, you just

How To Make Divi Sections Be Full Width

Your web design layout will often call for full width rows. By default, Divi rows are set to a maximum width, usually 1080px. There are two main ways to get that full width look: Set the background color on the section, instead of the row Change the width and max-width of the row You’d go

How To Fix WordPress Theme Customizer Not Saving

I’ve been building WordPress websites since 2006 and hadn’t come across this one until today. I would make changes to the Advanced CSS in the Theme Customizer and it would show in the preview window. I’d hit publish and everything looked normal, but when I refreshed the page, the changes weren’t there. I tried everything

How To Change Astra Theme Default Text

As part of making your site feel more like your own, you might want to change some of the default text that the WordPress Astra theme adds. Common things I’m often asked to change are: Leave a Comment Your comment is awaiting moderation Sorry, but nothing matched your search terms. Please try again with some

How To Add A Blank WordPress Shortcode

Sometimes when you’re building a site you know you’re going to add particular functionality later, but you don’t want to delay launching the site while you build that functionality. You know exactly where it needs to go, and you’re going to use a shortcode to hook it in, but you don’t want to leave the

How To Add An Item To WordPress Theme Customizer

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

How To Change Footer Widget Title Heading Levels In Divi

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

How To Add A Custom Class To Astra Search Form

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

How To Add Custom CSS To WordPress Admin Area

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

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