I'm working on a new blog which display in a list, on sidebar, some categories and the posts of them. In the index page, in main content, I list some post titles from other category "New".

What I need is: when i click on one post link on sidebar to display in main content the post content via ajax or JQuery.

  • Your question is difficult to follow. Are you trying to load a post using AJAX? Feb 3, 2012 at 9:30

3 Answers 3


You will need to create a WordPress function that loads the post content and hook that into wp_ajax_nopriv. You will also need the jQuery ajax functions to send the $_POST data to your WordPress function via ajax and output the returned content in your empty div where you want it to display.

A simple approach would be to use the post ID in the class or id div tag so you can easily pull it out with jQuery.

Example using the sidebar code from Steven's answer:

 echo '<ul id="sidebar-ajax">';
  foreach($sidebar_posts as $post):
    echo '<li id="' .get_the_ID(). '">';
    echo '<a class="ajax-click" href="#">.'get_the_title().'</a>';
    echo '</li>';
  echo '</ul>';

Example jQuery (this should be in a separate file and enqueued using wp_enqueue_script so the the ajax url can be defined as a javascript namespace variable using wp_localize_script:

Enqueue the script and set the ajax url variable:

wp_enqueue_script( 'my-ajax-request', plugin_dir_url( __FILE__ ) . 'js/ajax.js', array( 'jquery' ) );
wp_localize_script( 'my-ajax-request', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );

Contents of the ajax.js file:

    jQuery(document).ready(function($) {

        $(".ajax-click").click(function() {
            var post_id = $(this).parent("li").attr("id");
            var ajaxURL = MyAjax.ajaxurl;

            type: 'POST',
            url: ajaxURL,
            data: {"action": "load-content", post_id: post_id },
            success: function(response) {
            return false;

*Note: Add a loading animation graphic where the post will eventually display and and give it a div id of "loading-animation" and set it to display: none.

WordPress function to return the post content to the ajax call:

add_action ( 'wp_ajax_nopriv_load-content', 'my_load_ajax_content' );
    function my_load_ajax_content () {
        $post_id = $_POST[ 'post_id' ];
        $post = get_post( $post_id, OBJECT);
        $response = apply_filters( 'the_content', $post->post_content );
        echo $response;
  • This was an excellent overview and it has helped me tremendously. One thing I noticed was that it grabs the post and not the single template. Is there a way to grab the single template instead?
    – Desi
    Jan 9, 2015 at 4:00

Just use something like this:

if (is_home) {
 // This retrieves 5 psots with the category "some-category"
 $sidebar_posts = get_posts("category=some-category&orderby=date&numberposts=5");
} else {
 $sidebar_posts = get_posts("category=some-other-category&orderby=date&numberposts=5");

Then in your sidebar section, use something like this:

  echo '<ul>';
  foreach($sidebar_posts as $post):
    echo '<li>';
    echo '<a href="'.get_the_permalink().'">.'get_the_title().'</a>';
    echo '</li>';
  echo '</ul>';

I think that is what you are looking for?

  • Thank you Steven fot the answer, but is not what I need. I heve already displayed in sidebar the categoryes and post of them. What I need is: when i click on one post link on sidebar to display in main content the post content via ajax or JQuery
    – Sebastian
    Aug 21, 2011 at 11:33

This answer is one of the best to explain the loading of post when selected from the side bar category and when the post is clicked on the post shows up but the posts can be target for either register/logged in or no-registered/public like:

add_action('wp_ajax_load-content', 'my_load_ajax_content'); // for users logged-in
add_action('wp_ajax_nopriv_load-content', 'my_load_ajax_content');//for users that are not logged in.

I got a problem when i was using this but later figure this out by reading other WordPress ajax works.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.