Elegant ThemesI first tried out some of the work of Elegant Themes a couple of years ago. Since then, their most popular theme Divi has been my go-to for several site builds. You can check out a few of those in the portfolio. It’s not perfect, but it was still the most efficient way to build a great site that I had available.

I was very excited when I heard about ET’s follow-up theme, Extra. Extra definitely has a few improvements over Divi, specifically when targeting a blog or magazine context.

The Divi Builder

The heart of what makes Divi and Extra so great is the Divi Builder. This is a tool for quickly adding and rearranging a lot of different functionality on pages, posts, and portfolio items. I’m not going to detail all of the different modules available, but it does cover a lot of ground including blurbs, sliders, videos, accordions, tabs, and images. These can be arranged in a variety of ways: full-width across the whole screen which has a smaller subset of eligible modules, the standard normal width, and specialized versions of normal width that have the ability to reflow depending on the length of the content. These functions really do go a long way to build a site very quickly and look very good while doing it.

Theme Options and Theme Customizer

The theme customizer – a standard for any WordPress theme – is very robust. You can define fonts for a variety of situations, although not nearly all – you will need to resort to manual CSS occasionally. You can set options like the number of footer widgets. You can change whether the top menu bar remains as you scroll or if it disappears, as well as whether to change anything about the main menu bar when scrolling. You can see on this site that I have the top bar disappearing and the main menu bar getting smaller once you scroll down. You can set defaults for buttons, although this doesn’t affect some other modules like the Call to Action, where you will still need to set your colours for every time. Other than sometimes being confusing to remember which elements are covered by changing a setting and which are not, this is definitely a great tool.

The theme comes with multiple other options in the Theme Options screen. A few highlights that are relatively simple but really helpful: the site logo, the site favicon, a global accent colour which will be your default in several different modules, default sidebars variable depending on the type of content, MailChimp integration, and social media icons. They’ve also moved where you put credentials for getting theme updates into this screen instead of your general settings where it was in earlier versions of Divi, which makes more sense.

I would love it to go a step farther on two of those points:

  1. It would be great if it allowed for defining an entire colour palette instead of just one accent colour. It would make a lot of work faster if any time you needed a colour, you could access all of them quickly.
  2. Regarding social media icons, I would like to be able to manually add new ones. For example, in the case of the MennoNerds website, I would really like to have also had a Facebook Group along with the Facebook page link.

Beyond that, for a theme that provides so many great options for customization, there are a few other things that I find strange to be missing:

  • I can turn off ratings one post at a time, but I can’t default to having them off.
  • I can’t turn off the featured image which takes up a lot of space on portfolio items. I was able to easily erase it by editing the file in a child theme, but that shouldn’t be necessary.
  • I can’t change the text in the footer without modifying the footer.php file. Again this needed a child theme but should have been a simple option.

Mobile Menu

There’s one major problem with the menu when looking on a mobile device/smaller screen: you cannot click to open any menu item that has children. Doing so only expands to show the children. The only way I can get to the parent page is to long press/right click, copy link, and then paste the link into the address bar. Most people aren’t going to do that; they would just assume there isn’t anything on that page directly to see. What makes this even more frustrating is that those parent pages remain active on the desktop menu, so it isn’t consistent by default. There is an option to make them inactive on the desktop, which would be consistent, but I preferred the default desktop behaviour…. and it doesn’t work, at least on this site, anyway. The best option left is to repeat at least some information so that everything can be available no matter which device a visitor is using.

Accessibility

Where Extra disappoints me the most is when it comes to meeting accessibility guidelines. There are several cases of this, so I’ll just give a sampling:

  • Site title is not contained within an h1.
  • Blurbs – a favourite feature of mine from the Divi Builder – creates double links. That means users tabbing between links on a keyboard get them twice, or users relying on a screen reader has the link said to them twice. It’s not the worst accessibility violation, but it’s annoying.
  • The sharing buttons at the bottom of each post and page are empty links.
  • “Next” and “Previous” arrows for pagination are empty links.
  • Search form is not properly labelled.
  • Map module has multiple problems including missing ALT text on images.
  • Header levels seem to be somewhat random on modules, so are routinely the wrong level. There is no option to change the header level.
  • Contact form module is not properly labelled.

Some of these I was able to fix with hours of work on a child theme. Others – generally some of the less severe ones, fortunately – I was not able to fix.

These problems alone make it hard for me to recommend Extra, although there are so many other great things about it. I have built two sites with it and am not sure I will do another unless they begin to fix some of these accessibility problems.