wp_localize_script zum Einfügen eines Bildes

Question

Ich habe Probleme mit wp_localize_script. Es gibt viele Fragen dazu, aber ich weiß nicht, wie ich sie in diesem speziellen Fall umsetzen soll. Ich machte eine jQuery-Datei, die ein Bild nach jedem Div mit einer bestimmten Klasse enthält. Die jQuery selbst ist in Ordnung, da ich das Bild-Tag mit einem Absatz-Tag ändern kann und es dann in meinem Browser angezeigt wird. Hier ist, was ich habe in functions.php

function wpa_scripts() { 
wp_enqueue_script(
    'divider', 
    get_template_directory_uri() . '/js/divider.js', 
    array('jquery'), 
    null, 
    true 
); 
$script_data = array(
    'image_path' => get_template_directory_uri() . '/images/' 
); 
wp_localize_script(
    'divider', 
    'divider_data', 
    $script_data 
); } add_action('wp_enqueue_scripts', 'wpa_scripts'); 

Und hier ist, was ich habe in meinem Js

jQuery(document).ready(function($){ 

$('.contentpage').after('<img src=" '$script_data' + divider_placeholder.png">'); }); 

Kann ich mir jemand sagen, was ich falsch gemacht habe? Danke im Voraus.

Mit freundlichen Grüßen, Stef

Answer 1

Sie müssen 'divider_data.image_path' statt $script_data in Ihrer jQuery-Funktion haben:

jQuery(document).ready(function($){ 

    $('.contentpage').after('<img src="' + divider_data.image_path + 'divider_placeholder.png">'); 

}); 

Referenz: https://codex.wordpress.org/Function_Reference/wp_localize_script

Answer 2

Ihre variable $script_data ist auch nicht in der richtigen Syntax in Ihrer JS-Datei als Sie nicht Ihre vordefinierte Variable divider_data lokalisierten Zugriff:

Statt:
$('.contentpage').after('<img src=" '$script_data' + divider_placeholder.png">'); });

es sein sollte:

$('.contentpage').after('<img src="' + divider_data.image_path + 'divider_placeholder.png">'); });