php get variables from inside a function when outside

Question

I've never done this before so am looking to learn how to do this. I am working in wordpress and creating a plugin. I have a function at the top of my document that adds some jQuery code to the footer of my page, the simplified version of this is as follows:

function slug_masonry_init() { ?>
<script>
jQuery(function($) {
var container = document.querySelector("#skizzar_masonry_loop");
var msnry = new Masonry( container, {
    columnWidth: <?php echo $masonry_item_width ?>,
    gutter: <?php echo $masonry_item_padding ?>,
    itemSelector: ".skizzar_masonry_entry"
});

});
</script>
<?php }
//add to wp_footer
add_action( 'wp_footer', 'slug_masonry_init' );

You will notice within the <script> there are some php variables: $masonry_item_width and $masonry_item_padding

These variables are user defined, the function that handles these is a little further down my document and looks like this:

function skizzar_masonry_shortcode($atts,$content = null) {
    global $skizzar_masonry_item_width, $skizzar_masonry_item_padding;
    $el_class = '';
        extract(shortcode_atts(array(
            "masonry_item_width" => '240',
            "masonry_item_padding" => '5',
            "el_class" => '',
        ),$atts));

        $skizzar_masonry_item_width = $masonry_item_width;
        $skizzar_masonry_item_padding = $masonry_item_padding;

        $output .= '<style>.skizzar_masonry_entry, .skizzar_masonry_entry img {width:'.$masonry_item_width.'px;} .skizzar_masonry_entry.skizzar_ma_double, .skizzar_masonry_entry.skizzar_ma_double img {width:560px; /* + padding */} .skizzar_masonry_entry {margin-bottom:'.$masonry_item_padding.'px; overflow:hidden;}</style>';
        $output .= '<div id="skizzar_masonry_loop" class="'.$el_class.'">';
        $output .= do_shortcode($content);
        $output .= '</div>';

        return $output;
    }

SIDE NOTE: the two global variables you see here: $skizzar_masonry_item_width and $skizzar_masonry_item_width are defined a little further up the document (between the two code snippets) - this is the user interface for inputting width and padding, the code you see here creates a shortcode.

What I don't know how to do is add $masonry_item_padding and masonry_item_width to my jQuery script at the top of the page - currently they are just returning blank.

1) http://stackoverflow.com/questions/16959576/reference-what-is-variable-scope-which-variables-are-accessible-from-where-and, 2) http://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming — deceze, Jan 19 '15 at 13:11

Machavity · Accepted Answer · 2015-01-19T13:23:09.327

3

You have to echo variables for them to output

columnWidth: <?php echo $masonry_item_width ?>,
gutter: <?php echo $masonry_item_padding ?>,

As to how to get your values... Wordpress makes plugins such a mess with all these standalone callbacks. Normally I would abhor doing this but I can't think of any other way to make this work. I'm putting them into an array to make for fewer globals. This part goes in your skizzar_masonry_shortcode

$GLOBAL['skizzarvar'] = array(
   'width' => $masonry_item_width, 
   'padding' => $masonry_item_padding
);

Then you can do this in your slug_masonry_init

<?php echo $GLOBAL['skizzarvar']['width'] ?>

edited Jan 19 '15 at 13:23

answered Jan 19 '15 at 13:09

Machavity

30,841
27
92
100

ah yes, well noticed. I have added it in though and still the same issue of the variables not being outputted...I assume because they are outside of the function – Sam Skirrow Jan 19 '15 at 13:11
I hate how Wordpress does their callbacks because it makes for situations like these. Added something that should help you. – Machavity Jan 19 '15 at 13:24
Annoyingly that still didn't work, although I understand what you are saying! Could it be anything to do with the position of my functions within the document? – Sam Skirrow Jan 19 '15 at 13:28
It could be, although I would except short tags to be processed first. Try doing a simple `echo` from each function and see which fires first. – Machavity Jan 19 '15 at 13:29
Cool, my apologies but I'm still feeling my way through php - how do I use echo to see which function is firing first? – Sam Skirrow Jan 19 '15 at 13:32
At the top of each function(TEMPORARILY) add something like `echo 'callback
';` and `echo 'footer
';`. Then save to your server and run. Based on the order they output is how you know the order they ran in. – Machavity Jan 19 '15 at 13:34
OK, so I added ' echo 'callback
';' to the slug_masonry_init and that appears at the bottom of my page (but that function is meant to be added to wp_footer anyway) and ' echo 'callback
' is just above where my shortcode is written – Sam Skirrow Jan 19 '15 at 13:39
Aha, Just figured it out - stupid really, but I had forgotten that I had changed the name of one of my variables! when I ammended it it works perfectly! Thanks for your help, I've genuinely learnt something new! – Sam Skirrow Jan 19 '15 at 13:43

score 1 · Answer 2 · answered Jan 19 '15 at 13:21

1

all you have to do is:

function slug_masonry_init() 
{ 
    global $masonry_item_width, $masonry_item_padding;
    ...

See more about global keyword here: http://php.net/manual/en/language.variables.scope.php

answered Jan 19 '15 at 13:21

Oleg Dubas

2,320
1
10
24

php get variables from inside a function when outside

2 Answers2