Das WordPress-Theme Avada: ein Erfahrungsbericht

Vor einigen Wochen habe ich meinen anderen Blog vom Landleben auf das Avada-Theme umgestellt und dazu einige Fragen erhalten.

In diesem Artikel schildere ich dir daher einmal, wie Avada generell funktioniert, welche Vor- und Nachteile dieses Theme mit sich bringt und schließlich meine Erfahrungen beim Umstieg auf Avada.

Was ist Avada?

Ein Premium-Theme für WordPress. Dabei ist Avada so mächtig, dass es als kompletter Website Builder beworben wird. Salopp gesagt, änderst du mit Avada nicht nur das Aussehen deiner Webseite, sondern ihren kompletten Funktionsumfang.

Avada ist sehr flexibel, sodass du vollkommen unterschiedlich aussehende Webseiten damit gestalten kannst. Es gibt also nicht „den einen“ Avada-Look, sondern du kannst deine eigenen Vorstellungen sehr genau umsetzen. Die Prebuilt Websites geben dir einen Eindruck davon. Diese Demo-Layouts kannst du übrigens auch alle herunterladen und als Ausgangsbasis für deine eigene Webseite verwenden.

WordPress-Themes gibt es ja wie Sand am Meer, kostenlos wie Premium. Avada ist dabei seit langem das wohl meistverkaufte WordPress-Theme – nicht ohne Grund.

Hinter Avada steht nämlich nicht nur ein einzelner Entwickler, sondern mit Theme Fusion gleich eine ganze Firma. Für Updates und professionellen Support ist daher gesorgt. Du kannst also ziemlich sicher sein, dass Sicherheitslücken zeitnah geschlossen werden, regelmäßig neue Funktionen hinzukommen und du einen Ansprechpartner für etwaige Fragen hast.

Für rund 60$ erwirbst du die Lizenz für eine Domain. Den Preis finde ich fair, um den Dreh rum bewegen sich auch die meisten Premium-Themes.

Wie arbeitest du am besten mit Avada?

Egal ob du mit Avada einen frischen Blog startest oder ein bereits bestehendes Projekt umstellst – das ist nicht mal eben mit drei Klicks gemacht.

Weil Avada so mächtig ist, lege ich dir einige Tipps ans Herz:

Nimm dir genügend Zeit

Generell solltest du genügend Einarbeitungszeit einplanen.

Es dauert nämlich schon ein Weilchen, die ganzen Features und Möglichkeiten zu erforschen und damit herumzuexperimentieren. Ohne Zeitdruck macht das Ausprobieren einfach mehr Spaß!

Je nachdem wie groß dein Blog ist, nimmt das Einrichten und Umbauen dann auch einige Zeit in Anspruch.

Ich war unterm Strich mehrere Wochen lang damit zugange und habe mich immer wieder nach Feierabend drangesetzt. (Ehrlicherweise bin ich immer noch nicht ganz fertig, weil ich beispielsweise noch mehr Themenseiten zusammenstellen mag.)

Verwende eine Testumgebung

Bevor du deinen Live-Blog auf Avada umstellst, solltest du dich in Ruhe mit dem Theme und seinen drölfzighundert Einstellungen vertraut machen. Das geht am besten in einer Testumgebung. Dazu installierst du dir WordPress auf einer anderen (Sub-)Domain oder direkt lokal auf deinem Rechner. Ich nutze dazu das kostenlose MAMP, das unter Mac und Windows läuft.

Idealerweise klonst du deinen Blog, sodass du in der Testumgebung gleich mit den „echten“ Seiten und Beiträgen arbeiten kannst. Das erspart dir später viel Arbeit: alle Einstellungen von Avada kannst du nämlich einfach exportieren und schnell in den Live-Blog einspielen.

Daher kannst du viel Arbeit in aller Ruhe „hinter den Kulissen“ in der Testumgebung erledigen, ehe es an die eigentliche Umstellung geht.

Nutz das Child-Theme

In deinem Downloadpaket findest du Avada selber sowie ein Child-Theme. Verwenden solltest du auf jeden Fall dieses Child-Theme.

Wieso? – Ein Child-Theme erbt immer alle Features, bringt aber einen großen Vorteil mit sich: wenn du das Child-Theme modifizierst, wirkt sich das nicht auf das Original aus. Im Zweifelsfall machst du also nichts kaputt und bist damit auf der sicheren Seite.

Ausführlicher habe ich die Funktionsweise von Child-Themes vor einiger Zeit hier erläutert:

Erste Schritte mit Avada

Die Installation von Avada läuft wie bei jedem anderen Theme: hochladen, aktivieren, fertig. Anschließend wirst du aufgefordert, die zwei benötigten Plugins Fusion Core und Fusion Builder zu installieren. Diese liefern die für Avada nötigen Features.

Die anderen angezeigten Plugins sind optional – wenn du sie nicht brauchst, kannst du sie weglassen. Mit dem Kauf von Avada erhältst du übrigens Zugriff auf einige Premium-Plugins wie etwa den Revolution Slider.

In der linken Sidebar siehst du jetzt einen eigenen Eintrag für Avada:

Über Optionen stellst du die grundlegenden Eigenschaften deines Layouts ein: Farben, Schriftarten, Breiten, wie dein Header aussehen soll und so weiter. Das alles gilt erstmal global auf deiner ganzen Webseite – bei Bedarf kannst du es später aber gezielt an einzelnen Stellen (etwa für bestimmte Seiten) überschreiben.

Layouts und der Layout Builder sind eine Besonderheit von Avada. Hiermit definierst du die Inhalte und das Aussehen einzelner Bereiche deiner Webseite. Diese Sektionen kannst du dann für bestimmte Seitentypen festlegen.
Klingt kompliziert? Okay, ein Beispiel: der Footer auf deiner Startseite kann anders aussehen und andere Inhalte aufweisen als der Footer unter Blogeinträgen oder der auf normalen Seiten. Gleiches gilt für den Seitentitel, die Sidebar und so weiter.

Seiten und Beiträge erstellen

Avada ersetzt den Gutenberg-Editor, mit dem du normalerweise deine Inhalte in Blöcken anlegst. Stattdessen bringt es mit dem Fusion Builder und Avada Live zwei eigene Page Builder mit. Welchen davon du nutzt, ist Geschmackssache.

Du kannst einstellen, für welche Inhaltstypen du diese Page Builder nutzen möchtest. Ich habe sie für Seiten aktiviert, für Beiträge aber nicht. In den normalen Artikeln nutze ich die ganzen Extras eh nicht, die Avada mitbringt. Da bin ich schneller, wenn ich wie gewohnt mit Gutenberg arbeite. Auf Seiten schätze ich die Content Boxen & Co. hingegen sehr.

Der Vorteil vom Fusion Builder und Avada Live ist nämlich, dass du dir deine Inhalte sehr intuitiv „zusammenklicken“ kannst: du wählst die Anzahl der Spalten pro Container / Seitenabschnitt…

… und dann die gewünschten Elemente:

Das macht richtig Spaß! 🙂 Das Schöne ist ja, dass diese Dinger dann auch alle gleich funktionieren und gut aussehen. Natürlich kann man sich das alles sonst auch über diverse Plugins zusammenklöppeln oder selber programmieren, aber das ist deutlich aufwändiger.
Diese Auswahl inspiriert mich auch zu Gestaltungsideen, auf die ich vorher nicht gekommen wäre.

Avada live schalten in 10 Schritten

Wenn du soweit bist, kann es losgehen: du stellst deinen Live-Blog auf Avada um.
Folgende Schritte sind nötig:

1. Wähle in deiner Testumgebung Avada » Optionen » Importieren / Exportieren, um alle globalen Einstellungen zu exportieren.
2. Lade das Avada-Theme auf deinen Server.
3. Versetze deinen Blog in den Wartungsmodus, etwa mittels eines Plugins wie WP Maintenance Mode.
   Dadurch sehen deine Leser keine Fehlermeldungen oder zerschossene Layouts.
4. Aktvierie Avada bzw. das Child-Theme und gib den Lizenzschlüssel ein.
5. Installiere die von Avada benötigten Plugins.
6. Spiel die Exportdatei aus deiner Testumgebung ein oder stell die Optionen manuell ein.
7. Stell alle Seiten und Beiträge, die du mit Avada-spezifischen Features ausstatten möchtest, entsprechend um.
   Wie gesagt, am schnellsten geht das, wenn du das bereits in deiner Testumgebung getan hast und dann einfach in den Code-Editor wechselst, um den Code zu kopieren.
   Dieser Schritt kann superschnell gehen oder ewig dauern, je nach Menge deiner Seiten. 😀
8. Bau gegenbenfalls deine Menüs um.
9. Vergewissere dich, dass alle Seiten so aussehen, wie sie aussehen sollen.
10. Schalte den Wartungsmodus wieder aus.

Die Vorteile von Avada

Du siehst schon, ich bin sehr angetan von Avada. Sonst hätte ich mich auch nicht dafür entschieden. 😉

Der größte Vorteil ist für mich, dass es mir sehr viel Arbeit erspart. Zwar habe ich selber viele Jahre lang beruflich Webseiten entwickelt, aber das ist halt immer eine Zeitfrage. Gerade, wenn es um Responsiveness geht, also die Ausgabe auf verschiedenen Geräten wie Smartphones, Tablets oder großen Bildschirmen. Diese Zeit möchte ich mittlerweile lieber in das Erstellen der Inhalte selber stecken.
Um etwas auf Smartphones gezielt anders zu gestalten als auf Desktop-Rechnern, wählst du in den Einstellungen des betreffenden Elements einfach „small“ aus. Super simpel.

Theoretisch musst du nicht coden können, um dein Layout einzustellen. Eigenes CSS wird nur dann nötig, wenn du Plugins anpassen möchtest oder bestimmte Einstellungsmöglichkeiten nicht vorhanden sind.

Es gibt sehr viele richtig schicke und sehr unterschiedlich gestaltete Demo-Seiten, die du dir einfach klonen und an deine Bedürfnisse anpassen kannst. Du musst also nicht bei 0 anfangen. Das Verwenden mitgelieferten Elemente ist intuitiv und macht Spaß.

Die Dokumentation von Avada ist richtig, richtig gut! Bei vielen Themes besteht die Doku ja nur aus einer mehr oder weniger lieblosen Readme-Datei. Avada hingegen erklärt alle Features ausführlich auf der Webseite, oft auch zusätzlich mit Videos. Das kannst du dir also alles auch schon vor dem Kauf angucken und überlegen, was davon für dich nützlich sein wird.
Klick dazu auf avada.theme-fusion.com oben im Menü die beiden Punkte „Website Builder Features“ und „Design Elements“ an.

Ein Lob geht nicht zuletzt an den (englischsprachigen) Support. Ein halbes Jahr Support bekommst du kostenlos und ich habe da auch tatsächlich etliche Tickets gestellt. Die wurden zügig bearbeitet… allerdings war die Antwort meistens ein „Sorry, das geht nicht in Avada“. Hrmpf.

Damit kommen wir zu den Nachteilen:

Die Nachteile von Avada

Dank des Layout Builders kannst du zusammenklicken, welche Elemente angezeigt werden sollen. Das ist erstmal eine nette Sache. Allerdings stößt Avada da auch mitunter an seine Grenzen. Denn nicht alles, was theoretisch in WordPress möglich ist, wird auch in Avada unterstützt.

Beispielsweise bin ich ein Fan davon, in Beiträgen nicht nur das Veröffentlichungsdatum anzuzeigen, sondern auch das Datum der letzten Aktualisierung. Dadurch siehst du als Leser direkt, ob ein mitunter mehrere Jahre alter Artikel noch regelmäßig überarbeitet wird. Wie das in „normalen“ WordPress-Themes mit etwas Code im Template geht, habe ich dir hier gezeigt.
Tja – bei Avada gibt es ein Element für das Published Date und eins für das Modified Date. Letzteres ist ein wenig „dumm“, denn man kann nicht einstellen, dass es nur dann angezeigt werden soll, wenn das Modified Date nach dem Published Date liegt. Im Falle von im Voraus geplanten Artikeln steht da dann „Veröffentlicht am 12. Dezember 2020 – zuletzt bearbeitet am 6. Dezember 2020“. Das ist verwirrend und dämlich und erfordert ein manuelles Workaround, zu dem ich bislang noch nicht gekommen bin.

Wie du gesehen hast, ist Avada wahnsinnig komplex. Wenn du einmal auf Avada umgestiegen bist, wirst du später deswegen wahrscheinlich nicht mehr zu einem anderen Theme wechseln wollen – einfach, weil du sonst alle Seiten und Beiträge wieder von Avada-Code befreien müsstest.

Unterm Strich überwiegen für mich klar die Vorteile von Avada.

Ich hoffe, dass ich dir mit diesem Erfahrungsbericht ein wenig weiterhelfen konnte. 🙂