So fügen Sie Codefragmente in WordPress hinzu

Wenn Sie Code-Snippets zu Ihrer WordPress-Website hinzufügen möchten, sind Sie hier genau richtig.

Normalerweise kopieren Leute Codes und fügen sie in WordPress-Themedateien ein. Es ist ein einfacher Vorgang, aber dieser Vorgang richtet sich an erfahrene Benutzer.

Für Anfänger und Fortgeschrittene kann das Kopieren und Einfügen einschüchternd wirken. Deshalb schreibe ich diesen Beitrag.

Auch erfahrene Benutzer können davon profitieren, denn ich zeige Ihnen, wie Sie ganz einfach Codeausschnitte hinzufügen.

Lass uns anfangen!

Gründe für das Hinzufügen von Codefragmenten zu Ihrer WordPress-Site

Erstens ist WordPress aufgrund seiner einsteigerfreundlichen Einstellungen und benutzerorientierten Funktionalität der beliebteste Website-Builder.

Allerdings kann das Hinzufügen einiger benutzerdefinierter Codes die Leistung Ihres WordPress erweitern, ohne Ihre Website zu beschädigen.

Nehmen wir an, Sie haben einige Codes, die auf Ihrer Website implementiert werden können. Aber wo oder wie werden Sie sie veröffentlichen?

Hier kommt die Option zum Einfügen von Code ins Spiel. Sie ist eine großartige Möglichkeit, Ihre Website mit innovativen Dingen zu versehen.

Ein weiterer Grund für die Verwendung von benutzerdefiniertem Code besteht darin, dass dies eine effiziente Möglichkeit ist, die Leistung Ihres WordPress zu erweitern.

Für fast jeden Bedarf finden Sie ein WordPress-Plugin. Aber ist es sinnvoll, Plugins für alle Anforderungen zu installieren und Ihre Website zu umfangreich zu machen?

Wenn Sie das Problem mit einem kleinen Satz Code lösen können, sollten Sie das tun.

Schauen wir uns nach alledem den Prozess des Hinzufügens von benutzerdefiniertem Code zu Ihrer WordPress-Website an.

Möglichkeiten zum Hinzufügen benutzerdefinierter Codes

Es gibt mehrere Möglichkeiten, benutzerdefinierte Codes zu Ihrer WordPress-Website hinzuzufügen. Bevor ich diesen Teil bespreche, möchte ich, dass Sie ein WordPress-Backup-Plugin installieren, damit Ihre neuen Codes nichts auf Ihrer Website beschädigen.

Wenn es schief geht, können Sie die vorherige Version aus dem Backup wiederherstellen und Ihre Website auf den früheren Stand bringen. Ein weiterer Aspekt beim Hinzufügen von Codeausschnitten ist jedoch, wo sie hinzugefügt werden.

Normalerweise können Sie Codes zu Theme-Vorlagendateien hinzufügen, z. B. index.php. Es gibt andere PHP-Dateien, in die Sie Ihre Codes direkt einfügen können.

Die beliebteste Methode ist meiner Meinung nach das Hinzufügen von Snippets zu „functions.php“. Zumindest sehen Sie das in den meisten verfügbaren Tutorials.

Ich zeige Ihnen jedoch die beste Methode, die Ihnen am meisten hilft, wenn Sie das Design ändern oder die Funktionalität gleichzeitig beenden möchten.

Hier sind jedoch einige der Methoden, mit denen Sie Ihren benutzerdefinierten Code zu Ihrer WordPress-Site hinzufügen können.

So fügen Sie Code-Snippets in WordPress hinzu (FluentSnippets)

Der erste Schritt besteht darin, benutzerdefinierten Code mit einem Plugin namens FluentSnippets hinzuzufügen. Dieses Plugin wurde übrigens von uns (Ihrem Lieblings-WPManageNinja) entwickelt. Wenn Sie bereits Fluent-Benutzer sind (und Fluent-Produkte verwenden), wissen Sie, wie großartig die Qualität unserer Plugins ist.

Schritt eins – Installation des kostenlosen Plugins

Gehen Sie zu Plugins > Neues Plugin hinzufügen und suchen Sie nach FluentSnippets.

Klicken Sie auf die Schaltfläche „Jetzt installieren“ .

Klicken Sie nun auf die Schaltfläche „Aktivieren“ und Ihr Plugin wird aktiviert.

Gehen Sie zurück zu Ihrem WordPress-Dashboard und suchen Sie im linken Bereich nach FluentSnippets. Sie sehen eine Schaltfläche mit der Aufschrift „Erstellen Sie Ihr erstes Snippet“ . Alternativ können Sie jederzeit oben rechts auf die Schaltfläche „Neues Snippet“ klicken.

Schritt zwei – Einfügen Ihrer Codeschnipsel

Fügen Sie nun Ihr Snippet ein und geben Sie ihm einen Namen. Wenn Sie möchten, können Sie eine Beschreibung schreiben. Teilen Sie ihm schließlich mit, wo es ausgeführt werden soll, und klicken Sie auf die Schaltfläche „Snippet erstellen“ .

Sie können mit Zahlen auch eine gewisse Priorität festlegen. Je niedriger die Zahl, desto höher die Priorität.

Wenn Sie mehrere Snippets haben, können Sie diese in Gruppen organisieren. Sie können auch einige Tags zuweisen, um Ihre Snippets leichter zu finden.

Es gibt eine Option namens „Erweiterte bedingte Logik“. Wenn Sie es aktivieren, können Sie Ihre Snippets filtern und ausführen lassen, wenn sie die Bedingung erfüllen.

Übrigens können Sie Skripte für PHP, PHP + HTML, CSS und JS schreiben.

Die einfachste Möglichkeit zum Kopieren und Einfügen von Code finden Sie hier. Sie können sich die Einstellungen ansehen, obwohl es dort nicht allzu viel zu tun gibt.

Fügen Sie Code in Ihre Designdatei ein

WordPress verfügt standardmäßig über eine Fülle von Funktionen, die Sie auf Ihre Website anwenden können. Die Themes verfügen oft über umfangreiche Funktionen und Anpassungsoptionen. Wenn Sie jedoch etwas Genaues benötigen, können Sie einige selbst geschriebene Codes hinzufügen.

Hier kommt die Datei function.php, um Ihren Rücken zu schonen. Nun, Sie können die Datei in jedem Theme finden, aber ich möchte, dass Sie den sichersten Weg befolgen. Aus diesem Grund empfehle ich Ihnen, ein untergeordnetes Thema zu erstellen.

Lassen Sie sich nicht überfordern. Unter dem Hauptthema befindet sich ein untergeordnetes Thema, das wie die übergeordneten Themen funktioniert. Und der Vorteil ist, dass, wenn etwas schief geht, nur die Brunch-Partys und nicht der Baum (Hauptthema) betroffen sind.

Schritt eins – Erstellen Sie ein untergeordnetes Thema

Um ein untergeordnetes Theme zu erstellen, müssen Sie über einen FTP-Client wie FileZilla auf die Ordner Ihrer Site zugreifen. Sie können auch darauf zugreifen, indem Sie den Dateimanager verwenden, von dem aus die Site gehostet wird.

Wenn Sie sich erfolgreich angemeldet haben, gehen Sie zu wp-content > themes . Wenn Sie dorthin navigiert sind, können Sie Ordner für alle auf Ihrer Website installierten Themes sehen.

Jetzt müssen Sie einen Ordner für das untergeordnete Thema erstellen, das Sie erstellen möchten. Geben Sie dem Ordner einen Namen. Ich empfehle Ihnen, einen beschreibenden Namen zu schreiben, um künftige Verwirrung zu vermeiden. Nehmen wir an, der Name Ihres Themes lautet tropica. Sie können Ihr untergeordnetes Theme als tropica_childtheme benennen.

Schritt zwei – Fügen Sie eine CSS-Datei hinzu

Fügen Sie nach dem Erstellen des Ordners eine style.css-Datei hinzu. Fügen Sie in Ihrem Texteditor den folgenden Code ein:

 /* Theme Name: My Child Theme Theme URI: https: //mysite.com/ Description: This is a new child theme I have created for experimentation. Author: Your Name Author URI: https: //mysite.com/ Template: parenttheme Version: 0.1 */

Vergessen Sie nicht, Ihre Informationen durch den Dummy-Inhalt zu ersetzen. Stellen Sie sicher, dass Sie den Namen des übergeordneten Themas richtig schreiben (hier ist es Tropica). Eine weitere wichtige Sache ist, dass Sie das CSS des übergeordneten Themes in der style.css-Datei Ihres untergeordneten Themes aufrufen müssen.

Sie können dies tun, indem Sie einfach den folgenden Code hinzufügen:

 @import url("../parenttheme/style.css");

Hier ist das „übergeordnete Thema“ Tropica. Rechts?

Vergessen Sie also nicht, den Namen Ihres übergeordneten Themas richtig zu schreiben. Wenn Sie fertig sind, speichern Sie Ihre Datei als style.css im Ordner Ihres untergeordneten Themes.

Schritt 3 – Erstellen Sie eine Datei „functions.php“.

Als nächstes müssen Sie eine Datei „functions.php“ für Ihr Child-Theme erstellen. Öffnen Sie Ihren Texteditor und fügen Sie das folgende PHP-Tag ein:

 <?php //* Write your code here

Speichern Sie diese Datei nun als „functions.php“ und fügen Sie sie dem Ordner des untergeordneten Themes hinzu. Ziehen Sie diesen Ordner außerdem mit Ihrem FTP-Client in das Themenverzeichnis Ihrer Site.

Schritt vier – Aktivieren Sie Ihr Theme

Es ist Zeit, Ihr Theme zu aktivieren. Gehen Sie dazu im linken Bereich Ihres WordPress-Dashboards zu „Darstellung“ > „Themen“ . Dort können Sie das von Ihnen erstellte Child-Theme sehen. Klicken Sie auf die Schaltfläche „Aktivieren“ und Ihr untergeordnetes Thema beginnt zu funktionieren.

Schritt fünf – Fügen Sie Ihre Code-Snippets hinzu

Hier ist die Hauptaufgabe zu erledigen. Um dem untergeordneten Theme Codeausschnitte hinzuzufügen, navigieren Sie zu „Darstellung“ > „Themedatei-Editor“ . Wählen Sie nun „functions.php“ oder andere Dateien aus, die Sie anpassen möchten.

Hier ist ein Beispiel einer „functions.php“.

Wenn Sie fertig sind, klicken Sie auf Datei aktualisieren und Ihre Änderungen werden auf Ihrer Website implementiert. Laden Sie einfach die Seite neu und überprüfen Sie es selbst!

Abschluss

Jetzt wissen Sie, wie Sie benutzerdefinierte Code-Snippets zu Ihren WordPress-Sites hinzufügen. Nutzen wir das Wissen und machen Sie Ihre Website mit Ihren benutzerdefinierten Codes leistungsfähiger als je zuvor. Ich hoffe, dass das Hinzufügen von Codes keine schwierige Aufgabe mehr ist.