我正在使用一个谷歌地图插件，确切地说是这个。
无论如何，谷歌地图插件为我提供了更改一些设置的选项，比如自定义标记和许多其他有用的东西。所以我用我自己的图像更改了主标记，它在我的静态HTML网站上运行得很好，但在Wordpress中却没有，这就是为什么。
因此，假设我按如下方式加载插件：
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="js/gmaps.js"></script>
现在我有了一些选项，我可以通过我的themes_js在页脚或WORDPRESS中更改，并将其加载到我的functions.php中，它们在这里：
var map = new GMaps({
div: '#map',
lat: 94.09454,
lng: -219.35574
});
map.drawOverlay({
lat: 94.09454,
lng: -219.35574,
content: '<div class="map-logo"><img src="images/logo.png" alt=""></div>'
});
现在问题出在内容上，当我试图更改我的图像时，Wordpress不会得到图像，如果它只是src="images/logo.png"，它必须是src="<?php bloginfo('template_directory'); ?>/images/logo.png"，而问题是我调用的themes.js文件中的所有javascript都不读PHP，我需要使用<?php bloginfo('template_directory'); ?>。
那么，我该如何显示我的图像呢？因为我可以自定义它的唯一方法是通过他们通过javascript提供的参数，而我不能只使用HTML来调用我的自定义标记图像，即徽标。
我相信我不是唯一一个遇到这样问题的人。有人知道吗？？
更新
所以我尝试了wp_localize_script方法，结果发生了两件事。
- 我看不到我的图像，不是在断开的链接中，但根本看不到
- 由于某种原因，我的整个URL显示在标题中
这是我的functions.php，我在其中调用了wp_localize_script:
/**
* Enqueue scripts and styles.
*/
function loading() {
global $wp_scripts;
wp_enqueue_style( 'bootstrap_css', get_template_directory_uri() . '/css/bootstrap.css' );
wp_enqueue_style( 'main-style', get_stylesheet_uri() );
wp_enqueue_style( 'owlcarousel_css', get_template_directory_uri() . '/owl-carousel/owl.carousel.css' );
wp_enqueue_style( 'owltheme_css', get_template_directory_uri() . '/owl-carousel/owl.theme.css' );
wp_enqueue_style( 'animate_css', get_template_directory_uri() . '/css/animate.css' );
wp_enqueue_style( 'google_fonts', 'http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic' );
wp_enqueue_script( 'bootstrap_js', get_template_directory_uri() . '/js/bootstrap.js', array('jquery'), '', true );
wp_enqueue_script( 'owl_js', get_template_directory_uri() . '/owl-carousel/owl.carousel.js', array('jquery'), '', true );
wp_enqueue_script( 'theme_js', get_template_directory_uri() . '/js/theme.js', array('jquery', 'bootstrap_js'), '', true );
wp_enqueue_script( 'viewport_js', get_template_directory_uri() . '/js/jquery.viewportchecker.js', array('jquery'), '', true );
wp_enqueue_script( 'maps_js', get_template_directory_uri() . '/js/gmaps.js', array('jquery'), '', true );
wp_enqueue_script('maps_custom', get_stylesheet_directory_uri() . '/js/maps-custom.js');
wp_localize_script('maps_custom', 'mapsCustom', array(
'templateUrl' => bloginfo('template_directory'),));
wp_register_script ('html5_shiv', 'https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js', '', '', false );
wp_register_script ('respond_js', 'https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js', '', '', false );
$wp_scripts->add_data( 'html5_shiv', 'conditional', 'lt IE 9' );
$wp_scripts->add_data( 'respond_js', 'conditional', 'lt IE 9' );
}
add_action( 'wp_enqueue_scripts', 'loading' );
这是我称之为的地图
jQuery(document).ready(function( $ ) {
var href = mapsCustom.templateUrl + '/images/logo.png';
var map = new GMaps({
div: '#map',
lat: 22.22222,
lng: -22.22222
});
map.drawOverlay({
lat: 22.22222,
lng: -22.22222,
content: $href
});
});
使用wp_localize_script（）将任何类型的数据传递给加载的脚本，在这种情况下，我们需要bloginfo（'template_directory'）:
wp_enqueue_script('my-script', get_stylesheet_directory_uri() . '/js/my-script.js');
wp_localize_script('my-script', 'myScript', array(
'templateUrl' => bloginfo('template_directory'),));
现在，您可以访问脚本文件中的myScript.pluginsUrl:
var href = myScript.templateUrl + '/path/to/resource';
通常，您不能在JS文件中使用PHP。因此，为wordpress提供wp_localize_script（）。借助它，您可以本地化您的路径，然后将该本地化传递到JS文件。所以基本上它会起作用。
上面我举了一个例子，说明你是如何做到的。根据您的需要进行修改。
希望这能解决你的问题。