Die Vorraussetzungen
Zum einen benötigen wir ein JS zu dem wir unsere PHP-Daten übertragen wollen. Zum anderen benötigen wir natürlich ein paar PHP-Daten. Das JS das ich hier beispielhaft verwende, ist ein kurzes JS (jQuery) welches nicht etwas wirklich sinnvolles macht (wie so oft bei Beispielen)
jQuery(function ($){ $(document).ready(function(){ if( $("#header").is("*") ){ $("#blog-title").text(my_js_var); $("#blog-description").text(anothervar); } }); });
Das Script sucht im DOM nach einer ID mit den Namen header. Ist solch eine ID vorhanden, werden die Texte der Elemente mit den IDs blog-title und blog-description geändert. Um es etwas umgangssprachlicher zu formulieren: Das Script tauscht den Blogtitel und die Blogbeschreibung gegen andere Texte aus, zumindest bei den meisten WP-Themes die nach dem Schema-F aufgebaut sind. Über die Sinnhaftigkeit eines solchen Vorhabens muss man nicht diskutieren, es ist ein Beispiel. Genauso gut könnten es Schaltflächen sein die Übersetzt werden müssen, Benutzerdaten die ausgegeben werden wollen, oder, oder, oder.
Die Hau-Drauf-Methode
Obiges JS legt man sich als Datei ab und holt es sich via add_action
und wp_enqueue_script
ganz normal ins Blog rein.
add_action( 'init', 'print_scipt_enqueue' ); function print_scipt_enqueue(){ $jsfile = plugins_url('/php2js_print_script.js', __FILE__ ); wp_register_script( 'php2js-print', $jsfile, array('jquery'), false, true ); wp_enqueue_script( 'php2js-print' ); }
Wie man sieht, sind im jQuery-Script weder my_js_var
noch anothervar
definiert, dass Script würde also nicht funktionieren. Die Definition der beiden Variablen machen wir in einen zweiten Schritt. Dazu gehen wir recht grob vor und schreiben einfach einen zweiten Script-Block in den Head-Bereich. Man kann es sogar noch grober machen und den Script-Block einfach irgendwo ins auszugebende HTML knallen, aber so grob wollen wir dann ja doch nicht sein:
add_action( 'wp_head', 'print_my_jscript' ); function print_my_jscript(){ echo '<script type="text/javascript">var my_js_var = "Hallo Welt!"; var anothervar = "Schubidu";</script>'; }
Damit haben wir erreicht das wir im Head-Bereich einen Script-Block haben der die beiden Variablen my_js_var
und anothervar
definiert, die von einem jQuery-Script im Footer verwendet werden. So gesehen ist die Sache noch etwas sinnlos, man hätte das alles in einem Abwasch erledigen können. Aber wenn man nun bedenkt das man anstatt “Hallo Welt!” auch sämtliche von WordPress zur Verfügung gestellte Daten verwenden kann, dann macht das alles schon mehr Sinn.
function print_my_script(){ $current_user = wp_get_current_user(); if( 0 != $current_user->ID ){ $name = $current_user->user_login; } else { $name = 'Unbekannter'; } echo '<script type="text/javascript">var my_js_var = "Hallo Welt!"; var anothervar = "Willkommen ' . $name . '!";</script>'; }
Registrierte und eingeloggte Besucher würden nun mit ihren Namen begrüßt werden, unregistrierte und nicht eingeloggte Besucher mit einem “Willkommen Unbekannter!”.
Diese Methode ist nicht wirklich sauber und hat so ihre Tücken. Würde z.B. ein anderes JS ebenfalls die Variable my_js_var
verwenden, käme es schnell zu chaotischen Verhältnissen.
Schlagworte: Anfänger, Fortgeschrittene, JavaScript, JS, Lokalisation, PHP