I'm trying to use this approach http://wordpress.stackexchange.com/a/56349/18144 to create a 'load more' button in the sidebar on single.php. I would like to able to load more posts in a sidebar tab after clicking the load more button.
I'm missing something, since it doesn't work. But there are no errors in the console, so I don't really know where to start.
The sidebar on single.php has the following (simplified)structure:
<aside id="sidemenu-container">
<div id="side-top">....</div>
<div id="side-tabs">
<div class="tab_container">
<div id="new" class="tab_content">
<li>...</li>
</div>
<div id="must-see" class="tab_content">
<li>...</li>
</div>
</div>
<div id="side-bottom">
<li>Up | My Fav's |<a id="#blog-more" href="#" class="button radius">Load More</a></li>
</div>
</div>
</aside>
What I've got so far:
In functions.php I've added:
add_action( 'wp_enqueue_scripts', 'wpa56343_scripts', 100 );
function wpa56343_scripts() {
wp_enqueue_script(
'wpa56343_script',
get_template_directory_uri() . '/js/ajaxscripts.js?ver=1.0',
array( 'jquery' ),
null,
false
);
wp_localize_script(
'wpa56343_script',
'WPaAjax',
array(
'ajaxurl' => admin_url( 'admin-ajax.php' )
)
);
}
add_action('wp_ajax_wpa56343_more', 'wpa56343_more');
add_action('wp_ajax_nopriv_wpa56343_more', 'wpa56343_more');
function wpa56343_more(){
global $wp_query;
$offset = $_POST['postoffset'];
$args = array(
'offset' => $offset,
'posts_per_page' => 10
);
$wp_query = new WP_Query( $args );
get_template_part( 'includes/ajaxsidebar');
exit;
}
ajaxscripts.js contains:
jQuery(document).ready(function($){
$('#blog-more').click(function(e){ // <- added
e.preventDefault(); // <- added to prevent normal form submission
var postoffset = 5;
$.get(
WPaAjax.ajaxurl,
{
action : 'wpa56343_more',
postoffset : postoffset
},
function( response ) {
$('#new').append( response );
}
);
});
});
template part ajaxsidebar contains:
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<li><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_post_thumbnail() ?><?php the_title(); ?></a></li>
<?php endwhile; ?>
<?php endif; ?>