FutureMedia
2/23/2015 - 12:24 PM

about.md

$.ajax({
	url: ajaxpagination.ajaxurl,
	type: 'post',
	data: {
		action: 'ajax_pagination',
		query_vars: ajaxpagination.query_vars,
		page: page
	},
	beforeSend: function() {
		$('#main').find( 'article' ).remove();
		$('#main nav').remove();
		$(document).scrollTop();
		$('#main').append( '<div class="page-content" id="loader">Loading New Posts...</div>' );
	},
	success: function( html ) {
		$('#main #loader').remove();
		$('#main').append( html );
	}
})
(function($) {
	$(document).on( 'click', '.nav-links a', function( event ) {
		event.preventDefault();
		alert( 'Clicked Link' );
	})
})(jQuery);
add_action( 'wp_ajax_nopriv_ajax_pagination', 'my_ajax_pagination' );
add_action( 'wp_ajax_ajax_pagination', 'my_ajax_pagination' );

function my_ajax_pagination() {
    $query_vars = json_decode( stripslashes( $_POST['query_vars'] ), true );

    $query_vars['paged'] = $_POST['page'];


    $posts = new WP_Query( $query_vars );
    $GLOBALS['wp_query'] = $posts;

    add_filter( 'editor_max_image_size', 'my_image_size_override' );

    if( ! $posts->have_posts() ) { 
        get_template_part( 'content', 'none' );
    }
    else {
        while ( $posts->have_posts() ) { 
            $posts->the_post();
            get_template_part( 'content', get_post_format() );
        }
    }
    remove_filter( 'editor_max_image_size', 'my_image_size_override' );

    the_posts_pagination( array(
        'prev_text'          => __( 'Previous page', 'twentyfifteen' ),
        'next_text'          => __( 'Next page', 'twentyfifteen' ),
        'before_page_number' => '<span class="meta-nav screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>',
    ) );

    die();
}

function my_image_size_override() {
    return array( 825, 510 );
}
wp_localize_script( 'ajax-pagination', 'ajaxpagination', array(
	'ajaxurl' => admin_url( 'admin-ajax.php' )
));
<script type='text/javascript'>
/* <![CDATA[ */
var ajaxpagination = {"ajaxurl":"http:\/\/wordpress.local\/wp-admin\/admin-ajax.php"};
/* ]]> */
</script>
global $wp_query;
wp_localize_script( 'ajax-pagination', 'ajaxpagination', array(
	'ajaxurl' => admin_url( 'admin-ajax.php' ),
	'query_vars' => json_encode( $wp_query->query )
));
function my_enqueue_assets() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_script( 'ajax-pagination',  get_stylesheet_directory_uri() . '/js/ajax-pagination.js', array( 'jquery' ), '1.0', true );
}
/*
 Theme Name:   Twenty Fifteen AJAX
 Theme URI:    http://yourwebsite.com/twentyfifteen-ajax/
 Description:  The Twenty Fifteen theme with additional AJAX pagination
 Author:       Daniel Pataki
 Author URI:   http://danielpataki.com
 Template:     twentyfifteen
 Version:      1.0.0
 Tags:         black, green, white, light, dark, two-columns, three-columns, left-sidebar, right-sidebar, fixed-layout, responsive-layout, custom-background, custom-header, custom-menu, editor-style, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, translation-ready, accessibility-ready, responsive-layout, infinite-scroll, post-slider, design, food, journal, magazine, news, photography, portfolio, clean, contemporary, dark, elegant, modern, professional, sophisticated
 Text Domain:  twentyfifteen-ajax
*/
add_action( 'wp_enqueue_scripts', 'my_enqueue_assets' );
function my_enqueue_assets() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
(function($) {

	function find_page_number( element ) {
		element.find('span').remove();
		return parseInt( element.html() );
	}

	$(document).on( 'click', '.nav-links a', function( event ) {
		event.preventDefault();

		page = find_page_number( $(this).clone() );

		$.ajax({
			url: ajaxpagination.ajaxurl,
			type: 'post',
			data: {
				action: 'ajax_pagination',
				query_vars: ajaxpagination.query_vars,
				page: page
			},
			success: function( html ) {
				$('#main').find( 'article' ).remove();
				$('#main nav').remove();
				$('#main').append( html );
			}
		})
	})
})(jQuery);
$(document).on( 'click', '.nav-links a', function( event ) {
	event.preventDefault();
	$.ajax({
		url: ajaxpagination.ajaxurl,
		type: 'post',
		data: {
			action: 'ajax_pagination'
		},
		success: function( result ) {
			alert( result );
		}
	})
})
add_action( 'wp_ajax_nopriv_ajax_pagination', 'my_ajax_pagination' );
add_action( 'wp_ajax_ajax_pagination', 'my_ajax_pagination' );

function my_ajax_pagination() {
    echo get_bloginfo( 'title' );
    die();
}

WP - Ajax action

Ajaxifying Wordpress via a child theme