Skip to content

Instantly share code, notes, and snippets.

@mfields
Created December 6, 2010 16:16
Show Gist options
  • Select an option

  • Save mfields/730507 to your computer and use it in GitHub Desktop.

Select an option

Save mfields/730507 to your computer and use it in GitHub Desktop.
jQuery Post Loader for WordPress Home Page
<?php
/*
Plugin Name: mfields.org - Ajax Append Posts
Plugin URI:
Description:
Version: 0.1.1
Author: Michael Fields
Author URI: http://mfields.org/
Copyright 2010 Michael Fields michael@mfields.org
License GPLv2
*/
/**
* Ensure that jQuery is included on the homepage.
* @since 2010-12-06
*/
function mfields_ajax_append_posts_jquery() {
if ( is_home() ) {
wp_enqueue_script( 'jquery' );
}
}
add_action( 'wp_print_scripts', 'mfields_ajax_append_posts_jquery' );
/**
* Button to load more posts.
* This should be added outside the div that contains posts.
* @since 2010-12-06
*/
function mfields_ajax_append_posts_button( $format = '%d more posts.' ) {
$posts_remaining = (int) $GLOBALS['wp_query']->found_posts - (int) $GLOBALS['wp_query']->post_count;
$text = sprintf( $format, '<span id="posts-remaining">' . $posts_remaining . '</span>' );
print '<div id="load-posts">' . $text . '</div>';
}
add_action( 'mfields_ajax_append_posts_button', 'mfields_ajax_append_posts_button' );
/**
* Ajax callback.
*
* @return void.
*
* @todo check indexes.
* @todo move to admin-ajax.php???
*
* @since 2010-12-06
*/
function mfields_ajax_append_posts_query() {
$response = array();
query_posts( 'paged=' . $_GET['paged'] );
$response['post_count'] = (int) $GLOBALS['wp_query']->post_count;
if( have_posts() ) {
ob_start();
while( have_posts() ) {
the_post();
the_title( '<h2>', '</h2>' );
the_content();
}
$response['html'] = ob_get_contents();
ob_end_clean();
}
else {
$response['html'] = 'none';
}
print json_encode( $response );
exit;
}
add_action( 'wp_ajax_mfields_append_posts', 'mfields_ajax_append_posts_query' );
add_action( 'wp_ajax_nopriv_mfields_append_posts', 'mfields_ajax_append_posts_query' );
/**
* Print javascript to the footer.
*
* @return void.
*
* @todo fine-tune javascript.
* @todo minify javascript.
*
* @since 2010-12-06
*/
function mfields_ajax_append_posts_js() {
if ( is_home() ) {
global $wp_query;
$args = array(
'url' => admin_url( 'admin-ajax.php' ),
'total' => 0
);
if ( isset( $wp_query->found_posts ) ) {
$args['found_posts'] = (int) $wp_query->found_posts;
}
print <<< EOF
<script type="text/javascript">
jQuery( document ).ready( function( $ ) {
var next_page = 2;
var total_posts = {$args['found_posts']};
var posts_in_dom = $( '#content .hentry' ).length;
var posts_remaining = total_posts - posts_in_dom;
var button = $( '#load-posts' );
var container = $( '#content' );
button.click( function () {
$.ajax( {
url : '{$args['url']}',
data : { 'action' : 'mfields_append_posts', 'paged' : next_page },
type : 'GET',
dataType : 'json',
cache : false,
success : function( response ) {
if ( 0 === response.post_count ) {
button.remove();
}
else {
container.append( response.html );
posts_in_dom = posts_in_dom + parseInt( response.post_count );
posts_remaining = total_posts - posts_in_dom;
if ( 0 === posts_remaining ) {
button.remove();
}
else {
$( '#posts-remaining' ).text( posts_remaining );
next_page++;
}
}
}
} );
} );
});
</script>
EOF;
}
}
add_action( 'wp_footer', 'mfields_ajax_append_posts_js' );
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment