Das Enfold Theme unter der Lupe: Features, Vorteile, Nachteile & Hacks

Das Enfold Theme erfreut sich mit über 250.000 Kunden größter Beliebtheit und ist eine österreichische Erfolgsgeschichte. Der Entwickler Christian „Kriesi“ Budschedl hat mit seinem Enfold Theme eines der besten WordPress Themes entwickelt. Was das Multi-Purpose Theme alles kann (und nicht kann) zeige ich dir in diesem Artikel.

Enfold ist extrem flexibel und richtet sich dabei nicht nur an WordPress-Einsteiger. Wer ein genaueren Blick auf das Enfold Theme wirft, wird merken, dass es nicht mit den üblichen Stärken und Features punktet. Und gerade das macht dieses Theme so außergewöhnlich.

Während andere große Themes mit vorgefertigten Demo-Layouts im dreistelligen Bereich daherkommen, bietet das Enfold Theme mickrige 28 Theme Demos. Auch die Demos machen jetzt nicht den Hyper-Future-Design Eindruck. Warum gehört das Enfold Theme trotzdem zu den am besten bewertesten Themes auf der ThemeForest-Plattform?

1. Die Enfold Theme Vorteile

Hier möchte ich nicht die üblichen Bullshit-Marketing Vorteile des Themes herunterbeten, mit denen auch jedes andere WordPress Theme kommt bzw. kommen sollte. Responsive Webdesign, WooCommerce-Kompatibilität, WPMl-ready usw. sollte heutzutage jedes Premium Theme für WordPress sein. Hier lässt auch das Enfold keine Wünsche offen und brauch sich auch nicht hinter dem Avada Theme oder anderen Platzhirschen verstecken.

1.1 Deutscher Support

Die Beliebtheit des Enfold Themes basiert sicherlich zu großen Teilen auf dem guten Support. Da das Theme aus Österreich kommt, gibt es sogar ein deutsches Support-Forum. Das ist einzigartig. Zudem hat Kriesi mittlerweile alle anderen Themes eingestellt, um sich direkt nur auf das Enfold Theme zu fokussieren. Mit 7 weiteren Mitarbeitern ist das Support-Team nicht das Größte – wohl aber das Fähigste!

Mit einer riesengroßen Community, etwas englisch (oder auch deutsch) und dem Support-Forum gibt es eigentlich keine Probleme oder Fragen, die jemand anderes vorher noch nicht gestellt hat. Über 140.000 Beiträge im Support-Forum vom Enfold Theme bieten dir eine riesige Ressource für deine Fragen. Und falls es den (sehr unwahrscheinlichen) Fall gibt, dass du doch auf ein einzigartiges Problem gestoßen bist, gibt es eine kompetente Antwort des Supports innerhalb von 24 Stunden.

Aber Achtung! Leider gibt es keine deutsche Dokumentation für das Enfold Theme. Das Backend ist jedoch in deutsch übersetzt. Falls dir eine deutsche Dokumentation wichtig ist, kannst du mal unten in die Kommentare schreiben.

1.2 Eigener Layout Builder

Das Enfold Theme basiert auf dem Avia Framework. Dieses Framework hat Kriesi extra für das Enfold Theme entwickelt. Dazu gehört auch der Avia Layout Architekt. Das ist der Page Builder des Enfold Themes. In meinen Augen der intuitivste und übersichtlichste Page Builder auf dem WordPress Theme Markt. Leider gibt es den Avia Layout Architekt nur zum Enfold Theme und nicht einzeln als Page Builder.

In Zeiten des Divi Builder und Elementor wirkt der Avia Layout Architekt etwas eingestaubt. Dennoch ist er übersichtlich, reduziert und du kannst mit ihm alles umsetzen. Auch das Raster (Grid des Themes) ist sehr übersichtlich und lässt sich intuitiv verändern.

Wer vom Avada Theme kommt und den Visual Composer kennt, wird sich über die Übersichtlichkeit des Avia Layout Architekten freuen.

Sicherlich gibt es heutzutage Live-Frontend Editor, mit denen du ALLES einstellen kannst. Aber mit vielen Möglichkeiten kommt auch eine hohe kognitive Herausforderung. Der Avia Layout Architekt ist logisch strukturiert und die Elemente sind übersichtlich in Tabs eingeteilt. Damit ist der Einstieg gerade für Neulinge einfach.

1.3 Aufgeräumter Code

Als WordPress Freelancer werfe ich mich meistens auch kopfüber in den Code der Themes. Und hier kann das Enfold Theme auf ganzer Linie punkten. Deshalb ist das Enfold Theme auch für WordPress Entwickler interessant. Natürlich profitieren Nicht-Coder auch von dem sauberen und semantischen Code. Der führt zu weniger Bugs und wird auch von Google (Suchmaschinenoptimierung) optimal gelesen.

Durch den sauberen Code kommt es zu weniger Konflikten mit Plugins.

Zudem erleichtert der Enfold Code auch Extras und andere Funktionen in das Theme zu integrieren.

1.4 Ladezeit

Das Enfold Theme reagiert öfter auf neue Entwicklungen (DSGVO, Cookies, Pagespeed, usw) im Webdesign-Bereich. Die Website Ladezeit ist ein wichtiger Rankingfaktor. Deshalb gibt dir das Enfold Theme verschiedene Möglichkeiten der Ladezeit-Optimierung.

Tolles Feature: Ungenutzte Elemente des Enfold Themes werden gar nicht erst geladen. Damit speckt sich das Theme selber ab.

1.5 Entwickler-Options

Als Entwickler bietet dir das Enfold Theme den perfekten Ausgangspunkt für dein neues Projekt. Viele Hooks und Filter erlauben dir umfangreiche Anpassungen am Theme updatesicher umzusetzen. Zudem kannst du jedes Element mit einer eigenen CSS-Klasse (oder ID) auszeichnen. Gerade auch der CSS-Code ist extrem semantisch und lässt sich extrem komfortabel anpassen. Da können sich andere Themes (wie das Avada Theme) eine Scheibe abschneiden.

Deshalb ist das Enfold Theme auch für Agenturen sehr gut geeignet.

1.6 Zurückhaltende Gestaltung

Was anfangs wie ein Nachteil klingt, kann auch ein Vorteil sein. Durch die zurückhaltende (altbackene?) Gestaltung, lässt das Enfold Theme viel Freiraum für deine Anpassung. Schlecht wenn du einfach eine Demo installieren willst und fertig. Gut, wenn du dein eigenes, individuelles Screendesign erstellt hast und das Enfold Theme nun als WordPress Grundlage dienen soll.

2. Die Enfold Theme Nachteile

Du hast sicherlich schon gemerkt, dass ich absoluter Enfold Fan bin. Okay: Ich gebe es zu! Die WordPress Projekte der letzten Jahr habe ich zu großen Teilen mit Enfold umgesetzt. Für meine Bedürfnisse und Anwendungszenarien ist das Enfold Theme einfach perfekt. Als absoluter Anfänger, der eine hyper-future Website mit wenigen Klicks bauen möchte, ist Enfold eventuell nicht optimal. Hier also die Enfold Theme Nachteile.

2.1 Wenige Demos

Wie oben bereits erwähnt, gibt es nur 28 vorgefertigte Demos für das Enfold Theme. Diese bilden viele Branchen ab:

• Blog
• Business Website
• Comming Soon Website
• Fotografie Portfolio
• Restaurant Theme
• One Page Layout
• Startup Business Theme
• Shop Theme
• Hochzeitswebsite
• Kirchen Website
• Baugewerbe Theme
• Landing Page Website
• Lifestyle Blog mit Enfold
• Minimales Portfolio Theme
• Hotel Website
• Spa Website
• Reise-Theme
• Consulting Theme
• App Demo Page
• Gesundheitscoach Website Demo
• Fitness Studio Theme

Dennoch können hier andere Themes wesentlich besser Punkten. Wenn du dir die Liste der besten WordPress Themes anschaust, findest du viele Themes mit Demos im dreistelligen Bereich. Falls du also vor hattest einfach eine Demo zu installieren (was auch mit Enfold mit einem Klick geht), dann solltest du dir vielleicht das DIVI Theme anschauen. Das Enfold Theme ist hier nur bedingt geeignet.

2.2 Kein Live-Editor

Live-Frontend Editor scheinen mittlerweile sehr trendy zu sein. Das Enfold Theme kommt mit einem tollen Page Builder. Dieser ist aber von Live-Frontend Editing weit entfernt. Du musst immer speichern klicken und die Seite aktualisieren. Für mich gehört das seit Tag 1 dazu. Dafür läuft das Enfold Theme stabil. Wenn du jedoch gestalterisch unsicher bist und nach dem Trial-and-Error Prinzip vorgehst, kann das ganze Speichern und Aktualisieren sehr zeitaufwendig sein.

2.3 Zurückhaltende Gestaltung

Zugegeben: Die Theme-eigene Typografie ist eine Katastrophe. Diese muss ich für jedes Projekt bearbeiten. Der Fließtext ist definitiv zu klein und auch die vielen Headlines mit Kapitälchen (Großbuchstaben) lassen sich meist schlecht lesen.

Zudem kommen viele Themes heutzutage mit weichen Schatten und extrem „apple“-isiert. Dagegen wirkt die Gestaltung des Enfold Themes sehr spartanisch und eben nicht besonders trendy. Deshalb solltest du gestalterische Anpassungen vornehmen. Als ausgebildeter Designer, freue ich mich meist auf diese Arbeit. Wer jedoch ästhetisch unsicher ist, sollte zu anderen Themes greifen.

3. Enfold Theme Shortcodes & Elemente

Der Avia Layout Architekt strukturiert alle Elemente unter den vier Tabs Layout Elemente, Inhalts Elemente, Media Elemente, Plugin Ergänzungen. Die einzelnen Elemente haben dann jeweils nochmal einige Optionen, die wiederum in Tabs strukturiert sind. Das macht das Enfold Theme trotz einer gestiegenen Komplexität noch recht übersichtlich. Im Folgenden werde ich die einzelnen Elemente vorstellen.

3.1 Layout Elemente

Der Reiter Layout Elemente beschäftigt sich ausschließlich mit dem Raster. Das sind die Spalten deiner Website. Hier kannst du grobe Layouts festlegen. Die Breite des gesamten Containers (also 1/1) kannst du übrigens unter Enfold Theme -> Allgemeines Layout -> Abmessungen einstellen. Die Containerbreite ist standardmäßig 1310px.

Parallax Hintergründe und Video Backgrounds lassen sich mit der Farb-Sektion realisieren. Dabei ist die Farb-Sektion immer Full-Width. Beim Anlegen von Raster-Layouts solltest du semantische Blöcke immer in einer Farb-Sektion gruppieren.

3.2 Inhalts Elemente

38 Inhaltselemente stehen dir zur Verfügung. Besonders schöne Elemente sind die Symbol Listen, Tab Sections, Accordeon, Post Slider,Prozess Balken und die Kunden Empfehlungen. Damit kannst du tolle Webseiten bauen.

3.3 Medien Elemente

Media Element bezeichnet alles Visuelle. Dabei gibt es Bilder, Videos (auch per Lazy-load möglich), Gallerien und Slider. Hier findest du auch Google Maps. Ist ja irgendwie auch ein Bild. Besonders der Accordeon Slider ist wunderschön und vielseitig. Jedem Bild kannst du auch eine Eingangsanimation zuordnen.

3.4 Plugin Ergänzungen

Hier tummelt sich alles was irgendwie per Plugin in das Enfold Theme eingebunden wurde. Das Meiste davon ist wahrscheinlich von WooCommerce. So kannst du hier WooCommerce Produkt Slider, Produkt Raster und anderes einfügen. Damit kannst du auch deine eigene Produkt- Unterseite bauen.

4. Das Enfold Theme – Für jeden geeignet?

Wie bereits erwähnt, ist das Enfold Theme nicht für jeden optimal geeignet. Sicherlich ist es mein Lieblingstheme weil ich den Code über die Jahre mittlerweile fast auswendig kenne. Apropro: Enfold Freelancer gesucht? ;)

Falls du dich überhaupt nicht mit CSS auskennst und auch nicht weiter damit auseinandersetzen willst, kommst du mit den überschaubaren Demos schnell an die Grenzen des Themes. Wer also nicht technisch versiert ist und auch nicht davor zurückschreckt mal ein paar Zeilen CSS zu schreiben, sollte ein anderes WordPress Theme wählen. Schau dir einfach den Die besten WordPress Themes Artikel von mir an. Hier wirst du auch Themes finden die dir 300 vorgefertigte Demos bieten können. Damit schaffst du dir deine eigene individuelle Website mit nur wenigen Klicks.

Falls du also ein Entwickler bist und ein stabiles und valides Theme suchst, dann bist du mit dem Enfold Theme gut beraten. Viele Funktionen und Animationen sind bereits vorhanden und du musst nicht bei 0 anfangen. Das Avia Framework steht anderen Frameworks in nichts nach und wird auch weiter entwickelt. Mit ein bisschen Übung kannst du sogar eigene Content Elemente erstellen und in den Avia Layout Architekten integrieren. Damit können deine Kunden diese Elemente auch per Drag und Drop selber einsetzen.

Anfänger sollten eher zum DIVI Theme greifen. Für fortgeschrittene WordPress Benutzer bietet das Enfold Theme jedoch den nötigen Code-Freiraum. Auch für Agenturen lohnt sich der Blick auf das Enfold Theme.

5. Beispiele – Das Enfold im Einsatz

Ein Bild sagt mehr als tausend Worte. Und eine Website mehr als ein Enfold Erfahrungsbericht. Deshalb habe ich dir hier mal einige Website Beispiele zusammengesucht, die auf Enfold basieren. Übrigens basiert meine eigene Website kopfundstift.de auch auf dem Enfold Theme.

6. Tipps, Plugins & Tricks zum Enfold Theme

Auch für das Enfold Theme gibt es Addons, Tipps und Know-How, welches ich über die letzten Jahre angesammelt habe. Falls du auch ein Addon entwickelt hast oder Erweiterungen für das Theme hast – stelle sie doch der Allgemeinheit zur Verfügung. Schreib in die Kommentare oder mir eine Mail.

6.1 Wiederholende Inhalte in Enfold

Falls du wiederholende Inhalte hast und diese nicht auf jeder Seite neu ändern möchtest, gibt es hier das Repeatable Content Addon für das Enfold Theme:

https://habenicht.io/product/enfold-repeatable-content/

6.2 WooCommerce DE Addon für den deutschsprachigen Markt

Um WooCommerce in Deutschland rechtssicher zu machen, brauchst du zusätzlich das Plugin German Market. Damit das German Market Plugin perfekt mit Enfold zusammenarbeitet, solltest du dir dieses kostenlose Addon besorgen:

https://kriesi.at/support/topic/woocommerce-de-erweiterung-fur-kriesi-themes/

Zusätzlich erhälst du noch ein paar Designanpassungen am Enfold Theme, die aus den längeren Sätzen resultieren. Ein Beispiel wäre zum Beispiel: „Add to Cart“ und „Zum Warenkorb hinzufügen“. Das kann im Enfold manchmal zu unschönen Designfehlern führen. Die WooCommerce DE Erweiterung schafft hier Abhilfe.

7. Das Enfold Theme aufgebohrt – Hacks & Snippets

Dieser Punkt richtet sich eher an die Enfold Developer. Es gibt ein GIT: https://github.com/KriesiMedia/enfold-library/

Es gibt keine Garantie auf Vollständigkeit. Beachte, dass du alle Änderungen immer in der functions.php des Child-Theme vornehmen solltest. Falls du ab hier nur noch Bahnhof verstehst, solltest du die Finger vom Code lassen, damit deine Enfold Installation keinen Schaden nimmt. Ab jetzt wird’s nerdy ;)

7.1 Enfold Actions, Hooks & Filter

Diese Hooks und Filter kannst du in die functions.php deines Child Themes einfügen. Dabei lässt dir das Enfold viel Freiheit. Falls du Beispielsweise Code nach der Navigation im Theme einfügen willst, hilft dir dieses Beispiel:

do_action('ava_after_main_menu', 'meine_eigene_funktion', 10);

function meine_eigene_funktion()
{
   echo '....Das ist eine Stringausgabe ....';
}

Du benutzt hier den Hook „ava_after_main_menu“ des Themes und fügst daran deine eigene Funktion mit dem Namen „meine_eigene_funktion“.

7.2 Typische Anforderungen

add_filter( 'avf_google_heading_font',  'avia_add_heading_font');
function avia_add_heading_font($fonts)
{
$fonts['Kaushan Script'] = 'Kaushan Script';
return $fonts;
}

add_filter( 'avf_google_content_font',  'avia_add_content_font');
function avia_add_content_font($fonts)
{
$fonts['Kaushan Script'] = 'Kaushan Script';
return $fonts;
}

add_filter('avf_postgrid_excerpt_length','avia_change_postgrid_excerpt_length', 10, 1);
function avia_change_postgrid_excerpt_length($length)
{
   $length = 100;
   return $length;
}

add_action('wp_footer', 'ava_producttablebtn');
function ava_producttablebtn(){
?>
<script>
(function($){
function c() {
if( $.avia_utilities.isMobile ) return;

$('.productsidetext').css('height', '');

var elementHeights = $('.productsidetext').map(function() {
return $(this).height();
}).get();

var maxHeight = Math.max.apply(null, elementHeights);

$('.productsidetext').height(maxHeight + 40);
}

$(window).on('load', function() {
c();
});
$(window).on('resize', function() {
c();
});
})(jQuery);
</script>
<?php
}

do_action('ava_after_main_menu', 'my_personal_code', 10);

function my_personal_code()
{
   echo '.... write the code you want to output ....';
}

// add something to header
function add_something_to_header(){

if (is_page(10)); {    
Hier den Code rein

 }

}

add_action('wp_head', 'add_something_to_header');

function add_custom_footercode(){
?>
<script>
YOUR CODE GOES HERE
</script>
<?php
}
add_action('wp_footer', 'add_custom_footercode');

/**** Portfolio umbenennen im Dashboard ****/
add_action( 'init', 'unregister_taxonomy_for_custom_label', 30);
function unregister_taxonomy_for_custom_label(){
  global $wp_taxonomies;
  $taxonomy = 'portfolio_entries';
  if ( taxonomy_exists( $taxonomy))
    unset( $wp_taxonomies[$taxonomy]);
}

// portfolio args
add_action( 'init', 'init_reg_portfolio', 50 );
function init_reg_portfolio() {
  add_filter('avf_portfolio_cpt_args', 'avf_portfolio_cpt_args_mod', 50, 1);

  $tax_args = array(
    "hierarchical" => true,
    "label" => "Patente Categories",
    "singular_label" => "Books Category",
    "rewrite" => array('slug'=>_x($permalinks['portfolio_entries_taxonomy_base'],'URL slug','avia_framework'), 'with_front'=>true),
    "query_var" => true
  );

  $avia_config['custom_taxonomy']['portfolio']['portfolio_entries']['args'] = $tax_args;

  register_taxonomy("portfolio_entries", array("portfolio"), $tax_args);
}

add_action( 'after_setup_theme', 'init_reg_portfolio' );

function avf_portfolio_cpt_args_mod($args) {
  $labels = array(
    'name' => _x('Patente', 'post type general name','avia_framework'),
    'singular_name' => _x('Patente Entry', 'post type singular name','avia_framework'),
    'add_new' => _x('Add New', 'book','avia_framework'),
    'add_new_item' => __('Add New Patente Entry','avia_framework'),
    'edit_item' => __('Edit Patente Entry','avia_framework'),
    'new_item' => __('New Patente Entry','avia_framework'),
    'view_item' => __('View Patente Entry','avia_framework'),
    'search_items' => __('Search Patente Entries','avia_framework'),
    'not_found' =>  __('No Patente Entries found','avia_framework'),
    'not_found_in_trash' => __('No Patente Entries found in Trash','avia_framework'),
    'parent_item_colon' => ''
  );

  $args['labels'] = $labels;
  return $args;
}
/*** Ende ****/

/**** Content als Link in Lightbox öffnen ****/

function popup_inline() { ?>  <?php }

add_action('wp_head', 'popup_inline');
/*** Ende ****/

DAS IST DER LINKTEXT

.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}

function add_custom_code(){
?>
//YOUR CODE HERE

Um das Burger Menu auf größeren Bildschirmbreiten anzeigen zu lassen bitte Folgendes in deine CSS-Datei einfügen:
(Hier wird das Menu ab 1366px angezeigt)

@media only screen and (max-width: 1366px) and (min-width: 768px) {
  .responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item {
    display: none;
  }

  .responsive #top .av_mobile_menu_tablet .av-main-nav .menu-item-avia-special {
      display: block;
  }
}

7.3 Enfold Bildergrößen

Manchmal machen die Bildergrößen von Enfold irgendwie gar kein Sinn. Falls du die Bildgrößen ändern möchtest, kannst du das natürlich in der functions.php tun. Hier mal die Bildgrößen von Enfold: