I'm trying to get values (latitude, longitude and an image) from the WordPress database and put it into a javascript array.

Unfortunately I'm a newbie at Javascript and PHP!

Here is the code I have so far:


    require_once( $_SERVER['DOCUMENT_ROOT'] . '/wp-config.php' );
    require_once( $_SERVER['DOCUMENT_ROOT'] . '/wp-load.php' );  


  include 'getdata.php';
<script  type="text/javascript">

  <?php $args = array( 'post_type' => 'listing', 'p' => $post_id ); ?>
  values = [ <?php
                            $listing_marker_loop = new WP_Query( $args );

                            while ( $listing_marker_loop->have_posts() ) : $listing_marker_loop->the_post(); 

                            $address = get_field('location');

                            global $post;
                            // load all 'categories' terms for the post




I'm trying to get it to give me an alert, so that I know I'm on the right track!

Can someone tell me how to make this work?

  • What are you trying to do? Latitude Longitude + Image looks like you want to build your own Google Map? In this case, maybe you can use this: codex.wordpress.org/Function_Reference/wp_localize_script Jul 21, 2014 at 6:58
  • Not Google maps; open source, but yes a map. How would I include that in my script? Jul 21, 2014 at 22:13
  • Do you want to use the map on your wordpress site, or externally? Jul 22, 2014 at 6:17
  • I'm using it on the wordpress site. Jul 23, 2014 at 1:54

1 Answer 1


EDIT: Changed the code to be used in a plugin.

Okay, with the info you provided, you can do something like this:

Step 1) Put your Javascript Map Loading stuff into a .js file. Save it somewhere in your plugin directory, like "myplugin/mapscript.js"

Step 2) create a file in your plugin directory, like "myplugin/myplugin.php". Insert the Plugin header so that it can be recognized by wordpress:

 * Plugin Name: My Superawesome Map stuff Plugin
 * Description: Does Maps and Stuff
 * Version: 1.0
 * Author: YOUR_NAME
 * License: GPL2

Insert a function in your plugins myplugin.php, where you register & enqueue the script.

function mapstuff_load_scripts() {
 if(is_singular()) {
 global $post;  
 wp_enqueue_script('mapstuff-script', plugins_url( 'mapscript.js', __FILE__ ));
    wp_localize_script('mapstuff-script', 'mapstuff_script_vars', array(
            'lat' => get_post_meta($post->ID,'lat',TRUE),
            'lng' => get_post_meta($post->ID,'lng',TRUE),
            'addrimg' => get_post_meta($post->ID,'addrimg',TRUE)
add_action('wp_enqueue_scripts', 'mapstuff_load_scripts');

I added the conditional is_singular to ensure this is only loaded on post/page view, not on search and index pages.

Step 3) Add the code for a shortcode in the plugin, so you can insert it on your page/post/wherever

function do_awesome_map($args = array()){
   return $returnage;

Step 4) Your localized vars will be in an javascript array, so change your mapscript to use these vars like this:


Step 4) Upload, insert the shortcode [awesomemap] in your page/post, success ! ;)

Happy Coding,


  • The latitude, longitude and image are stored in a wordpress post, will this script get these variables from a post? Jul 23, 2014 at 23:04
  • I need to do this without editing the theme. So I guess, it would either be through a plugin, or if I could make it stand alone it would be better. I was planning on accessing the map through an iFrame. Jul 23, 2014 at 23:05
  • I edited the answer so you can use it in a plugin. Jul 24, 2014 at 6:38
  • This code doesn't work for me. The alert comes up blank. Jul 24, 2014 at 22:36
  • Look into the sourcecode of the page. are the custom fields lng, lat and addrimg set for the page? Jul 25, 2014 at 7:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.