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».
Der Divi-Builder ist zwar famos – ab und an wird er aber nicht benötigt. Die Impressum- oder Disclaimer-Seite etwa könnten Sie auch ohne den Divi-Builder erstellen. Das lässt sich zwar schon machen – ergibt aber einen Schönheitsfehler: Der Abstand zwischen Inhalt und Footer fehlt. Lässt sich aber leicht beheben.
WordPress liefert ein Widget mit, um Beiträge in der Seitenleiste anzuzeigen. Wer jedoch das Divi-Theme benutzt und stattdessen die Projects auflisten lassen möchte, sucht vergebens. Die Projects lassen sich jedoch fast ebenso einfach auflisten, wie die WordPress-Beiträge. Wir zeigen Ihnen wie.
Neulich hat uns ein Mail erreicht: Darin war die Frage enthalten, wie sich Texte als Prägung auf der Website darstellen lassen. Natürlich ist das mit einem Grafikprogramm schnell gemacht – aber noch eleganter lösen wir dies mittels CSS-Code.
Ein Pre-Loader ist in der Regel eine einfache Animation, die angezeigt wird, wenn Ihre Website geladen wird. Er kann äusserst hilfreich sein, wenn eine Website komplex ist und ihre Ladezeit einige Sekunden beträgt. Um das Interesse Ihrer Besucher aufrechtzuerhalten und zu verhindern, dass sie durch das Warten frustriert werden, sollten Sie einen Pre-Loader erwägen. Wie Sie Ihre Divi-Website mit einem Pre-Loader versehen, zeigen wir in diesem Tutorial.
Zugegeben: Der heutige Hack ist eine Spielerei. Und gleich vorneweg: Er lässt sich mit beliebigen Elementen – also auch mit Texten u.ä. – bewerkstelligen. Aber am sinnvollsten (wenn sich denn überhaupt was drehen soll) sind schon Bilder. Wir zeigen Ihnen heute, was Sache ist.
Heute – zum Anlass des 500. Beitrags aus der Praxis von Dr. Code – stellen wir ein Tutorial zur Verfügung, mit welchem sich ganz einfach eine Lesefortschrittsanzeige auf der Divi-Website erstellen lässt. Sie besteht aus einem Balken, der auf 100 Prozent anwächst, je weiter in einem Beitrag gescrollt wird. Das hilft Ihren Leserinnen und Lesern abzuschätzen, wieviel Content sie schon bewältigt haben und soll sie motivieren, weiter auf der Seite zu bleiben.
Das Portfolio-Modul des Divi-Themes lässt einige Einstellungen zu; jedoch können Sie die Zahl der dargestellten Spalten nicht fix festlegen – es sei denn, Sie setzen CSS ein. Hier erklären wir Ihnen wie's geht.
Wichtige Textpassagen können Sie augenfällig unterstreichen – mit einer kleinen Grafik, die dann exakt unter den hervorzuhebenden Text platziert wird. Wie das geht, zeigen wir in diesem Trick aus der Dr.-Code-Praxis.
Das Standard-Menü des Divi-Themes zeigt – bei vorhandenem Submenü – einen kleinen Pfeil nach unten an, um anzuzeigen: Da kommt noch mehr. Dieses Symbol lässt sich auf den ersten Blick nicht anpassen – aber wirklich nur auf den ersten Blick.
Mit dem Divi-Theme können Sie einige der gängigsten SocialMedia-Symbole in die Kopf- und Fusszeile einfügen. Diese werden in einer festen Reihenfolge angezeigt. Sie haben aber die Möglichkeit, die Reihenfolge anzupassen – hier einige Möglichkeiten, die SocialMedia-Icon-Reihenfolge in der Fusszeile anzupassen.
Das Divi-Theme verfügt über ein Galeriemodul, mit dem Sie Bilder sowohl in einem Raster- als auch in einem Slider-Format anzeigen können. Im Slider-Modus zeigt das Galerie-Modul Navigationspfeile und Punkte an. Wenn Sie diese ausblenden möchten, genügt ein wenig CSS.
Die Standardkopfzeile des Divi-Themas enthält ein Suchsymbol, das beim Anklicken ein Suchfeld aufruft. Dieses Suchfeld enthält ein graues «Kreuz»-Symbol, das zum Schliessen des Suchfeldes verwendet werden kann. Wenn Sie eine andere Farbe wünschen, können Sie das Symbol selber gestalten.
Keine Inhalte gefunden.
Werbung
