2

There's a way to use ajax to load the content from single.php or a custom .php like ajax-single.php like this page does it: https://yellowimages.com/all/objects/apparel-mockups/ also like them show the URL from the post when you click on the link, I hope somebody can help me with this because I can't find a way to do it yet.

EDIT 1: I use the next code on my index.php to load the post titles with the permalink:

<div id="single-post-container"></div>
<div class="wrap">
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    <a class="post-link" rel="<?php the_ID(); ?>" href="<?php the_permalink(); ?>">

       <?php the_title(); ?> 

    </a>

    <?php endwhile; endif; ?>
    </div>

This code on my single.php file:

    <?php

    $post = get_post($_POST['id']);

?>
    <div id="single-post post-<?php the_ID(); ?>">

    <?php while (have_posts()) : the_post(); ?>

                <?php the_title();?>

                <?php the_content();?>

    <?php endwhile;?> 

    </div>

And this on my footer.php file:

<script>
   jQuery(document).ready(function($){

        $.ajaxSetup({cache:false});
        $(".post-link").click(function(){
            var post_link = $(this).attr("href");

            $("#single-post-container").html("content loading");
            $("#single-post-container").load(post_link);
        return false;
        });

    });
</script>

This only load the content inside the div, and I'm having issues to display the URL from the post on the address bar, also the div doesn't expand with the content, I hope somebody can help me with this.

  • 1
    It would be great if you add what have done so far to achieve this. – bravokeyl Feb 27 '17 at 16:32
  • Ok, i already edit the post, to show what i'm doing – ozonostudio Feb 28 '17 at 4:09
  • I suggest starting with AJAX in Plugins to learn how AJAX works in WordPress. – Milo Feb 28 '17 at 4:13
0

If you want to load PHP file through AJAX use the below code.

function sendAJAX(){
    $('#container').load(
    "stuff.php",  // url
    { // json object of data to pass to the page
        stuff: "all your stuff goes in here...",
        moreStuff:  "even more stuff"
    });
    console.log('sendAJAX'); 
};

Let me know, In case of any doubts.

  • I edit the post, so Maybe i can address better my issue – ozonostudio Feb 28 '17 at 4:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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