Für diejenigen, die sich selbst mit CSS (Styleanweisungen) oder Javascript beschäftigen oder in die Situation kommen, diese in die WordPress-Seite einbinden zu müssen (z.B. von einem externen Anbieter).
Hier unterscheidet man, ob man einen kurzen Code direkt in die Webseite einbinden will oder eigene Dateien einbindet, die dann von der Seite geladen werden.
Alle diese Anweisungen schreibt man am besten in die functions.php des Childthemes und lädt die externen Dateien (falls vorhanden) ebenfalls in das Childtheme-Verzeichnis.
Hier die Beispiele die Code direkt in die Webseite einfügen. In dem Beispiel wird ausgegangen, dass der Javascript-Code am Ende der Seite eingebunden wird. Unter bestimmten Umständen, muss dieser auch im „Head“-Bereich ausgeführt werden.
// Färbt den Hintergrund der Webseite rot
function add_custom_css() {
?>
<style>body{background-color: red;}</style>
<?php
}
add_action( 'wp_head', 'ad_custom_css');// Erzeugt "Vorsicht"_Warnmeldung
function add_custom_js() {
?>
<script type="text/javascript">
alert("Vorsicht!");
</script>
<?php
}
add_action( 'wp_footer', 'add_custom_js');Und hier noch die Beispiele wie man Dateien im Childtheme einbindet. Exemplarisch wird hier noch gesetzt, dass in der Javascript-Datei jQuery verfügbar seine sollte. Es wurde hier als Abhängigkeit hinzugefügt.
// Lässt die Seite die Datei custom-style.css laden
function add_css_file() {
wp_enqueue_style( 'custom-style', get_template_directory_uri() . '/custom-style.css', array(), null);
}
add_action( 'wp_enqueue_scripts', 'add_css_file');// Lässt die Seite die Datei custom-js.js laden
function add_js_file() {
wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/custom-js.js', array('jquery'), null, false);
}
add_action('wp_enqueue_scripts', 'add_js_file');Auf die Erklärung zu Einbindungen von Dateien von anderen Servern, verzichte ich hier aufgrund der aktuellen Datenschutzlage.
