Enfold reimagined – Version 4.0

If Enfold were a new theme and we were to release it in 2017, that’s probably what it would look like

Everything in this release was geared toward the question: If we would release a new theme today, how would it look like and how would it behave? More detailed:

• Would we build the site with a frontend editor or still use a backend editor?
• How would it look like?
• Would we need another slew of elements for the builder or are we fine with what we got?
• What about the design of existing elements?
• Which demos would we need?

First of all, I think a lot of the decisions and assumptions on how a theme should work that we made back when we built Enfold are still valid. And I think a lot of our customers agree with us, since Enfold is still the best rated top seller on Themeforest with an astonishing rating of 4.85 out of 5. If you think about it, thats quite insane. Our rating gets worse if someone rates the theme with 4 stars; yet 4 stars is already considered an excellent rating :)

But there are always things to improve so here here are a few explanations, thoughts and conclusions for those questions above, and what we plan to do in the future:

#1) The Editor

These days one of the core experiences to improve is the way a website gets built. So the first question we asked ourselves was if a frontend editor should replace (or be added) to the backend advanced layout editor that we currently use.

There are a lot of merits for that argument, and the most noticeable one was that you can see how an element looks like while you are editing it. This is especially beneficial if you take new users into account, who have little or no idea how a certain element will look like if they change an option or setting.

On the other hand, we consider lay-outing a site with front-end editors a pain. We have not seen an approach by anyone yet which works as fine as the visual dumbed down version of a backend editor. Even with several prototypes built by ourselves, there was no way we could reproduce the super simple and clear process of building a layout in your backend.

So we decided to marry the best features of both worlds and heavily improved our backend editor with a lot more visual cues for layout elements like sections, grids and columns (which now display their backend color, their id, their background image and more…)

More importantly we also added a live preview window to most of the content elements, which allows us to show to users how their changes visually affect an element without the need to switch to the frontend.

I built the whole Enfold 2017 Demo with these features already implemented and really loved the experience, so I am very curious about your feedback :)

#2) Design and availability of layout builder elements

In general we don’t think that there are a lot of elements that would be totally necessary to add to the theme. We already got about 70 different ones (also counting the ones that are only activated when plugins like WooCommerce are active) and our demos show that you can build pretty much everything you can think off.

BUT: every now and then we encounter something nice on other websites or get feature requests that make total sense at the time and then decide to add that element. I still like that approach and I think we will keep doing that in the future. This was also the case with the latest element that got added, the tab section.

Customers have requested a tab element that can take full advantage of the layout builder for a while now, but since it required a lot of rewriting of the way the builder works in the backend, we postponed it time and time again. However with the latest release and with the extensive rewrites to the layout builder that we already did, the time for this element has finally come :)

In addition to that, now that we got a visual preview  for content elements, its also a lot easier for us to add more design options without overwhelming newer customers. The first few elements that received more styles to chose from are the progress bar, the testimonial element and the icon box but others will soon follow.

We also tried to streamline a lot of the design elements on our pages among all elements (e.g.: the loader that is visible once you click a light-box image, a portfolio Ajax item, a masonry load more button etc. was modernized and streamlined across all elements and also improved for retina display)

This is the way we intend to go forward in the future as well. Be careful with adding new elements, be careful with adding new theme options that don’t offer visual feedback, but try to add more options for elements that work with the preview window; and on top of that make sure that all of this stuff fits together well and then pack it into new amazing demos. Speaking of demos…

#3) The Main Demo

Another question to be asked when you release a new theme: How should the main demo look like?

We still like the Classic Enfold Demo that was released 4 years ago, but there are certain elements and design choices that look a little dated by now. They are still beloved by a lot of users, thats why we did not simply change existing elements, but as mentioned above, added additional style now that we got the preview window.

But in order to take full advantage of all the stuff that we built during the last 4 years we decided that we need a new main demo. This always takes a lot of effort, since other than the usual niche demo which seldom has more than 5-10 pages, these full feature demos have several hundred individual pages. We are really happy with the outcome and hope you like it as well!

The old main demo will of course still stay online and be available for demo import in the future.

And whats next?

Next thing on our agenda is to improve all the elements that could benefit from an overhaul on mobile devices. We have snuck a few things into this release already but will try to heavily improve the mobile experience with the next one. Feel free to leave any suggestions in the comment section of this post.

Last but not least we got the usual change log with a list of bug fixes and improvements.

Here are the most important changes.