Add PHP to a WordPress widget

Here's a useful little function for enabling PHP in the standard WordPress text widget. //enable php in text widget add_filter('widget_text','execute_php',100); function execute_php($html){ if(strpos($html,"<"."?php")!==false){ ob_start(); eval("?".">".$html); $html=ob_get_contents(); ob_end_clean(); } return $html; } It'll look for the...

How to change the size / aspect ratios of the portfolio grid images.

The portfolio grid is one of the better looking Divi features. I love that everything stays in a neat line on any device. The only problem is that not everyone wants a grid of ever so slightly landscape images. What if you want square portfolio images? or maybe you're an author looking to display book covers? The forced aspect ratio being applied...

Save these links if you want to be better at CSS / Divi

At least a few times a week I get asked “where can I go to learn more about this stuff?”. The ‘stuff’ being referred to is Divi, WordPress and CSS. In answer to that question, here are the links to the places I learned more about that stuff…. Bookmark this and feel free to add your own must have resources in the comments 🙂 30 CSS Best Practices...

The incredible versatility of the Divi default font

By default, the Divi Theme uses Open Sans as the font for all headers and paragraph text. You may sometimes find it boring, but hopefully after looking at this, you'll be filled with ideas on how to jazz it up. We offer you five examples of the default text and the CSS we used to change it.   1. Try auto capitalizing the first letter in...

Custom Single Post Template for Multiple Author Sites

  If you have a number of authors on a single site, you may like this single post template. It makes a couple of adjustments to the standard (non-page-builder) template used in Divi, as you'll see in the image above. A new meta style This template scraps the usual 'author | category | date' layout in favour of the author's avatar, name and...

Use the Page Builder for Pop Ups

*Fair Warning - This may take some playing about with. This tutorial is offered as a guide on getting it started.  I've been having a lot of fun getting the Divi modules to work in a pop up. Here's how I did it... Installing a pop up plugin First off, I'm not reinventing the wheel with this one. At its base we're relying on a tried and tested...

Cleaner Comments for your Divi website

If you're using the standard commenting system that comes with Divi then you may find this CSS snippet useful. It cleans up a few little quirks and adjusts the layout in a few ways: 1. Only the first comment will indent from now on, so you won't end up with the comment text getting crazy thin when conversations happen. 2. Sub-comment avatars are...

Add a ‘YouTube Style’ loading bar to the top of your Divi Theme

Here's how to add a 'loading bar' effect to the top of your page. This type of loading bar is used on sites like YouTube. We're adding it to Divi in this example but its the same concept for any WordPress website. We've based the code in this tutorial on code found here. Adding a loading bar to Divi This modification requires editing two files;...

A better mobile menu style for Divi

Here's a modification for your Divi mobile menu that does three main things. 1. Reduces the distance between the logo and the left side of the screen, and the closed mobile menu and the right side of the screen. This creates more of an 'app style' look and feel. 2. Changes the menu icon from three bars (or a burger) into a cross when the menu is...

Build a custom 404 / page not found template

If you know enough about PHP then replacing your 404 / Page Not Found template is fairly easy. But what if you don't? Wouldn't it be great if you could just build a normal page using the page builder you know and love and use that as the template instead? That's what I did when replacing the 'no-results.php' template for Divi Space. You can see...

How to create a ‘fly-in’ menu button

Animations are a great way to draw attention to a call-to-action on your website. There are plugins and things that you can use to add these types of animations, but for a simple 'fly-in' action on a header button, a little CSS is all you need. If you're reading this on a desktop, you'll be able to see that the 'shop' button is styled differently...

Avada, Divi & Enfold: most popular premium themes according to WPSniffer

The Divi Theme is currently second in a list of the most popular premium WordPress Themes, being beaten by Avada and chased by Enfold, according to wpsniffer.com. WPSniffer is a tool for detecting the use of WordPress themes from the front end of any website. At the time of writing 2,003 users had 'inspected' Divi powered sites in order to see...

Add PHP to a WordPress widget

Here's a useful little function for enabling PHP in the standard WordPress text widget. //enable php in text widget add_filter('widget_text','execute_php',100); function execute_php($html){ if(strpos($html,"<"."?php")!==false){ ob_start(); eval("?".">".$html); $html=ob_get_contents(); ob_end_clean(); } return $html; } It'll look for the...

How to change the size / aspect ratios of the portfolio grid images.

The portfolio grid is one of the better looking Divi features. I love that everything stays in a neat line on any device. The only problem is that not everyone wants a grid of ever so slightly landscape images. What if you want square portfolio images? or maybe you're an author looking to display book covers? The forced aspect ratio being applied...

Save these links if you want to be better at CSS / Divi

At least a few times a week I get asked “where can I go to learn more about this stuff?”. The ‘stuff’ being referred to is Divi, WordPress and CSS. In answer to that question, here are the links to the places I learned more about that stuff…. Bookmark this and feel free to add your own must have resources in the comments 🙂 30 CSS Best Practices...

The incredible versatility of the Divi default font

By default, the Divi Theme uses Open Sans as the font for all headers and paragraph text. You may sometimes find it boring, but hopefully after looking at this, you'll be filled with ideas on how to jazz it up. We offer you five examples of the default text and the CSS we used to change it.   1. Try auto capitalizing the first letter in...

Custom Single Post Template for Multiple Author Sites

  If you have a number of authors on a single site, you may like this single post template. It makes a couple of adjustments to the standard (non-page-builder) template used in Divi, as you'll see in the image above. A new meta style This template scraps the usual 'author | category | date' layout in favour of the author's avatar, name and...

Use the Page Builder for Pop Ups

*Fair Warning - This may take some playing about with. This tutorial is offered as a guide on getting it started.  I've been having a lot of fun getting the Divi modules to work in a pop up. Here's how I did it... Installing a pop up plugin First off, I'm not reinventing the wheel with this one. At its base we're relying on a tried and tested...