Bitte wählen Sie ein Thema aus.
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.
Das Button-Modul im Divi-Theme bietet eine Fülle von Anpassungsmöglichkeiten. Sie können die Farbe, das Symbol, den Hover-Stil, die Animation und die Position ändern. Aber was, wenn Sie über das hinausgehen möchten, was Divi von Haus aus bietet? Wir zeigen Ihnen nicht weniger als 25 einfache Styling-Tricks für Ihre Divi-Buttons.
Heute ein interessanter Animationseffekt: Texte werden quasi live am Monitor geschrieben. Dieser Typewritereffekt startet, sobald die Seite geladen wird. Sie benötigen bloss einige Zeilen CSS-Code - wir zeigen Ihnen alles weitere.
Das Divi-Theme enthält ein Portfoliomodul mit Filtern, mit dem Sie Ihre Projekte zusammen mit Registerkarten-Schaltflächen anzeigen können. So können Ihre User bestimmte Projektkategorien zur Ansicht auswählen. Die Filter kommen aber etwas öde daher. Hier finden Sie Tipps für die Gestaltung der Filterbuttons des Portfoliomoduls.
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.
Von Haus aus stellt Wordpress für Beiträge die «Kategorien» zur Verfügung. Dieser Begriff passt häufig - jedoch längst nicht immer. Er lässt sich denn auch sehr einfach anpassen. Wir zeigen Ihnen, wie das geht.
Besonders Preislisten oder andere Tabellen werden schnell mal unübersichtlich: User können die Zeile «verlieren». Sie können helfen und das Auge beim Lesen «führen». Das geht ganz einfach.
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.
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.
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.
Das Divi-Theme bietet neben allerhand einleuchtenden Modulen auch das Code-Modul. Still und leise fristet es sein Dasein - dabei hat es echt Power unter der Haube. Eine Würdigung des oft unterschätzten Divi-Code-Moduls.
Ab und an passt die Grösse des Website-Logos im Divi-Theme in der Desktop-Ansicht gut - auf Mobilgeräten jedoch kommt es zu gross - manchmal auch zu klein - daher. Mit einem einfachen Trick können Sie die Abmessungen aber festlegen. Wir zeigen Ihnen wie das geht.
Das Divi-Theme kann Ihr CSS-Stylesheet in einen Cachespeicher schreiben. Das hat Vorteile: Das Stylesheet wird nicht bei jedem Seitenaufruf aus der Datenbank eingelesen, sondern liegt der Wordpress-Website als Datei vor. Das beschleunigt den Seitenaufbau. Jedoch hat dies auch Nachteile, welche Sie mit dem heutigen Code-Hack ausmerzen können.
Mit dem Passwortmodul von Divi können Sie passwortgeschützte Seiten mit dem Divi-Builder gestalten. Mit einem kleinen zusätzlichen Hack stellen Sie sicher, dass der Cursor im Passwortfeld des Passwort-Moduls sofort bereit ist, wenn die Seite geladen wird.
Normalerweise stellt Divi die zu präsentierenden Inhalte mit gebührendem Abstand an. Jedoch lassen sich auch mit dem Divi-Theme Inhalte überlappen - etwa Textblöcke. Wie's geht, zweigen wir Ihnen heute.
Wer im Backend der Wordpress-Installation hantiert, kennt den schwarzen Balken am Seitenkopf, welcher angezeigt wird, solange man eingeloggt ist und über den sich einige Administrations-Funktionen der Wordpress-Site steuern lassen. Ab und an nervt dieser Balken aber. Zum Glück lässt er sich ganz einfach ausblenden.
Wenn Ihre User eine Suchanfrage auf der Website starten und die Suchergebnisseite angezeigt wird, sind die Ergebnisse nach dem Veröffentlichungsdatum des Beitrags geordnet. Manchmal möchte man dies nicht. Deshalb zeigen wir Ihnen, wie Sie die Suchergebnisse in alphabetischer Reihenfolge nach Titeln sortiert anzeigen können.
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.
Unter Wordpress lassen sich Seiten und Beiträge passwortgeschützt veröffentlichen. Wird dann der Inhalt aufgerufen, erscheint zunächst eine Passwortabfrage, welche im Divi-Theme aber reichlich karg daher kommt. Sie lässt sich indes mit einfachen Mitteln verschönern. Hier erfahren Sie, wie das geht.
Wenn Sie den Standardheader des Divi-Themes verwenden, können Sie beim Scrollen ganz einfach ein anderes Logobild anzeigen lassen. Zum Beispiel ein Bild, das keine Textsubline enzhält, weil diese womöglich beim Scrollen zu klein erscheint, um noch lesbar zu sein.
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.
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.
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.
Das Footer-Menu im Divi-Theme ist von Haus aus immer links ausgerichtet. Eine Option, um es zu zentrieren oder rechtsbündig anzulegen, sucht man vergebens. Dennoch ist das möglich: mithilfe von ein paar Zeilen CSS-Code.
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.
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.
Gleich vorneweg: Dieses Snippet ist nicht ungefährlich. Es löscht alle Beitragsbilder aus allen Beiträgen. Wir empfehlen Ihnen, ein Datenbank-Backup zu erstellen, bevor Sie sich an die Arbeit machen. Wenn Sie sich jedoch der Sache sicher sind, kann Ihnen dieser Trick viel Arbeit ersparen.
Wordpress erlaubt einige Optionen, welche im Backend unter «Einstellungen» festgelegt werden können. Aber unter dem Deckel ist da noch mehr: Dutzende - wenn nicht hunderte - von zusätzlichen Optionen können Sie anpassen. Vorsicht aber: Das ist ein Profitipp. Bei unsachgemässer Anwendung, lässt sich ganz schön viel Schaden anrichten.
Heute zeigen wir Ihnen eine kleine Verbesserung, die Ihrem Designprozess zu mehr Effizienz verhelfen kann. Wir zeigen Ihnen wie Sie die Standardhöhe (min. und max.) und die Standardbreite (min. und max.) des Builder-Popups im Divi-Theme festlegen und die Standardposition für das Popup auf der Seite bestimmen können.
Bilder, welche im Gutenberg-Block-Editor von Wordpress eingefügt werden, erhalten immer das Standardformat «gross», welches seitens Wordpress mit 1024px festgelegt wird. Wer andere Formate braucht und dies dauerhaft einrichten möchte, dem/der sei dieser kleine Hack empfohlen.
Standardmässig bleiben Sie bei WordPress zwei Wochen lang angemeldet, wenn Sie beim Login die Option «Angemeldet bleiben» aktivieren. Doch dieser Zeitraum lässt sich verlängern - oder eben auch verkürzen.
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.
Das Suchmodul des Divi-Themes liefert gute Resultate - aber es wäre manchmal hilfreich, wenn auch gleich die Zahl der Treffer angezeigt wüde. Das geht mit ein wenig Code in der Datei functions.php.
Icons sind eine tolle Möglichkeit, das Menü der Website interessanter zu gestalten. Das richtige Icon sieht gut aus und gibt dem Nutzer einen Hinweis darauf, worum es sich bei dem Link handelt. Icons im Menü anzuzeigen ist überdies kein Hexenwerk.
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.
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.
Mit einem ganz einfachen Trick kann der Button im Divi-Theme mit einem sanften 3D-Effekt versehen werden. Bewegt man dann die Maus über die Schaltfläche wird diese (mit Schein) etwas angehoben.
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.
Wenn man auf einer Divi-Website mit der Maus über ein Bild hovert, wird dort der Name des Bildes als Text eingeblendet. Das stört bisweilen - es lässt sich aber einfach ausschalten. Wir zeigen Ihnen wie.
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.
Besonders wenn mehrere Administratoren an Ihrer Wordpress-Website arbeiten, kann es schon mal geschehen, dass Sie sich gegnseitig ins Gehege kommen und mehrere Personen Änderungen an den Themes und Plugins vornehmen. Doch das lässt sich leicht verhindern. Wir zeigen Ihnen wie.
Das Plugin «Advanced Custom Fields» (ACF) ermöglicht es, die spartanischen Custom Fields von Wordpress im Backend adrett und bedienungsfreundlich darzustellen. Das Plugin schaltet aber auch gleich die Standarddarstellung dieser Eingabefelder ab - was nicht immer gewünscht ist. Das lässt sich beheben.
Das Divi-Theme kommt mit einem Informationstext-Modul (auf englisch: Blurb-Modul) daher. Problem: Nur der Titel und das Icon sind anklickbar. Wenn Sie das gesamte Modul verlinken möchten, dann erfahren Sie hier wie das geht.
Der Wordpress-Gutenberg-Editor schaltet eine Sicherheitsabfrage beim Veröffentlichen eines Inhalts auf der Wordpress-Website. So sollen unvollständige Inhalte nicht versehentlich publiziert werden. Im klassischen Editor gibt es diese Funktion jedoch nicht. Sie lässt sich aber nachrüsten.
Das Divi-Theme bietet ein Galeriemodul, mit dem Sie eine Diashow von Bildern in Ihren Beiträgen anzeigen können. Mit einem Hack - bestehend aus PHP-Code - können Sie die enthaltenen Galeriebilder zusätzlich zählen lassen.
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.
Animierte Bilder und Texte sind eine grossartige Funktion, die Aufmerksamkeit erheischen und Ihre Website von anderen unterscheidet. Wir zeigen Ihnen hier, wie Sie ihren Bildern und anderen Divi-Elementen das «Schweben» beibringen.
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.
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.
WordPress bringt einen Code-Editor mit, in dem die Dateien des Themes und Plugin-Dateien geändert werden können. Falsch benutzt ist jedoch der Theme-Editor eine Sicherheitsrisiko. Der Editor lässt sich aber abschalten.
Sinnvollerweise beschränkt man sich in URLs auf eine einheitliche Schreibweise. Am besten ist alles in Kleinbuchstaben - das ist am üblichsten und am einfachsten. Wordpress kann dazu erzogen werden, alffälige Abweichungen gleich selber zu beheben.
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.
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.
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.
Die Menüs auf der Wordpress-Website öffnen Links standardmässig im selben Fenster. Doch das ist nicht immer ideal - ab und an sollte vielleicht auch ein Menülink im neuen Fenster oder Tab geöffnet werden. Das lässt sich ganz einfach definieren.
Im Divi-Theme können Sie die Titel und Überschriften via Customizer stylen. Es geht aber auch via CSS und wirkt global. Heute geben wir Ihnen einen kleinen Bausatz für individuell gestaltete Titel zur Hand.
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.
Ist Ihnen schon einmal aufgefallen, dass die Divi Toggle- und Accordion-Module schwer anzuklicken sind? Der klickbare Bereich ist nur so hoch wie der Text selbst - also etwa 1/4 der Höhe des Toggles. Wir zeigen Ihnen eine einfache Möglichkeit, den klickbaren Bereich der Divi Toggle- und Accordion-Module über den Text hinaus auf das gesamte Modul zu erweitern.
Es gibt zahlreiche Plugins im Wordpress-Directory, welche das Duplizieren bestehender Wordpress-Beiträge und/oder -Seiten erlauben. Das ist zwar praktisch; es geht aber auch ganz ohne Plugin – dafür mit ein wenig PHP-Code. Wir zeigen Ihnen wie.
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.
Formulare sind beliebt im Internet. Kaum eine Website, die ohne Formulare auskommt. Sie können den Usern bei der Orientierung aber zusätzlich helfen, wenn Sie ihnen zeigen, wo genau sie sich im Formular befinden. Das geht ganz einfach mit ein wenig CSS.
Das Blog-Modul des Divi-Themes ist recht beschränkt, was die Einstellungsmöglichkeiten für die Ausgabe betrifft. Vor allem hinsichtlich Spalten wünscht man sich oft mehr Optionen. Die gibt es auch: mit einem einfachen Trick. Hier zeigen wir Ihnen wie's geht.
Die Standardlänge des WordPress-Auszugs ist oft zu kurz, um die Zusammenfassung eines Beitrags zu beschreiben. Sie können aber die Länge des Auszugs jederzeit ändern.
Das Menümodul des Divi-Themes lässt einige Einstellungen zu: Logo und Menü zentrieren; Logo links und Menü rechts - was aber fehlt, ist die Option das Menü links und das Logo rechts darzustellen. Mit ein wenig Code kriegen Sie aber auch dies hin.
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.
Ab und an ist der Begriff «Beiträge» – wie er im Wordpress-Backend automatisch angelegt wird – nicht ganz treffend. Die Beiträge lassen sich denn auch leicht mit einem anderen Begriff versehen und zusätzlich kann das zugehörige Untermenü angepasst werden.
Beiträge mit Beitragsbildern werden im Blog-Modul des Divi-Themes ansprechend dargestellt. Was aber, wenn Sie keine Beitragsbilder verwenden? So macht es auch Dr. Code. Sie haben aber auch ohne Bilder die Möglichkeit, Ihre Blogbeiträge «catchy» und auffällig anzuzeigen. Wir zeigen Ihnen, wie das geht.
Die Themes Ihrer Wordpress-Installation sollten möglichst aktualisiert werden. Das ist im Grundsatz sicher gut. Ab und an bringt aber eine neue Theme-Version mehr Probleme als Segen. Im Divi-Theme können Sie darum auf einfach Weise zurück zur letzten installierten Version wechseln.
Als das WWW in den 90er-Jahren immer populärer wurde, war noch nicht viel los in Sachen Animationen. Ein Auswuchs von seinerzeit: Blinkende Texte. Diese vermochten richtig zu nerven und der blink-Tag ist denn auch aus dem HTML-Standard rausgeflogen. Wer es dennoch unbedingt blinken lassen möchte, sei der nachfolgende Hack empfohlen.
Nun: Es ist schon eine Weile her, dass Laufschriften als «state of the art» auf gefühlt jeder zweiten Website zu finden waren. Als HTML noch nicht viel konnte und der Content meist regungslos da stand, war die Laufschrift das Mittel der Animation schlechthin. Wer weiss: Vielleicht wollen Sie gelegentlich den Staub von der Laufschrift wegblasen.
Besucherinnen und Besucher von Websites überlegen meist sehr gut, wieviel Zeit sie in das Lesen eines Beitrags investieren wollen. Mit einem einfachen Code können Sie die benötigte Lesezeit für einen Beitrag automatisch schätzen und anzeigen lassen. Das ist gar nicht mal so schwierig umzusetzen.
Vielleicht geht es Ihnen wie mir: Die Startseite meiner Website ist im Backend unter «Seiten» wohl gelistet, ich muss mich aber alphabetisch bis zur dritten Seite durchhangeln. Unpraktisch, sowas! Sowohl die Start- wie auch die Beitragsseite lässt sich jedoch in der Seitenübersicht an erster Stelle ganz oben anzeigen. Wie das geht, erfahren Sie hier.
Dieser Tipp funktioniert nicht ganz überall. Auf dieser Website etwa, zeigt er keine Wirkung. In anderen Wordpress-Installationen funktioniert er aber - darum zeigen wir Ihnen, wie man umfangreiche Wordpress-Beiträge in mehrere Teile splittet.
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.
Das Button-Modul des Divi-Themes umfasst ja bereits einige Einstellungsmöglichkeiten. Ein paar zusätzlich Spielereien sind aber allemal drin. Zum Beispiel können Sie den Schaltflächen beim hovern einen hübschen Glanzeffekt spendieren. Wir zeigen Ihnen wie.
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.
Die Blog-Übersichten im Divi-Theme bieten schon einige Möglichkeiten zum Styling. Doch richtig cool wird die Bildwelt, wenn Sie mit ein paar CSS-Tricke noch ein wenig nachhelfen. Zwei Möglichkeiten möchten wir Ihnen heute vorstellen.
Drei Bilder nebeneinander stellen? Das kann jede und jeder. Hübsch wäre ein stylisher Staffelungslook, bei welchem etwa Bild 1 und 3 auf einer Linie erscheinen und Bild 2 leicht versetzt ist. Das lösen Sie mit diesem Trick im Nu.
Mit dem Bildmodul des Divi-Themes lässt sich auch eine hübsche Bilderreihe erstellen. Eine Mini-Galerie quasi. Ein wenig Handarbeit braucht's allerdings noch. Schwierig wird's indes nicht.
Bilder-Special – Trick #5: Coole 3D-Flip-Cards ganz einfach in HTML erstellen – komplett ohne Plugin
Heute bauen wir einen echten Hingucker: So genannte Flip-Cards, die sich umdrehen, sobald der Mauszeiger darüber bewegt wird. Das gibt ein ebenso cooles wie professionelles Look & Feel für Ihre Website.
Eine interessante Möglichkeit für hübsche Darstellungen: Lassen Sie - etwa auf einer Übersichtsseite - Bilder über einen Hintergrund hinausragen. Das ist einfacher zu machen, als man meint.
Zwei oder mehr Bild-Module im Divi-Theme überlappen lassen? Kein Problem. Ein wenig CSS und gut ist. Wir zeigen Ihnen wie's geht.
Gerade in mehrspaltigen Designs möchte man vielleicht ein Bildmodul in exakt derselben Höhe wie der nebenan liegende Text darstellen. Das schaffen wir mit ein wenig CSS-Code.
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.
Heute zeigen wir Ihnen, wie Sie ein bestimmtes CSS-Styling einzig und alleine auf der Homepage Ihres Webauftritts aktivieren. Auf allen anderen Seiten wird das Styling nicht berücksichtigt. Ein kleiner praktischer Trick fürs Webdesign.
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.
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.
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.
Die Suchfunktion von Wordpress findet so ziemlich alles, was es in Ihrer Installation zu finden gibt. Auch ein Impressum oder ein Kontaktformular kann da schon mal zwischen den Suchresultaten auftauchen. Wenn Sie aber nur Ihre Beiträge durchsuchen lassen möchten, müssen Sie selber Hand anlegen. Zum Glück ist das sehr einfach.
Normalerweise zeigt das Divi-Theme mobile Menüs mit einem so genanten «Hamburger». Egal, ob es geöffnet oder geschlossen ist. Mit einem kleinen Trick kann in geöffneten Mobilmenüs ein «X» angezeigt werden, welches zum Schliessen des Menüs einlädt.
Möchten Sie auf Ihrer Website verschiedene Bilder zeigen, welche bei jedem Aufruf zufällig dargestellt werden? Das geht natürlich. Mit ein wenig JavaScript und unserem Hack für alle Websites.
Websites ständig von Hand neu zu laden kann mühsam sein. Lassen Sie die Maschine übernehmen. Als kleines Supplement zeigen wir Ihnen gleich noch, wie Sie auf der Website einen Livecountdown bis zum Refresh anzeigen.
Viele Wordpress-Seiten listen auf der Startseite gleich mal die neusten Beiträge auf. Das will man aber häufig gar nicht. Das selektiv zu verhindern ist aber keine schwierige Angelegenheit. In diesem Beitrag erfahren Sie wie es geht.
Standardmässig legt das Divi-Theme beim Menu für die Mobilansicht links und rechts noch einen Rand fest. Besonders bei längeren Wörtern in der Navigation kann das in der schmalen Mobilansicht suboptimal sein. Mit wenig CSS-Code lässt sich die gesamte Breite nutzen.
Eine gute Möglichkeit, zusätzliche Marketinginformationen auf einer Landing-Page bereitzustellen, ist eine zweite Textzeile auf einer Call-to-Action-Schaltfläche. Da es standardmässig keine Möglichkeit gibt, dem Divi-Button eine zweite Textzeile hinzuzufügen, werden wir dies mit einigen Codeschnipseln tun.
Das Menümodul des Divi-Themes bietet schon einige Styling-Möglichkeiten. Um so richtig Chef über die Darstellung zu werden, bedarf es aber ein wenig CSS-Code. Diesen stellen wir Ihnen hier vor.
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.
Wenn Sie Buttons im Divi-Theme nebeneinander statt untereinander anordnen wollen, müssen Sie dies im Normalfall mit einer mehrspaltigen Zeile lösen. Es gibt aber einen Trick, mit welchem auch mehrere Buttons in derselben Spalte nebeneinander platziert werden.
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.
Wer längere Texte im Divi-Theme bearbeitet, kennt das Problem: Die Toolbar verschwindet nach oben und man muss ständig wieder hochscrollen um eine bestimmte Funktion zu aktivieren - etwa Zwischentitel setzen, BulletPoint-Listen erstellen, Texte zentrieren. Mit einem wirklich einfachen Trick ist aber die Editor-Toolbar immer sichtbar.
Werbung
