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:
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.
Login-Special – Trick #4: Eingabefelder des Divi-Login-Moduls horizontal darstellen
Das Divi-Theme kommt mit einem patenten Login-Modul daher. Doch es lässt sich nicht komplett stylen: So sind etwa horizontal angeordnete Anmeldefelder von Haus aus nicht möglich. Es sei denn, Sie verwenden unseren CSS-Trick.
Bilder mit einem hübschen Innenrahmen präsentieren
Bilder auf der Website zu verwenden, ist eine einfache Übung. Heute versehen wir die dargestellten Bilder zusätzlich mit einem schönen Innenrahmen. So was habe ich unlängst auf der Website einer Kollegin entdeckt – sieht sehr hübsch aus. Musste ich gleich nachbauen.
Shortcodes in WordPress-Text-Widgets verwenden
Mit Shortcodes können Sie ganz einfach kleine Funktionen in WordPress-Beiträge und -Seiten einfügen. Leider funktionieren diese Shortcodes jedoch nicht in Textwidgets der Seitenleiste. Das lässt sich mit einer einzigen Codezeile nachbessern.
Eigenes Gravatar-Bild als Default festlegen
WordPress verwendet Gravatar, um Benutzerprofilbilder in WordPress anzuzeigen. Wenn ein Benutzer keinen Gravatar hat, verwendet WordPress ein Standardbild. Dieses Standard-Gravatar-Bild wird häufig in Ihrem WordPress-Kommentarbereich erscheinen, weil viele Benutzer kein Gravatar-Bild mit ihrer E-Mail-Adresse verknüpft haben. Sie können dieses Standardbild jedoch ganz einfach durch Ihr eigenes benutzerdefiniertes Standard-Gravatarbild ersetzen.
Bezeichnungen der Divi-Formularfelder links anzeigen
Die Formularfelder des Kontaktformular-Moduls im Divi-Theme werden normalerweise innerhalb der eigentlichen Felder angezeigt. Doch das lässt sich ändern: Die Feldbezeichnungen können auch links der Eingabefelder platziert werden. Wie das geht, zeigen wir Ihnen heute,
Werbung
Werbung
