CSS-Stylesheet
Hier finden Sie zahlreiche Tricks, um Ihr Webprojekt mit CSS-Code auf Vordermann zu bringen.
Wir empfehlen Ihnen den Einsatz eines Child-Themes – damit sind Sie sicher, dass Ihre Anpassungen bei einem Theme-Update nicht überschrieben werden. Wie Sie ein Child-Theme erstellen, erfahren Sie im Beitrag «Ein Child-Theme anlegen – ein Must im Webdesign».
Das Footer-Menu im Divi-Theme ist von Haus aus immer links ausgerichtet. Eine Option, um es zu zentrieren oder rechtsbündig anzulegen, sucht man vergebens. Dennoch ist das möglich: mithilfe von ein paar Zeilen CSS-Code.
Heute zeigen wir Ihnen eine kleine Verbesserung, die Ihrem Designprozess zu mehr Effizienz verhelfen kann. Wir zeigen Ihnen wie Sie die Standardhöhe (min. und max.) und die Standardbreite (min. und max.) des Builder-Popups im Divi-Theme festlegen und die Standardposition für das Popup auf der Seite bestimmen können.
Icons sind eine tolle Möglichkeit, das Menü der Website interessanter zu gestalten. Das richtige Icon sieht gut aus und gibt dem Nutzer einen Hinweis darauf, worum es sich bei dem Link handelt. Icons im Menü anzuzeigen ist überdies kein Hexenwerk.
Mit dem Divi-Modul «Blurb» (zu deutsch: «Informationstexte») lassen sich Zusatzinformationen in einer Box vorzüglich neben Texten platzieren. Das Modul lässt sich mit einem Icon versehen, das dann aber konsequent über dem Inhalt oder links daneben dargestellt wird. Eine Option für eine Darstellung rechts fehlt - sie lässt sich aber nachrüsten. Das geht ganz einfach.
Mit einem ganz einfachen Trick kann der Button im Divi-Theme mit einem sanften 3D-Effekt versehen werden. Bewegt man dann die Maus über die Schaltfläche wird diese (mit Schein) etwas angehoben.
Standardmässig macht das Divi-Theme aus jedem Menü auch eine mobile Variante für Tablets und Mobiltelefone. Das ist meist patent - oft braucht man auf diesen Geräten aber kein Footer-Menu. Wenn Ihnen das Standardmenu im Header auf Mobilgeräten ausreicht, deaktivieren Sie es doch einfach im Footer. Geht ganz leicht mit ein wenig CSS-Code.
Das Divi-Theme beinhaltet ein adrettes Zählermodul. Doch standardmässig zeigt dieses stets ein Prozentzeichen als Einheit an. Das passt natürlich nicht immer. Sie können das Zeichen aber auf einfache Weise entweder ganz ausblenden oder - noch besser - es mit einer anderen Einheit ersetzen.
Animierte Bilder und Texte sind eine grossartige Funktion, die Aufmerksamkeit erheischen und Ihre Website von anderen unterscheidet. Wir zeigen Ihnen hier, wie Sie ihren Bildern und anderen Divi-Elementen das «Schweben» beibringen.
Wordpress liefert ein Widget für Kategorien und Schlagworte mit. Damit lassen sich die verwendeten Taxonomien praktisch anzeigen und auch gleich mit den entsprechenden Übersichtsseiten verlinken. Das Styling der Widgets ist aber ziemlich haarig. Also habe ich kurzerhand selbst ein wenig getüftelt und mit PHP-Code ein eigenes Kategorie-Widget erstellt. Das können Sie auch.
Die Module Portfolio und filterbares Portfolio des Divi-Themes haben einige Einschränkungen: Der Titeltext und der Metatext (Kategorie) befinden sich unter dem Bild. Was aber, wenn Sie das ändern und auf dem Bild platzieren möchten? Dafür gibt es in den Modulen keine Einstellungen. Hier erfahren Sie, wie Sie den Titel- und Metatext über dem Bild im Divi Portfolio-Modul platzieren können.
Die beiden Divi-Theme-Module «Toggle» (bzw. «Umschalter») und «Accordion» (auch «Akkordeon» genannt) ähneln sich stark - und doch sind beide verschieden. In diesem Beitrag zeigen wir Ihnen den Unterschied zwischen den beiden Modulen und demonstrieren Ihnen eine einfache Lösung, um die Modul-Icons weg vom gewohnten Platz rechts nach links zu verschieben.
Im Divi-Theme können Sie die Titel und Überschriften via Customizer stylen. Es geht aber auch via CSS und wirkt global. Heute geben wir Ihnen einen kleinen Bausatz für individuell gestaltete Titel zur Hand.
Werbung
