Passing Variables
You may be required to access page level variables from the parent page/post inside an Ajax Load More Repeater Template. This sounds like a simple task, however page level variables will be undefined when being called from within an Ajax request.
To get around this limitation, Ajax Load More provides a vars parameter that passes variables from a page template into a Repeater Template.
Note: The vars parameter is a semicolon separated list of key:value pairs. e.g. theme:red;show_image:false
In the following example, page level variables are being defined in the page template and passed to Ajax Load More via the vars shortcode parameter. Variables are then accessed from the $args array in the Repeater Template.
Page Template
In the page template, before the [ajax_load_more] shortcode we define page variables and then pass the variables to Ajax Load More via the vars shortcode parameter.
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php /* Template Name: ALM Passing Variables */ ?> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <h1><?php the_title(); ?></h1> <?php $theme_color = 'blue'; // Page theme color. $parent_id = $post->ID; // Current page ID. echo do_shortcode('[ajax_load_more vars="theme_color:' . $theme_color . ';parent_id:' . $parent_id . '"]'); ?> <?php endwhile; endif; ?> <?php get_footer(); ?> |
Warning: Do NOT pass variables that contain sensitive data! All variables passed to Ajax Load More using the vars parameter are printed into the HTML output and can be read in the page source.
Repeater Template
Repeater Templates have access to an $args array containing query data and other Ajax Load More related information by default. Variables passed from the page template using the vars parameter can be accessed under the alm_vars array key as shown below.
|
1 2 3 4 5 6 7 8 9 10 11 |
<?php // [ajax_load_more vars="theme_color:blue;parent_id:1926"] $vars = isset( $args ) && $args['alm_vars'] ? $args['alm_vars'] : ''; // Get `alm_vars`. ?> <div class="columns post-parent-<?php echo esc_html( $vars['parent_id'] ); ?>"> <h3> <a href="<?php the_permalink(); ?>" class="<?php echo $vars['theme_color']; ?>"><?php the_title(); ?></a> </h3> <p>Written by: <?php the_author_link(); ?></p> <?php the_excerpt(); ?> </div> |
Array Example ($args)
When passing variables using the vars parameter, the returned $args array will look like the following code sample. Notice the alm_vars arraykey, this array key contains the variable data that was passed to Ajax Load More.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
Array ( [post_type] => Array ( [0] => post ) [posts_per_page] => 5 [offset] => 0 [order] => DESC [orderby] => date [post_status] => publish [ignore_sticky_posts] => 1 [alm_vars] => Array ( [theme] => blue [parent_id] => 1926 ) [alm_id] => default ) |
Pro Tip: You can access the same $args and variable data when using the alm_query_args hook.