Möglicherweise eine der wichtigsten Dateien eines WordPress-Themes ist die functions.php Datei. Tatsächlich kann sie als ein verborgenes Juwel in der Entwicklung von WordPress-Themes betrachtet werden. Ein Theme-Entwickler kann das volle Potenzial des Themes leicht ausschöpfen, wenn er oder sie weiß, wie man functions.php gut nutzt. Man kann sie als die Funktionsbibliothek des Themes betrachten, die es Ihnen ermöglicht, die Kernfunktionen von WordPress zu erweitern und zu verbessern.
Verständnis der functions.php Datei
Die functions.php-Datei befindet sich im Theme-Ordner. Wie wir zuvor in diesem Beitrag gelernt haben, sollte ein Theme-Entwickler ein Verzeichnis im wp-content-Verzeichnis einer WordPress-Installation erstellen und es in Bezug zum beschreibenden Namen des individuellen Themes benennen. Zum Beispiel, wenn Ihr Theme-Name Mediapons Official ist, können Sie das Verzeichnis als mediapons oder mediapons-official benennen. Der Inhalt der functions.php-Datei kann Aktionen, Filter und benutzerdefinierte Funktionen sein, um das Verhalten des Themes zu gestalten. Machen Sie sich keine Sorgen, wenn Sie nicht wissen, was eine Aktion oder ein Filter ist. Sie können sie in der offiziellen WordPress-Dokumentation nachschlagen oder wir können versuchen, sie Ihnen mit verschiedenen Beispielen zu erklären.
Hinzufügen einer benutzerdefinierten CSS-Datei zu Ihrem Theme mithilfe der functions.php Datei
Wenn Sie zuvor Websites entwickelt haben, sollte das Hinzufügen von benutzerdefinierten CSS-Dateien für Sie Routine sein. CSS-Dateien können im Kopfbereich einer Website mit dem link Tag hinzugefügt werden. In WordPress ist es etwas programmatischer, CSS-Dateien im Kopfbereich hinzuzufügen, und der Theme-Entwickler muss sehr vorsichtig sein, da die wp_head Funktion im header.php-Template sein muss, um CSS-Dateien programmgesteuert zu laden.
Überprüfen Sie den unten stehenden Beispielcode, der zur functions.php Datei hinzugefügt werden sollte, um eine benutzerdefinierte CSS-Datei hinzuzufügen.
<?php
// Die Aktion wp_enqueue_scripts ist dafür verantwortlich, Skripte und Styles zu einer WordPress-Website hinzuzufügen.
add_action('wp_enqueue_scripts', 'mediapons_load_assets');
function mediapons_load_assets() {
// Lade die Stylesheet-Datei
wp_enqueue_style('mp-main-style', get_theme_file_uri('/build/index.css'), [], '1.0', 'all');
}Wie Sie sehen, gibt es zwei Punkte, auf die wir genauer achten sollten:
- Aktion wp_enqueue_scripts
- Funktion wp_enqueue_style
Das bedeutet, wenn Sie die Datei index.css, die sich im Build-Verzeichnis im Theme-Dateiverzeichnis befindet, hinzufügen möchten, müssen Sie die Funktion wp_enqueue_style am Haken wp_enqueue_scripts aufrufen.
Nach dem Hinzufügen des benutzerdefinierten Stylesheets fragen Sie sich vielleicht, wie Sie benutzerdefinierte Skriptdateien hinzufügen können. Beim Hinzufügen von benutzerdefinierten Skriptdateien gibt es wiederum eine Sache, auf die der Theme-Entwickler achten muss. Das ist die wp_footer Funktion. Ohne diese Funktion kann kein Skript im Fußbereich unserer Website hinzugefügt werden.
Überprüfen Sie den unten stehenden Beispielcode, der bearbeitet wurde, um zu zeigen, wie Sie benutzerdefinierte Skriptdateien hinzufügen können.
// Die Aktion wp_enqueue_scripts ist dafür verantwortlich, Skripte und Styles zu einer WordPress-Website hinzuzufügen.
add_action('wp_enqueue_scripts', 'mediapons_load_assets');
function mediapons_load_assets() {
// Lade die Stylesheet-Datei
wp_enqueue_style('mp-main-style', get_theme_file_uri('/build/index.css'), [], '1.0', 'all');
// Lade die Script-Datei
wp_enqueue_script('mp-main-script', get_theme_file_uri('/build/index.js'), ['jquery'], '1.0', true);
}Wie Sie sehen, wurde die einzige Änderung die Hinzufügung der Funktion wp_enqueue_script zur Hinzufügung eines benutzerdefinierten Skripts vorgenommen. Bei genauerem Hinsehen gibt es einige Unterschiede zwischen den Funktionen wp_enqueue_style und wp_enqueue_script.
- Die Funktion wp_enqueue_script hat eine Abhängigkeit von jQuery, die von älteren Entwicklern häufig verwendet wurde. Da WordPress es immer noch verwendet, müssen wir Entwickler es manchmal als Abhängigkeit hinzufügen. In der modernen Webentwicklung kann es jedoch als optional betrachtet werden.
- Im wp_enqueue_script ist der letzte Parameter true. Tatsächlich ist dies sehr wichtig, denn wenn er true ist, lädt WordPress unser benutzerdefiniertes Skript im Fußbereich der Website, andernfalls wird es im Kopfbereich geladen. Deshalb müssen Sie basierend auf der Art Ihres Skripts festlegen, ob es true oder false wird. In den meisten Fällen werden Skripte im Fußbereich geladen, daher ist dieser Parameter in der Regel auf true gesetzt.
Wenn Sie es bis hierhin geschafft haben, haben Sie eine grundlegende functions.php Datei erstellt, die für kleine Websites ausreicht, die nicht so viele Anpassungen benötigen. Weitere Informationen zur functions.php Datei finden Sie in der WordPress-Dokumentation.
Zusätzlich zur WordPress-Dokumentation können Sie von Zeit zu Zeit unsere Blog-Seite besuchen, um Informationen zu verschiedenen Bereichen der WordPress-Entwicklung zu erhalten. Wenn Sie kein WordPress-Entwickler sind, können Sie sich gerne über unsere Kontaktseite mit uns in Verbindung setzen und über Ihr nächstes Projekt sprechen.
