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».
Mit dem HTML-Element button können Sie ganz einfach Schaltflächen erstellen. Mit der Zugabe von noch ein wenig CSS-Code, werden die Buttons überdies richtig schmuck. Drei Gestaltungsmöglichkeiten zeigen wir Ihnen in diesem Beitrag.
Fluid Typography ist ein Designansatz, bei dem die Grösse, der Zeilenabstand und die Proportionen von Text automatisch an die Grösse der Anzeige oder des Viewports angepasst werden, auf dem er angezeigt wird. Heute möchten wir Ihnen Fluid-Typography vorstellen.
Der Standardfooter des Divi-Themes verfügt über eine Creditleiste. Deren Breite ist abhängig von der Breite der Website und wird stets mit den identischen Massen dargestellt. Falls Sie die Credit-Leiste selber definieren möchten, können Sie dies ganz einfach tun.
Bilder lassen sich ganz einfach mit einem Glanz-Effekt versehen, sobald der Mauszeiger über das Bild bewegt wird. Dieser Hover-Effekt wird mit ein wenig CSS-Code erzielt.
Mit einem «Sticky-Widget» können Sie Ihrem Theme Widgets hinzufügen, die auch dann angezeigt werden, während der Benutzer auf der Seite nach unten scrollt. Wir zeigen Ihnen, wie Sie dem Divi-Theme einen «Sticky-Widget»-Bereich für die Seitenleiste hinzufügen.
Der Visual Builder des Divi-Themes bietet am Seitenfuss mehrere Buttons an, welche auf die gesamte Darstellungsbreite verteilt werden. Wer die Buttons lieber zusammen gruppieren möchte, kann diese auch auf einfache Weise links darstellen lassen. Wir zeigen Ihnen wie's geht.
Auf Ihrer Website können Sie ganz einfach Checklisten darstellen. Bloss ein wenig HTML- und CSS-Code ist nötig.
Aus dem üblicherweise horizontalen Slider-Modul des Divi-Themes lässt sich ganz einfach ein vertikaler Slider machen. Sie benötigen bloss ein wenig CSS-Code.
Wenn Sie viele Menüpunkte in Ihrem Divi-Menü aufführen, kann es vorkommen, dass es auf Mobilanzeigen höher ist als der anzeigbare Bereich des Displays. Gerade bei Untermenüs kann das schnell mal passieren und es können einige der Menü-Punkte abgeschnitten und nicht mehr erreichbar sein. Heute zeigen wir Ihnen, wie Sie das Divi Mobile-Dropdown-Menü bei Bedarf in der Höhe scrollbar machen.
Das Blogmodul kennt eine Rasteransicht und die Ansicht in voller Breite. Die Gestaltungsmöglichkeiten sind damit beschränkt. Eine interessante Form – nämlich die alternierende Anzeige des Beitragsbilds links und rechts – können Sie mit ein wenig CSS-Code erreichen.
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.
Keine Inhalte gefunden.
Werbung
