Trick # 188 | Dieser Beitrag beinhaltet 631 Wörter. – Geschätzte Lesezeit: ca. 4 Minuten.
Dieses Sujet ist für mich ein Highlight. Und ums highlighten geht es auch gleich in diesem Hack: Die Beiträge, welche im Blog-Modul des Divi-Themes gelistet werden, können nämlich farblich unterschiedlich hinterlegt werden. So finden sich User noch besser zurecht und finden Inhalte zu Themen, die sie interessieren, besonders schnell. Das aufzusetzen, ist wirklich unglaublich einfach. Auch darum: Ein Highlight.
Konkret: Das Divi-Theme kann von Haus aus nicht unterscheiden, welcher Art die Artikel sind, welche in einem Blog-Modul angezeigt werden. Sie hingegen können das und vergeben vermutlich verschiedene Kategorien.
Das machen auch wir in der Praxis von Dr. Code nicht anders. Wobei WordPress jeder Kategorie einen Slug vergibt. Diese Slugs werden für diesen Tipp benötigt – Sie finden diese im WordPress-Backend unter Beiträge/Kategorien.
Wir verwenden etwa die Kategorien
- Divi-Theme – Slug: divi-theme
- WordPress – Slug: wordpress
- PlugIns – Slug: plugins
- Scripts – Slug: scripts
Nun benötigen Sie noch den CSS-Code, der die Farbe eingiesst. Der steht unten und gehört in das CSS-Stylesheet Ihrer Divi-Website – unter Design/Customizer/Zusätzliches CSS:
.et_pb_blog_grid .category-divi-theme.et_pb_post {
background-color: lightgreen;
}
.et_pb_blog_grid .category-wordpress.et_pb_post {
background-color: lightblue;
}
.et_pb_blog_grid .category-scripts.et_pb_post {
background-color: lightgrey;
}
.et_pb_blog_grid .category-plugins.et_pb_post {
background-color: pink;
}Betrachten Sie z.B. Zeile 4. Da steht .et_pb_blog_grid .category-wordpress.et_pb_post {
Der Begriff wordpress ist der Slug unserer WordPress-Kategorie und spricht also diese Beiträge an. Sie ersetzen diese Namen also mit einem Ihrer existierenden Slugs und schon funktionierts. Wichtig ist bloss, dass Sie dem Slug noch ein category- voranstellen. Anpassen möchten Sie vielleicht überdies auch die Hintergrundfarben.
Tatsächlich ein Highlight.
Unser Code ergibt übrigens folgende Blog-Darstellung:
Beitragsaufrufe-Special – Trick #2: Meistaufgerufene Beiträge im Admin-Dashboard anzeigen
Das Dashboard im WordPress-Backend ist der zentrale Anlaufpunkt für Administratorinnen und Administratoren, um einen schnellen Überblick über die Website zu erhalten. Heute zeigen wir Ihnen, wie Sie ein benutzerdefiniertes Widget erstellen, welches die beliebtesten Beiträge basierend auf ihren Aufrufzahlen direkt im Dashboard anzeigt. Damit haben Sie die letzten (und höchsten) Visitorzahlen Ihrer Posts stets im Blick.
Beitragsaufrufe-Special – Trick #3: Meistaufgerufene Beiträge in einem Sidebar-Widget darstellen
Womöglich möchten Sie die Aufrufstatistik der meistbesuchten Beiträge Ihres Blogs anzeigen. Dazu eignet sich ein Widget in der Seitenleiste ganz besonders. Wie Sie ein solches Widget erstellen, zeigen wir Ihnen im heutigen Trick.
Kurzlinks mit dem Gutenberg-Editor: URL-Shortener «Marke Eigenbau»
WordPress-Beiträge erhalten von Haus aus oft sehr lange URL, welche auf dem Beitragstitel basieren. Doch es geht auch kürzer: Mit einem URL-Shortener. Damit Sie aber nicht von externen Diensten abhängig sind, zeigen wir Ihnen heute eine Variante, wie Sie sowas selber umsetzen können. Der Hack funktioniert – anders als ein früherer Trick – auch mit dem Gutenberg-Editor von WordPress. Ein heisser Tipp für das Teilen von Beiträgen auf den sozialen Medien.
Admin-Link zum «Visual Builder» des Divi-Themes loswerden
Heute ein ganz kurzer Hack: Wenn Sie des Links im Admin-Menu auf den Visual Builder überdrüssig sind, dann lässt sich der ganz einfach ausblenden. Ein wenig CSS-Code und gut ist.
Tabellen stylen und Zeilen abwechselnd einfärben
Einst waren Tabellen auf Websites allgegenwärtig. Heute deutlich weniger – auch weil Tabellen im Responsive Design nicht ganz unproblematisch sind. Aber so ganz verzichten kann man denn doch nicht auf Tabellen. Damit sie aber wenigstens übersichtlich daher kommen, empfiehlt sich ein wenig CSS-Design. Zum Beispiel mittels abwechselnder Farbgebung.
Bild-Links in WordPress-Beiträgen deaktivieren
Eine Freundin hatte in ihrem umfangreichen Fotoblog hunderte von Bildern dargestellt. Unglücklicherweise war jedes einzelne Bild mit einem Link auf sich selbst versehen. Wir haben eine Lösung gesucht, um die Bildlinks in allen Beiträgen zu deaktivieren. Nun: wir sind fündig geworden.
Spam-Kommentare automatisch löschen
Spam-Kommentare können in WordPress schnell zur Plage werden. Sie verstopfen die Kommentarsektion und belasten die Datenbank. Manuelles Löschen ist zeitaufwändig, vor allem, wenn sich viele Spam-Kommentare ansammeln. Glücklicherweise kann dieser Prozess durch ein kleines PHP-Skript automatisiert werden.
Höhe und Breite des Divi-Button-Moduls definieren
Das Button-Modul des Divi-Themes enthält keine Option, um seine Höhe einzustellen. Aber in manchen Fällen möchten Sie diese vielleicht anpassen, damit der Button auf Ihrer Seite besser zur Geltung kommt. Hier zeigen wir Ihnen, wie Sie die Höhe des Divi-Buttons mittels CSS-Code anpassen können. Auch für die Button-Breite haben wir einen Hack parat.
Zoom-Animation für Bilder beim Page-Load
Das Internet lebt von Bildern – wahrlich eine Binsenwahrheit. Aber die Bilder lassen sich leicht animieren. So dass sie etwa beim Laden einer Seite automatisch ein- oder auszoomen. Wie einfach das geht, zeigen wir Ihnen heute.
Login-Special – Trick #1: Umleitung der Standard-Login-Seite von WordPress auf eine eigene Login-Seite
Die Standard-Login-Seite von WordPress ist funktional, aber ansprechend ist sie nicht. Ein individuelles Design wäre wünschenswert. Mit einem einfachen PHP-Snippet können Sie BenutzerInnen von der Standard-Login-Seite auf eine benutzerdefinierte Seite umleiten. Das ist recht simpel.
Login-Special – Trick #2: Automatisches Aktivieren der «Angemeldet bleiben»-Option in WordPress
Das Login-Formular von WordPress bietet die Option «Angemeldet bleiben», mit der sich BenutzerInnen bei zukünftigen Besuchen nicht erneut einloggen müssen. Standardmässig ist dieses Kästchen nicht aktiviert, was unbequem sein kann. Mit einem kleinen PHP-Snippet können Sie die Option automatisch aktivieren, um den Login-Prozess zu vereinfachen.
Login-Special – Trick #3: Website nur eingeloggten Usern anzeigen
Ab und an möchten Sie vielleicht eine vollständige WordPress-Website schützen und sicherstellen, dass nur eingeloggte BenutzerInnen Zugriff auf die Inhalte haben. Dies ist besonders nützlich für private Blogs, interne Unternehmenswebsites oder Mitgliederseiten. Es gibt zahlreiche Plugins, die dies bewerkstelligen – es geht aber noch einfacher: mit einem einfachen PHP-Snippet.
Werbung
Werbung
