Bitte wählen Sie ein Thema aus.

Animation im Filter-Portfolio-Modul anpassen

Im Divi-Theme ist ein Portfolio-Modul enthalten, welches mit Filtern dargestellt wird. Wechselt man den Filter werden die anzuzeigenden Beiträge elegant von links nach rechts ins Bild geschoben. Dieser Effekt lässt sich aber verändern: Beiträge können von rechts oder auch von oben - bzw. unten - einfliegen. Eine Petitesse vielleicht; aber ab und an mag das besser passen. Der Hack ist simpel - wir stellen Ihnen den Trick vor.

Mobilmenü des Divi-Themes am Seitenkopf fixieren

Während das Divi-Theme das Headermenu standardmässig am Seitenkopf fixiert, lässt Divi das Menu in der Mobilansicht verschwinden. Die Überlegung dahinter gründet im Platzbedarf: Auf den kleinen Anzeigen der Mobiltelefone und Tablets kann das Menü zuviel Platz beanspruchen. In besonderen Situationen möchte man aber das Menü immer sichtbar anzeigen. Freilich lässt sich auch dies ganz einfach bewerkstelligen.

Divi-Theme-Builder: Kopfzeile mit Telefon und E-Mail in einem Modul erstellen

Die Divi-Standardkopfzeile kann mit einer sekundären Kopfzeile konfiguriert werden, die unter anderem eine Telefonnummer und eine E-Mail-Adresse anzeigt. Wenn Sie jedoch eine mit dem Divi-Builder eine benutzerdefinierte Kopfzeile verwenden, können Sie diese sekundäre Kopfzeile nicht nutzen. Hier erfahren Sie, wie Sie den Telefon-/E-Mail-Teil in einem Modul nachbilden können.

Automatisch aktualisierte Jahreszahl berechnen und anzeigen lassen

Es ist üblich, die Anzahl der Jahre, die ein Unternehmen bereits im Geschäft ist, auf seiner Website anzugeben, vor allem auf der Info-Seite. Bloss veralten diese Angaben jährlich - und Updates gehen bei sowas sehr gerne vergessen. Hier zeigen wir Ihnen also, wie Sie einen Zahlenwert in Divi mithilfe eines Shortcodes und eines Snippets automatisch jedes Jahr aktualisieren können.

Ändern der Reihenfolge von Projekten im Divi-Portfolio-Modul

Standardmässig zeigt das Divi-Portfoliomodul Projekte in chronologischer Reihenfolge an, basierend auf dem Datum, an dem das Projekt veröffentlicht wurde, wobei das neueste Projekt an erster Stelle steht. Dies ist jedoch in vielen Fällen nicht sinnvoll, und es wäre besser, andere Sortieroptionen zu haben. Mit dieser Anleitung werden Sie in der Lage sein, die Elemente in alphabetischer Reihenfolge, in umgekehrt-alphabetischer Reihenfolge und in zufälliger Reihenfolge zu sortieren.

Datumsfelder im Format TT.MM.JJJJ automatisch umwandeln

Datumseingaben in Wordpress-Feldern lassen sich ganz einfach umformatieren: Hat man etwa 01.10.2023 - etwa als Geburtsdatum - in einem individuellen Feld erfasst, lässt sich dieser String ganz einfach ausdeutschen und mit ein wenig Code automatisch zu 1. Oktober 2023 umwandeln. Heute zeigen wir Ihnen, wie dies geht.

Divi-Elemente aus der Library mit Shortcodes einbinden und auf der Website anzeigen

Womöglich verwenden Sie auf Ihrer Website Elemente, welche an verschiedenen Stellen erscheinen, und die immer überall gleich dargestellt werden sollen. Beispielsweise für die Öffnungszeiten Ihres Geschäfts, die im Sommer und im Winter variieren. Dafür eignet sich die Divi-Library sehr gut. Die dort abgelegten Inhalte lassen sich dann überall wo gewünscht anzeigen - auch per Shortcode.

Header des Divi-Themes ausblenden

Das Divi-Theme blendet von Haus aus einen Header ein. Darin erscheint etwa das Menu und zusätzlich noch ein Logo. Ab und an möchte man aber diesen Standard-Header vollständig ausblenden - etwa auch, um ihn zu ersetzen. Wie das geht, zeigen wir Ihnen hier.

Beiträge in RSS-Feeds verzögern

Haben Sie schon einmal versehentlich einen Artikel veröffentlicht, bevor er hätte online gehen sollen, weil der Beitrag nicht ganz vollständig war? Das haben wir alle schon erlebt. Mit einem einfachen Timer können Sie verhindern, dass ein solcher Text schon auf RSS-Feeds veröffentlicht wird.

Divi-Galerie im Vollbildmodus öffnen

Divi enthält ein Galeriemodul, mit dem Sie ein Raster von Bildern anzeigen können. Wenn Sie darauf klicken, öffnen sich diese Bilder in einem Leuchtkasten. Wenn Sie dieses Galerie-Popup stärker hervorheben möchten, erfahren Sie hier, wie Sie den Browser in den Vollbildmodus schalten können, während das Galeriemodul in der Lightbox angezeigt wird.

Breadcrumbs in WordPress anzeigen – ganz ohne Plugin

Wordpress sieht «Out of the Box» keine Breadcrumb-Navigation vor. Dabei ist eine solche besonders bei umfangreichen Webprojekten hilfreich und sinnvoll - auch weil Suchmaschinen die Breadcrumbs lieben. Zwar gibt es Plugins, welche nachhelfen; wir haben aber eine Lösung erdacht, die ganz ohne zusätzliche Plugins auskommt.

Beliebige Seiten oder Verzeichnisse von Domains an eine bestimmte Seite weiterleiten

Die übliche Umleitung via die Datei .htaccess leitet Anfragen genau so weiter, wie sie eintreffen. Das ist eigentlich gut und hilft, damit Suchmaschinen keine toten Links produzieren. Doch wenn die neue Domain auch eine neue Struktur aufweist, ist diese Umleitungsart nicht geeignet. Ein Verweis auf eine bestimmte Seite - meist die Startseite - ist dann hilfreicher. Das geht freilich ganz einfach.

WordPress die Anhangsseite für Medien austreiben

Wann immer Sie ein Bild in Ihre Wordpress-Mediathek laden geschieht es: Wordpress erstellt automatisch eine Anhangseite, welche unter einer eigenen URL erreichbar ist und das Bild darstellt. Kaum einmal sind diese Attachement-Seiten für User von Nutzen. Sie lassen sich aber komplett abschalten - das ist meist auch gut für die Suchmaschinen.

Divi-Blurb-Modul: Icon rechts neben Textblock platzieren

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.

Mobilmenü im Divi-Footer deaktivieren

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.

Einheit im Divi-Zählermodul ändern

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.

RSS-Feeds in WordPress deaktivieren

RSS-Feeds sind ganz patent: Besucherinnen und Besucher können einen RSS-Feed abonnieren und erhalten zukünftige Veröffentlichungen einer Website automatisch zugestellt - etwa per Mail oder auf dem Handy. Doch: nicht jede Website benötigt RSS-Feeds. Sie lassen sich darum in Wordpress ganz einfach deaktivieren.

Tastatur-Shortcuts für den WordPress-Editor

Nach wie vor erfreut sich der klassische Wordpress-Editor grosser Beliebtheit. Trotz des Gutenberg-Editors, der für viele Wordpress-Admins nach wie vor ziemlich suspekt ist. Ich selbst gehöre auch dazu. Der alte TinyMCE-Editor hat sogar ein paar Tastaturkürzel versteckt, welche die Arbeit zusätzlich erleichtern.

Sicherheit erhöhen – Trick #1: Die Datei wp-config.php schützen

Die Datei wp-config.php liegt im Serververzeichnis einer jeden Wordpress-Installation. Sie ist gewissermassen die Schaltzentrale von Wordpress und beinhaltet auch sensible Daten - wie etwa die Zugangsdaten (Server, Adresse, Datenbank-User und Passwort) der Wordpress-Datenbank. Wenn diese Datei in falsche Hände gerät - was sie allerdings kaum tut - dann lässt sich damit viel Unfug betreiben. Doch es gibt einen kleinen Trick, um die Datei wp-config.php zu schützen.

Kategorie- oder Schlagwort-Widget Marke Eigenbau – mit wenig PHP-Code

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.

Portfolio-Titel und Meta-Texte im Divi-Portfolio-Modul als Einblendung über dem Beitragsbild anzeigen

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.

Icons im Divi-Toggle-Modul und in den Accordions links statt rechts platzieren

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.

ALT- und Title-Tags aus der Mediathek in Divi verwenden

Im Bild-Modul des Divi-Themes lassen sich ALT-Texte, welche etwa das abgebildete Bild in Worten beschreiben, problemlos erfassen. Ebenso die Title-Tags. Wer aber - und das tun sicher viele - Bilder direkt aus der Mediathek übernimmt, wird bald feststellen: Weder die ALT-Tags noch die Title-Tags werden in Divi nicht angezeigt. Das lässt sich aber nachbessern und wir zeigen Ihnen, wie das geht.

Update-Option für das Divi-Theme ausschalten

Das Divi-Theme lässt sich in Wordpress automatisch aktualisieren. Das ist eigentlich keine schlechte Idee, denn Themes und Plugins sollten aktuell gehalten werden, um Sicherheitslücken zu vermindern. Jedoch kann das Update auch Fallstricke mit sich bringen - besonders bei umfangreichen Websites. In so einem Fall ist es klüger, Updates jeweils händisch auszuführen und zu kontrollieren, ob alle Funktionen noch wie gewünscht arbeiten.

Bildbeschnitt in den Blog-, Portfolio- und Galerie-Modulen des Divi-Themes stoppen

Das Divi-Theme ist ein ausgeklügeltes Tool mit zahlreichen Vorteilen und vielen Einstellungsmöglichkeiten – aber manchmal stehen wir vor einer Nische oder einer speziellen Herausforderung, die mit Divi nicht standardmässig möglich ist. So gibt es ein häufiges Problem mit dem Beschnitt von Bildern aus der Mediathek – namentlich in den Blogs, Portfolios und in der Galerie. Doch diese Probleme lassen sich lösen.

Zentriertes Logo im Divi-Menü beim Scrollen nach links verschieben

Das Website-Logo lässt sich im Divi-Menü zentriert darstellen. Es erscheint dann oberhalb der Navigationspunkte. Besonders wenn man dann das Menümodul auf «sticky» trimmt, bleibt so beim Scrollen oft ein sehr mächtiger Inhalt stehen, der Platz wegnimmt. Doch es gibt auch hierfür einen Trick, welcher das zentrierte Menü-Logo beim Scrollen ganz einfach nach links verfrachtet.

Bilder-Special – Trick #1: Bilder auf der Website vor «Hotlinking» schützen

Technisch ist es möglich, eine fremde Website mit Bildern zu illustrieren, welche auf Ihrer Website liegen. Statt eines Bildes auf dem eigenen Server, verweist man im Quelltext einfach auf einen entfernten Ort. Das nennt man «Hotlinking» – es ist eine Form von Diebstahl: Erstens wird ein Bild (meist) unrechtmässig verwendet, zweitens geht dem Bestohlenen Bandbreite verloren. Doch Sie haben eine Möglichkeit, Hotlinking auf Ihren Server zu verhindern.

Bilder-Special – Trick #9: WordPress das automatische «Lazy Loading» von Bildern austreiben

Zwei Binsenwahrheiten: 1. Bilder machen eine Website hübsch; 2. Bilder machen eine Website langsam. Um die Ladezeit der Website zu verbessern, hat Wordpress seit der Version 5.5 ein «lazy loading» eingebaut. Dieses bewirkt, dass der Aufbau der Website Step by Step vor sich geht. Aber es kann Situationen geben, wo einem Lazy Loading in die Quere kommt. Immerhin lässt es sich einfach abschalten.

Automatische Plugin-Updates in WordPress deaktivieren

Wordpress sieht vor, installierte Plugins automatisch zu aktualisieren. Doch diese Funktion ist nicht in jedem Fall gleich klug. Besonders wenn Sie eine umfangreiche, möglicherweise komplizierte Website bewirtschaften, kann ein automatisiertes Update der Erweiterungen auch mal zu Inkompatibilitäten führen. Mit einem einfachen Trick lässt sich das Auto-Update jedoch ausschalten.

Aufzählungsliste absteigend nummerieren

Ein kleiner handlicher Hack lässt die klassische Aufzählungsliste <ol> umgekehrt aufzählen: beginnend mit dem höchsten Wert und endend mit dem kleinsten. Dem HTML-Code wird nur ein kleines Attribut hinzugefügt, schon wird die Aufzählung rückwärts nummeriert.

Schlagwörter im Divi-Blog-Modul anzeigen

Das Divi-Theme verfügt über ein Blog-Modul, mit dem Sie eine Liste von Beiträgen anzeigen können. Sie können auch einige Details zusammen mit den Beiträgen anzeigen: z.B. den Autor des Beitrags und die Kategorien, zu denen der Beitrag gehört. Eine Sache, die Sie mit dem Blog-Modul nicht anzeigen können, sind die Schlagwörter (Tags) der Beiträge. Hier erfahren Sie, wie Sie die Schlagwörter im Blogmodul dennoch anzeigen können.

Mit zwei kleinen PHP-Hacks Beitragsübersichten für alle Lebenslagen selber bauen – der 200. Beitrag von Dr. Code

So ein klein wenig stolz sind wir schon: 200 Tipps und Tricks für Wordpress, CSS, HTML und das Divi-Theme haben wir bis zum heutigen Tag veröffentlicht. Heute wagen wir uns an ein klein wenig PHP-Programmierung. Wir bauen uns kinderleicht massgeschneiderte Beitragsübersichten. Vorzüglich geeignet für Widgets in der Seitenleiste - aber natürlich auch für anderswo.

Absendernamen in ausgehenden WordPress-E-Mails ändern

Wenn WordPress eine E-Mail-Benachrichtigung sendet, verwendet das System standardmässig «WordPress» als Absendernamen. Für Mails an Sie als AdministratorIn ist das ja noch OK – aber für Mails nach aussen (an Ihre WebsitebesucherInnen) sieht das etwas unprofessionell aus. Ändern Sie den Namen in eine echte Person oder den Titel Ihrer Website. Geht ganz einfach.

Werbung

 

Pin It on Pinterest

Share This