Das Genesis Framework ist ein beliebtes WordPress-Theme, mit dem einige der schönsten und kreativsten Websites im Internet erstellt wurden. Es ist einer unserer Favoriten hier bei Blogging for Entrepreneurs, weil es so vielseitig, einfach zu verwenden und anpassbar ist.
Eine Sache, die viele Leute bei Genesis-Designs schwierig finden, ist das Hinzufügen eines Header-Image-Logos. Glücklicherweise können Sie mit nur wenigen Klicks Ihr eigenes benutzerdefiniertes Logo erstellen.
Dies ist hilfreich, wenn Sie möchten, dass Ihre Website ein bestimmtes Branding hat, das zu Ihrem Unternehmen passt. Das Hinzufügen dauert weniger als 10 Minuten und erfordert nur die Verwendung eines Plugins namens Custom Logo Uploader von WPSquare.
Es kann in nur wenigen Sekunden mit einem Klick im WordPress-Adminbereich installiert werden.
Hier sind die Schritte:
1) Installieren Sie das Plugin
2) Gewünschte Bilder hinzufügen
3) Einstellungen konfigurieren
4) Speichern Sie die Änderungen 5-10 Minuten später, gehen Sie zurück zu Genesis Child Theme Settings > Header Image
6) Wählen Sie ein benutzerdefiniertes Logo aus
7) Geben Sie die gewünschte URL ein
8 )Änderungen speichern.
So fügen Sie ein Header Image Logo für das Genesis Child Theme hinzu
SCHRITT 1: Richten Sie das Logo im Dashboard ein
Da ich „TwentyTen Child-Theme„Ich muss nur zu Dashboard >> Aussehen >> Anpassen >> Kopfzeile gehen und ein Logo hinzufügen, das ich verwenden möchte. Sie können Ihre eigenen benutzerdefinierten Bilder hinzufügen oder aus den in WordPress verfügbaren Bildern auswählen, die Sie im Abschnitt „Neu hinzufügen“ finden.
In meinem Fall füge ich ein Bild aus dem Dashboard-Medienordner hinzu, indem ich auf die Datei mit dem Namen „header-logo.png“ klicke..
SCHRITT 2: Fügen Sie benutzerdefinierten Code zur Genesis Child Theme-Funktion hinzu.
php Öffnen Sie die Funktions-PHP-Datei des Genesis Child-Themes, die sich normalerweise im Stammordner des Themes mit dem Namen functions.php befindet. Sie können diese Datei mit jedem FTP- oder SFTP-Client wie Filezilla öffnen.
Und wenn Sie diese Datei nicht finden können, können Sie eine erstellen. Ich habe einen Beitrag geschrieben, um zu zeigen, wie man die Funktions-PHP-Datei des untergeordneten Genesis-Themes erstellt.
Hier ist der Code, den ich am Ende meiner Datei functions.php hinzugefügt habe, aber vor dem Schließen des PHP-Tags?>
// BP-Header-Logo
add_custom_image_header( 'bp-logo' );
Dies weist Genesis an, ein Bild namens „bp-logo“ als Header-Logo für meine Website zu verwenden. Sie können diesen Namen ändern, aber vergessen Sie nicht, ihn im nächsten Schritt auch zu ändern. Erstellen Sie nun einen neuen Ordner mit dem Namen bp-logo .
Es muss innerhalb Ihres Theme-Root-Verzeichnisses erstellt werden. Weitere Informationen finden Sie in meinem Beitrag zum Erstellen eines Ordners in Ihrem untergeordneten Genesis-Design.
SCHRITT 3: Erstellen Sie ein Logo-Bild für das Thema eines Drittanbieters
Das Problem ist, dass unser Logobild nicht im Customizer-Bereich des WordPress-Dashboards angezeigt wird, aber es wird trotzdem im Frontend angezeigt, sobald die Website online veröffentlicht wurde.
Das bedeutet, dass wir dieses Bild zur header.php unseres Themes hinzufügen müssen. Glücklicherweise können wir dies tun, indem wir unsere bearbeiten Thema direkt aus dem WordPress-Adminbereich.
Was Sie brauchen, ist Ihre Design-Zip-Datei und ein FTP- oder SFTP-Client wie FileZilla . Sie können phpMyAdmin auch, wenn Sie wissen, wie man es benutzt.
Öffne das ZIP-Archiv mit deinem Lieblingsprogramm und gehe zu /wp-content/themes/DEIN THEMANAME/header.php . Kopieren Sie den Code, den Sie in dieser Datei sehen, aber vor dem schließenden PHP-Tag ?> .
Hier ist ein Beispiel meiner header.php-Datei mit hinzugefügtem benutzerdefiniertem Code:
"Titel =" ”rel=”home”> „alt=“ "Titel =" ”/>
SCHRITT 4: Fügen Sie benutzerdefinierten Code zum Header des untergeordneten Genesis-Themes hinzu.
php Öffnen Sie nun die Datei header.php Ihres Themes (die sich in /wp-content/themes/YOUR THEME NAME/ befindet) und fügen Sie diesen Code hinzu, bevor Sie das PHP-Tag schließen (das sich am Ende der Datei befindet):
SCHRITT 2: Fertig Wenn Sie jetzt Ihre Website besuchen, wird das Logo im Frontend angezeigt.
Aber es gibt ein Problem mit diesem Code. Es erstellt eine Bilddatei auf Ihrem Server und wenn Sie viele Bilder hochladen, nimmt es unnötigerweise Serverplatz in Anspruch.
Um dieses Problem zu lösen, habe ich mein Plugin namens „Genesis Simple Hooks“ verwendet. Und hier ist der aktualisierte benutzerdefinierte Code, den ich in die Datei functions.php eingefügt habe: add_action( 'genesis_before_header', 'bp_add_header_logo' );
function bp_add_header_logo() { if ( !is_page() || isnull( get_post_meta( get_the_ID(), 'bp-logo', true ) ) ): ?> "Titel =" ”rel=”home”> „alt=“ "Titel =" ”/>
Verwenden des WordPress-Plugins (Genesis Simple Headers)
WordPress ist ein großartiges CMS (Content Management System) und kann zum Erstellen verschiedener Arten von Websites verwendet werden. Es verfügt über eine umfangreiche Sammlung von Plugins, die es noch leistungsfähiger machen.
Mit dem Plugin Genesis Simple Headers können Sie Ihrer WordPress-Website benutzerdefinierte Header hinzufügen. Sie können Ihr eigenes Header-Bild hochladen oder aus den im Plugin verfügbaren Standardoptionen auswählen, wie z. B. Bilder, die vom WordPress-Theme bereitgestellt werden.
Wenn Ihre Blog-Kopfzeile in Ihrem Blog nicht richtig angezeigt wird, beheben Sie das Problem zuerst mit diesen Schritten:
Überprüfen Sie, ob Sie das Bild in den richtigen Ordner hochgeladen haben (wählen Sie aus /wp-content/uploads/yourimage.jpg). Wenn Sie es dort nicht finden können, überprüfen Sie erneut, ob Ihr Bild die richtigen Abmessungen hat. Dann können Sie es mit einer FTP-Software in den richtigen Ordner hochladen.
Überprüfen Sie, ob Ihr Bild nicht beschädigt ist (versuchen Sie, es in einem Bildbearbeitungsprogramm zu öffnen). Wenn ja, löschen Sie diese Datei und laden Sie eine neue hoch, um zu sehen, ob das Problem weiterhin besteht.
Sie können versuchen, ein anderes Header-Bild zu erstellen, indem Sie einfach zu Aussehen – Einfache Genesis-Header – Neues Bild hinzufügen gehen.
Sie können auch versuchen, das Standardbild zu verwenden, das mit Ihrem WordPress-Theme geliefert wird, indem Sie zu Aussehen – Einfache Genesis-Header-Bilder bearbeiten und dann eines davon auswählen oder einfach ein Bild aus dem Internet hochladen.
Wenn dies immer noch nicht funktioniert, wenden Sie sich bitte an [E-Mail geschützt] für mehr hilfe.
Wenn Sie lernen möchten, wie Sie dieses Plugin verwenden, lesen Sie bitte weiter …
Dieser Artikel ist nur für Anfänger gedacht und hilft ihnen, die Grundlagen der Verwendung dieses WordPress-Plugins zu verstehen. Es wird davon ausgegangen, dass der Benutzer das Genesis Simple Headers-Plugin bereits auf seiner Website installiert hat und die Grundlagen der Verwendung von WordPress Dashboard kennt.
Grundlegende Schritte zum Hinzufügen benutzerdefinierter Header für WordPress Blog
1) Gehen Sie zum Dashboard Ihres WordPress-Blogs und bewegen Sie den Mauszeiger über Aussehen. Wählen Sie dort Menüs aus.
2) Klicken Sie im Dropdown-Menü Genesis Simple Headers auf Header #1. Es öffnet sich eine neue Seite mit vielen Optionen. Sie können jede der dort bereitgestellten Optionen ändern.
3) Die erste Option ist Header-Bild. Klicken Sie auf die Schaltfläche „Durchsuchen“ und wählen Sie ein Bild von Ihrem Computer aus oder verwenden Sie eines der in diesem Abschnitt verfügbaren Standardbilder.
Stellen Sie sicher, dass Sie die Erlaubnis haben, dieses Bild zu verwenden, da es als Teil Ihrer angezeigt wird Blog-Inhalt und wird auch in den Suchergebnissen angezeigt. Sie können das gleiche Bild für alle drei Header-Bilder verwenden, wenn Sie möchten. Sie können auch den in diesem Abschnitt angezeigten Text ändern.
4) Das zweite Dropdown-Menü ist Kopfzeilentyp. Es gibt 5 Typen, die von diesem Plugin bereitgestellt werden, und Sie können einen davon auswählen. Wenn Sie den Typ jedoch in H1 ändern, können Sie ihn weiter als H1-Header gestalten.
5) Das dritte Dropdown-Menü ist Positionierung und Sie können es verwenden, um die Positionierung Ihrer Kopfzeile zu ändern Bild auf Ihrem Blog (links, Mitte oder rechts).
6) Mit dem vierten Dropdown-Menü können Sie auswählen, welcher Abschnitt der Beiträge in dieser Kopfzeile angezeigt werden soll. Sie haben 3 Abschnitte – Genesis Featured Image, Intro Text und Post Title. Wenn Sie etwas anderes anzeigen möchten, können Sie diesen HTML-Code in den bereitgestellten Abschnitt eingeben und er wird dort angezeigt.
7) Klicken Sie auf Menü speichern, nachdem Sie alle Ihre Änderungen vorgenommen haben.
8) Das neue Header-Bild wird sofort in Ihrem Blog angezeigt und immer wenn ein Besucher einen Ihrer Blog-Beiträge öffnet, erscheint dieses Header-Bild ganz oben. Sie können seine Position jedoch nach rechts oder links ändern, indem Sie zu Aussehen – Anpassen – Seitennavigation gehen und dann entweder rechts oder links auswählen.
Bearbeiten der Style.css-Datei des Genesis-Child-Themes-
Ich bin im offiziellen WordPress-Theme-Verzeichnis auf ein Genesis-Child-Theme namens [i]Element[/i] gestoßen und wollte es in meiner lokalen Entwicklungsumgebung verwenden.
Der erste und der zweite Post auf dieser Seite geben Anweisungen, wie man ein neues Genesis-Child-Theme für Entwicklungszwecke einrichtet. Also, schau sie dir an, falls du es noch nicht getan hast.
Nachdem ich versucht hatte, das im ersten Beitrag gefundene Installationsskript auszuführen, stellte ich fest, dass es ein Child-Theme-Stylesheet in einem Verzeichnis namens „_s“ installierte, das für alle WordPress-Themes außer Genesis korrekt ist.
Dann bearbeite ich meine Child-Theme-Datei style.css und ändere die Pfade von „Element Child Theme/style.css“ zu „Element Child Theme/*/style.css“.
Und es funktioniert tatsächlich!
Quick Links
- Warum ein Logo für Ihr Unternehmen wichtig ist
- Wesentliche Elemente des Blogs, die Sie als Anfänger nicht verpassen dürfen
- Finden Sie jetzt heraus, wie Sie Ihr Social-Media-Marketing steigern können
- Meine Lieblings-WordPress-Theme-Sammlung aller Zeiten
Fazit – So fügen Sie ein Header-Image-Logo für Genesis Child Theme 2024 hinzu
Das Genesis Framework ist eines der beliebtesten verfügbaren WordPress-Themes. Es ist einfach anzupassen und verfügt über unzählige Funktionen, die Ihnen helfen können, Ihr Unternehmen auf den Weg zu bringen.
Eine Möglichkeit, Ihre Website zu personalisieren, besteht darin, ein Kopfbild-Logo für das Genesis Child Theme hinzuzufügen, das anstelle des Standardtextes „Genesis Framework“ oben auf jeder Seite erscheint.
Blogs sind eine großartige Möglichkeit, Ihr Wissen zu teilen, Ihr Produkt oder Ihre Dienstleistung zu bewerben und ein Publikum aufzubauen. Aber wie gestaltet man sie?
Es gibt viele verschiedene Blog-Themen, die behaupten, die besten für die Erstellung schöner Websites zu sein, aber welches ist das Richtige für Sie? Wir haben einige der beliebtesten heute verfügbaren Genesis Child Theme-Vorlagen genommen und ihre Designqualität basierend auf unseren persönlichen Vorlieben mit 1 bis 5 Sternen bewertet.
