StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow to Load Global Varables in header into External Javascript FIle
text
Body
copied!<p>I have created meta-data keys on my Wordpress posts, as follows: prettyAd, prettyName, prettyLink. I want to take the value for each key and load it into a Global Variable in the header of my site.</p> <p>I am setting Global variables in my WordPress Theme header as follows...</p> <pre><code><script type="text/javascript"> var prettyAd = "<?php echo get_post_meta($post->ID, 'prettyAd', true); ?>"; var prettyName = "<?php echo get_post_meta($post->ID, 'prettyName', true); ?>"; var prettyLink = "<?php echo get_post_meta($post->ID, 'prettyLink', true); ?>"; </script> </code></pre> <p>Which outputs the following when the page is loaded...</p> <pre><code><script type="text/javascript"> var prettyAd = "http://mydomainname.com/ad-placeholders/ad.png"; var prettyName = "Pet Store Shop"; var prettyLink = "http://mydomainname.com/advertise/"; </script> </code></pre> <p>After that, an external JavaScript file (prettyphoto.js - version 3.1) is loaded which I would like to access the variables set above.</p> <pre><code><script type="text/javascript" src="http://mydomain.com/wp-content/themes/wpnavigator/scripts/prettyphoto.js"></script> </code></pre> <p>Once the above file has access to the variables I would like to load them into the following html where I have referenced them.</p> <pre><code><p> Sponosor: <a href="var prettyLink" target="_blank">var prettyName</a> </p> <p> <a href="var prettyLink" target="_blank"> <img src="var prettyAd" width="468" height="60" alt="Sponsors Ad" /> </a> </p> </code></pre> <p>From what I understand I will need to have the JavaScript compile the whole tag as i can not load the variables directly as the src and href values. </p> <p>So what I am looking for help with is the following.</p> <ol> <li>How do I call the global variables that have been set in the header.php into the prettyphoto.js file</li> <li>How do I write a function that will use these variables and output the HTML shown above.</li> <li>Is there a better way of doing this than with Global variables or are they the only way.</li> </ol>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload