Beitragstyp Projekt in Divi entfernen

Der Beitragstyp Projekt wird in Divi sehr häufig überhaupt nicht benötigt und bläst den Admin-Bereich nur unnötig auf. Mit nur ein paar Zeilen Code ist der Custom Post Type schnell entfernt.

Archivseiten mit dem Divi Theme Builder erstellen

In diesem Tutorial zeigen wir dir, wie du unkompliziert Archivseiten mit dem Divi Theme Builder erstellen und im Nachhinein auch wieder bearbeiten und anpassen kannst. Alles was du hierzu benötigst, ist deine im Vorfeld erstellte Blogbeitragsübersicht, die wir als Vorlage verwenden werden.

Code in den Head-Bereich der eigenen WordPress-Seite einfügen

Wenn du den Head-Bereich deiner WordPress-Seite manuell ergänzen möchtest, wirst du über Suchmaschinen sehr wahrscheinlich bei einem Plugin landen. Das ist auch möglich und gewisse der einfachste Weg, aber nicht der performanteste. Denn Plugins verursachen Ladezeiten. Wir zeigen dir, wie du mithilfe von ein wenig Custom-Code deinen Head-Bereich ganz individuell anpassen kannst, ganz ohne Plugins.

Den Head-Bereich deiner WP-Seite mit Custom-Code individuell zu ergänzen kann in vielerlei Hinscht sehr wichtig und hilfreich sein. In diesem Tutorial führen wir dich anhand einer Optimierung für Facebook-Werbung durch die Thematik. In unserem Beispielprojekt soll der Head-Bereich so ergänzt werden, dass bei Facebook-Verlinkungen auf die Seite immer ein bestimmtes Bild als Thumbnail eingeblendet wird.

Auslesen, was Facebook aktuell als Thumbnail auswählen würde

Über den „Sharing Debugger“ von Facebook kannst du auslesen lassen, welches Bild Facebook bei einer Verlinkung auf deine Seite auswählen würde. Der Facebook-Crawler ermittelt das Bild oftmals rein zufällig. Du kannst dir vorstellen, dass das nicht immer von Vorteil ist. Wie das bei Facebook genau funktioniert, kannst du in diesem Artikel durchlesen: https://developers.facebook.com/docs/sharing/webmasters/crawler .

Den Head-Bereich über das Child-Theme mit Custom-Code individuell ergänzen

Tipp:

Wir haben ebenfalls ein Tutorial auf unserer Seite, in der wir dir erklären, wie du ein Child Theme erstellst.

Um nun den Head-Bereich mit Custom-Code individuell zu ergänzen, öffnen wir die functions.php deines Child-Themes. Es ist wichtig bei individuellem Code immer ein Child-Theme zu verwenden. Ansonsten könnten deine Änderungen nach einem Update des Main-Themes verloren gehen.

In der functions.php scrollen wir ganz nach unten. Am Ende des bestehenden Codes können wir nun einen eigenen Custom-Code einfügen. Dieser besteht aus folgender Funktion, die du einfach hier von der Seite so übernehmen kannst:

//Wenn immer das gleiche Bild angezeigt werden soll, dann sieht der Code wie folgt aus:
function next_header_insertion() {
echo '<meta property="og:image" content="Link_zu_deinem_Bild_1.jpg" />';
}

Diese Funktion ist dafür zuständig, ein ganz bestimmtes Bild auszuwählen. Damit diese Funktion aber auch jedes Mal beim Auslesen deiner Seite aufgerufen wird, musst du noch einen „Hook“ (deutsch: Haken) einfügen. Das gelingt dir mit folgendem Code:

//Wenn immer das gleiche Bild angezeigt werden soll, dann sieht der Code wie folgt aus:
function next_header_insertion() { 
echo '<meta property="og:image" content="Link_zu_deinem_Bild_1.jpg" />'; 
}
// den Hook einfügen 
add_action('wp_head', 'next_header_insertion');

Nachdem du den Code in deine functions.php kopiert, den Pfad zu deinem Wunschbild eingefügt und das Ganze gespeichert hast, musst du die überabeitete functions.php wieder auf den Server hochladen.

Um zu sehen ob alles geklappt hat, kannst du nun deine Website im Browser aufrufen und mit Rechtsklick -> Seitenquelltext anzeigen den Quellcode deiner Seite einsehen. In der Suche gibst du den Suchbegriff „og:image“ ein. Das Suchergebnis sollte nun einen Eintrag mit <meta>-Tag anzeigen, der auch den Pfad zu dem von dir ausgewählten Bild enthält. Es hat also alles geklappt. Du hast den Head-Bereich mit Custom-Code individuell ergänzt, sodass z.B. Facebook bei Verlinkungen auf deine Seite immer das von dir gewünschte Bild anzeigt.

Änderungen nur für die Startseite umsetzen

Möchtest du, dass das von dir ausgewählte Bild nur beim Aufruf, bzw. der Verlinkung zu der Startseite angezeigt wird, dann kannst du die oben gezeigte Funktion noch in eine if-Verzweigung packen. Das machst du wie folgt:

//Wenn beim Verlinken der Homepage ein anderes Bild angezeigt werden soll, dann sieht der Code wie folgt aus:
function next_header_insertion() {
if( is_front_page() {
echo '<meta property="og:image" content="Link_zu_deinem_Bild_1.jpg" />';
}
}
add_action('wp_head', 'next_header_insertion');

Das bedeutet nun also, dass die Funktion nur greift, wenn deine Startseite ausgelesen wird. Bei den Unterseiten wird eines der dort vorhandenen Bildern zufällig ausgewählt.

Den Head-Bereich deiner WP-Seite mit Custom-Code individuell zu ergänzen kann also aus vielen verschiedenen Gründen enorm wichtig sein. Besonders für das richtige Vermarkten deiner Seite ist es essenziell, dass Crawler und Suchmaschinen auf die von dir gewünschten Einträge zugreifen. Wir hoffen, dass dir das Tutorial bei der Optimierung deiner WP-Seite weiterhelfen wird!

Beitrag bewerten

0 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 50 votes, average: 0,00 out of 5
(Bewertungen: 0, Durchschnitt: 0,00, du musst eingeloggt sein, um zu bewerten)

Loading...

Fragen oder Anregungen zum Beitrag?
Hinterlasse einen Kommentar!

0 Kommentare

Einen Kommentar abschicken

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.