Hinzufügen eines Skripts zu WordPress
Veröffentlicht: 2022-09-19Das Hinzufügen eines Skripts zu WordPress ist ein einfacher Vorgang, der in wenigen Schritten abgeschlossen werden kann. Zuerst müssen Sie eine neue Datei in Ihrem WordPress-Verzeichnis erstellen. Als nächstes müssen Sie die Datei bearbeiten und Ihr Skript hinzufügen. Schließlich müssen Sie die Datei in Ihr WordPress-Verzeichnis hochladen.
Sie müssen den WordPress_enqueue_scripts-Hook verwenden, um Skripte und Stile im Frontend einzureihen. Sie können die Funktionen WP_register_script, WP_enqueue_script, WP_register_style und WP_enqueue_style verwenden, wenn Sie eine Funktion verknüpfen möchten.
Skript zum WordPress-Body hinzufügen

Das Hinzufügen eines Skripts zu Ihrem WordPress-Text ist eine großartige Möglichkeit, Ihrer Website zusätzliche Funktionen hinzuzufügen. Es gibt ein paar verschiedene Möglichkeiten, dies zu tun, aber am häufigsten wird das Skript einfach zur Datei header.php Ihres Themes hinzugefügt. Dadurch wird sichergestellt, dass das Skript auf jeder Seite Ihrer Website geladen wird. Eine weitere Option ist die Verwendung eines Plugins wie Head, Footer und Post Injections, mit dem Sie das Skript in die Kopf- oder Fußzeile Ihrer Website einfügen können.
In WordPress gibt es mehrere Möglichkeiten, dem Body-Tag ein Skript hinzuzufügen. Dazu kann ein Plugin wie theHeader and FooterScripts verwendet werden. Eine weitere Option besteht darin, die Datei header.php deines Designs hinzuzufügen oder zu ändern oder ein untergeordnetes Design zu verwenden. Das script-Tag sollte die URL der JavaScript-Datei sein, die Sie außerhalb von JavaScript verwenden möchten.
So fügen Sie WordPress-Beiträgen Javascript hinzu
Die Funktion WordPress_enqueue_scripts ist eine einfache Möglichkeit, Ihren Posts JavaScript hinzuzufügen. Wir können den Befehl WordPress_enqueue_script ('my_script,'path/to/my/script.js') verwenden, um sie in eine Warteschlange zu stellen.
WordPress Skript zum Header hinzufügen

Das Hinzufügen eines Skripts zum Header einer WordPress-Site ist ein ziemlich einfacher Vorgang. Zuerst musst du eine neue Datei im Verzeichnis /wp-content/themes/yourtheme/ erstellen und sie header.php nennen. Als nächstes öffnen Sie header.php in einem Texteditor und fügen den folgenden Code ganz oben in die Datei ein: wp_enqueue_script( 'script-name', get_template_directory_uri() . ' /js/script-name.js', array(), '1.0.0', wahr ); ? > Ersetzen Sie script -name durch den tatsächlichen Namen Ihres Skripts. Speichern Sie die Datei und laden Sie sie auf Ihren Server hoch. Das ist alles dazu! Ihr Skript sollte jetzt ordnungsgemäß in die Kopfzeile Ihrer WordPress-Site geladen werden.
Es gibt eine Vielzahl von Gründen, warum ein Header-Skript erforderlich sein kann. Dieser Artikel befasst sich nur damit, wie man das Code-Snippet hinzufügt, das jemand benötigt, um die Analytics-, Marketing- oder eine andere einzelne JavaScript-Zeile hinzuzufügen, die er auf seiner Seite benötigt. Diese Aufgabe könnte von jemandem ohne Vorkenntnisse in PHP oder JavaScript ausgeführt werden.
WordPress Enqueue-Skript

Das Hinzufügen von Skripten zu WordPress ist ein zweistufiger Prozess. Zuerst müssen Sie Ihr Skript mit der Funktion wp_register_script bei WordPress registrieren, und dann können Sie Ihr Skript mit der Funktion wp_enqueue_script in die Warteschlange einreihen. Die Funktion wp_register_script benötigt zwei Parameter: den Namen Ihres Skripts und die URL Ihres Skripts. Den Namen Ihres Skripts verwenden Sie, um Ihr Skript später in die Warteschlange einzureihen. Die URL ist der Speicherort Ihres Skripts. Die Funktion wp_enqueue_script benötigt zwei Parameter: den Namen Ihres Skripts und ein Array von Abhängigkeiten. Die Abhängigkeiten sind andere Skripts, von denen Ihr Skript abhängt. WordPress lädt diese Skripte automatisch vor Ihrem Skript.
Die Loop()-Funktion in WordPress
Die Funktion loop() ist eine Alternative zum Entwickeln eines Themas.
WordPress-Skript-Plugin

Ein WordPress-Skript-Plugin ist eine Art von Software, die Sie auf Ihrer WordPress-Site installieren können, um Features und Funktionen hinzuzufügen. Skript-Plugins sind in der Programmiersprache PHP geschrieben und können verwendet werden, um benutzerdefinierte Formulare zu erstellen, Benutzerberechtigungen zu verwalten oder sogar neue Funktionen zu Ihrer WordPress-Site hinzuzufügen.
Auf alle Plugins, Themes und den Core kann über die Enqueue-Script-Funktion von WordPress zugegriffen werden. Es lädt die Skripte und Stile, die von Plugins und Designs angefordert werden, stellt jedoch sicher, dass jedes nur einmal geladen wird. Indem Sie die Codekomplexität reduzieren, können Sie den Code einer Website schlanker halten, wodurch Ladezeiten und Codekonflikte reduziert werden. WP_enqueue_script() ist die Skriptsprache von WordPress, mit der Sie Ihr Skript verarbeiten und dorthin senden können, wo Sie es benötigen. Stylesheets können einfach mit WP hinzugefügt werden, indem Sie www.wpsi.com/css/stylesheets/ besuchen. Da diese Methode es anderen Plugins oder dem Websitebesitzer ermöglicht, unser Skript zu entfernen, ohne etwas im Kontext unseres Plugins codieren zu müssen, kann unser Skript entfernt werden, ohne etwas codieren zu müssen. Darüber hinaus können wir in einigen Fällen möglicherweise Bedingungen hinzufügen, damit unsere Skripte oder Stile nur auf bestimmten Seiten geladen werden.
Was sind WordPress-Skripte?
@wordpress/scripts sollte bearbeitet werden. Dieser Satz wiederverwendbarer Skripte soll WordPress-Entwicklern helfen. Dieses Paket enthält eine Configure-it-Funktion für jedes Tool, wodurch es einfach zu konfigurieren ist.
Sind WordPress-Plugins Javascript?
Aus diesem Grund gibt es kein „ JavaScript-WordPress-Plugin “.
WordPress-Skript ist eingeschrieben
WordPress ist in der Programmiersprache PHP geschrieben und verwendet eine MySQL-Datenbank.
Die Konfiguration jedes Tools in diesem Paket ist in die empfohlene Konfiguration dieses Tools integriert. „react-script“ und „kcd-script“ wurden verwendet, um dieses Paket zu erstellen. Es ist auch eine gute Idee zu lernen, wie man eine JavaScriptScriptScript-Anwendung erstellt . Der Artikel erklärt ausführlicher als die meisten anderen, wie die Build- und Startskripte verwendet werden. Wir werden die Breaking Changes auf ein Minimum beschränken, damit Sie problemlos auf @wordpress/scripts upgraden können. Nach einer Transformation Ihres Codes ist dieser bereit für die Produktion und für die beste Leistung optimiert. Die semantischen Versionsbereiche der Node-, npm- (oder Garn-)Versionen werden überprüft, um sicherzustellen, dass sie übereinstimmen.

Wenn die Installation nicht zufriedenstellend ist, werden Informationen über die erforderliche Version veröffentlicht. Indem Sie Richtlinien für den Codierungsstil für Ihre Dateien durchsetzen, können Sie Ihre Codierungsintegrität schützen. Standardmäßig werden Dateien, die node_modules, Herstellerordnern oder Builds zugeordnet sind, ignoriert. Sie können die ignorierten Dateien und Verzeichnisse Ihres Projekts anpassen, indem Sie sie zu einer.prettierignore-Datei hinzufügen. Da Markup zur Durchsetzung von Standards verwendet wird, verwendet das System markdownlint, um es zu verfolgen. Daher werden Dateien in den Ordnern „build“, „node_modules“ und „vendor“ ignoriert. Die @wordpress/stylelint-config-Konfiguration ist gemäß den CSS-Codierungsstandards für WordPress erforderlich.
Die WordPress-Pakete des Projekts müssen auf die neueste Version aktualisiert werden. Mit diesem Verfahren werden Zip-Dateien für WordPress-Plugins erstellt. Wenn Sie Ihren Code mithilfe der angegebenen Konfiguration transformieren, ist er für die Entwicklung bereit. Das Jest JavaScript Testing Framework ist auf eine einfache Benutzeroberfläche ausgelegt. Mit dieser Bibliothek können Sie Chrome oder Chromium mit einer API auf hoher Ebene mithilfe des DevTools-Protokolls steuern. Die Testdateien werden gesucht, wenn sie eine der folgenden gängigen Namenskonventionen aufweisen. Wenn es eine Webpack-Konfiguration im Verzeichnis der obersten Ebene Ihres Pakets findet, wird es diese verwenden.
Jest verwendet standardmäßig die folgenden empfohlenen Optionen: @wordpress/jest-preset-default. In der Dokumentation für Jest können Sie auch Ihre eigenen Überschreibungsoptionen auswählen. Das Test-Debugging kann mit jedem Chrome DevTools Protocol-fähigen Inspector-Client erfolgen. Als Beispiel können Sie die Google Chrome- und Visual Studio Code-Bibliotheken verwenden. Um den PHP-Debugger zu installieren, öffnen Sie Ihren WordPress-Browser und doppelklicken Sie auf die WP-Skripte. Ihre Tests werden ausgeführt und Ihre Ausführung wird abhängig von der ausgeführten Zeile angehalten. Anschließend werden die Devtools verwendet, um Breakpoints im Browserkontext zu generieren.
Die empfohlenen Konfigurationsdateien können verwendet werden, um dieses Paket zu implementieren. Darüber hinaus können Sie CSS-Modulen ein Präfix voranstellen, um ein einzelnes Modul zu erstellen. Der Erweiterung kann ein Modul wie style.scss hinzugefügt werden. Webpack ermöglicht die Referenzierung von Schriftarten (woff, woff2, eot, ttf und otf) und Bilddateien (bmp, png, jpg, jpeg, gif und wepb) aus CSS. Dieses Paket ist eine der Komponenten des Gutenberg-Projekts.
Kann Javascript auf WordPress verwendet werden?
WordPress kann verwendet werden, um mithilfe von JavaScript dynamische Elemente zu Beiträgen, Seiten oder ganzen Websites hinzuzufügen.
Welche Sprache sind WordPress-Plugins?
Da es die Kernsprache von WordPress ist und die Mehrheit der WordPress-Themes und -Plugins in PHP geschrieben sind, ist es am genauesten zu sagen, dass WordPress in PHP geschrieben ist.
Javascript ohne Plugin zu WordPress hinzufügen
Das Hinzufügen von Javascript zu WordPress ohne ein Plugin ist möglich, wird aber nicht empfohlen. Dies liegt daran, dass Plugins eine einfachere und sicherere Möglichkeit bieten, Javascript zu WordPress hinzuzufügen. Ohne ein Plugin müssten Sie Ihre WordPress-Designdateien bearbeiten, was Ihre Website beschädigen könnte, wenn es nicht richtig gemacht wird.
Sie können 19 verschiedene Arten von Websites mit WordPress erstellen, ohne Programmierkenntnisse zu haben, wenn Sie unseren Anweisungen in diesem Artikel folgen. Ein Plugin ist die einfachste Methode. Fügen Sie die folgenden Dateien in die Einstellungen ein: Kopf- und Fußzeilen. Wählen Sie den Code aus, den Sie speichern möchten, indem Sie das entsprechende Feld aus der Liste auswählen und auf die Schaltfläche Speichern klicken. Sie können den Code in dem Bereich ausgeben, in dem er hinzugefügt wird. Mit JavaScript ist es möglich, ein Plugin zu erstellen, das unabhängig vom Framework funktioniert. Wenn Sie Ihrer WordPress-Site benutzerdefiniertes JavaScript hinzufügen möchten, müssen Sie entweder ein Plugin verwenden oder die Datei functions.php des untergeordneten Designs ändern. Das Hinzufügen eines Felds zu den Tags wird verwendet, um Administratoren den Zugriff auf das Feld zu ermöglichen und eine JavaScript-Quelldatei oder einen Code einzubetten, der im Feld gespeichert ist.
So fügen Sie Ihrer WordPress-Site Skripte hinzu
WordPress ist eine leistungsstarke Plattform zum Veröffentlichen von Inhalten, aber möglicherweise sind benutzerdefinierte Skripte erforderlich, um sie noch besser zu machen. Dies kann entweder durch die Verwendung eines Plugins oder durch Ändern der Datei functions.php in Ihrem Child-Theme erfolgen. Wenn Sie Ihre Quelldateien nicht bearbeiten möchten, verwenden Sie am besten ein Plugin, das sicherstellt, dass Ihre benutzerdefinierten Skripts ordnungsgemäß in der richtigen Reihenfolge geladen werden. Ein einfaches Skript kann zu Ihrer WordPress-Site hinzugefügt werden. Der Inhalt der ZIP-Datei muss im Verzeichnis Ihrer WordPress-Installation mit dem Namen WP-content/plugins/ gespeichert werden. Nachdem das Plugin für einen aktiven Zeitraum aktiv war, navigieren Sie zu Einstellungen > Skripte. Sie können den Code auch in Ihre Webseite einfügen oder ein Plugin verwenden, um ihn für Sie zu generieren.
Benutzerdefiniertes WordPress-JavaScript
Eine großartige Möglichkeit, Ihrer WordPress-Site benutzerdefinierte Funktionen hinzuzufügen, ist benutzerdefiniertes JavaScript. Dies kann verwendet werden, um Ihrer Website Spezialeffekte oder Interaktivität hinzuzufügen oder sie einfach benutzerfreundlicher zu gestalten. Da JavaScript jedoch eine komplexe Sprache ist, ist es wichtig, einige Dinge zu wissen, bevor Sie damit beginnen, es zu Ihrer WordPress-Site hinzuzufügen. Erstens müssen Sie mit der Arbeit mit Code vertraut sein. Zweitens müssen Sie sicher sein, dass Ihr benutzerdefinierter Code mit der WordPress-Codebasis kompatibel ist. Und drittens müssen Sie sich der potenziellen Risiken bewusst sein, die das Hinzufügen von benutzerdefiniertem Code zu Ihrer Website mit sich bringt.