Changing posts content without reloading page

  • Unknown's avatar
    fazgraphicblog · Member ·

    Hey!
    I am new here, I will be very grateful for your help in getting the subject.
    I want to be able to change the content in a given place (div) based on the listed posts (title / thumbnail) without reloading the page.
    I have found such a tutorial (which is my dream come true solution), but it did not work -> like author did not finished one line of code or something?

    How to dynamically load posts on click using Ajax in Genesis


    Another solution I found (and it worked, but on a regular static page, not inside a wordpress my own template) is the following code (it refers to js from google):

    <DOCTYPE html>
<html>
  <head>

   
    https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js
   
   
   <script>
      $(document).ready(function(){
        // Set trigger and container variables
        var trigger = $('#nav ul li a'),
            container = $('#content');
       
        // Fire on click
        trigger.on('click', function(){
          // Set $this for re-use. Set target from data attribute
          var $this = $(this),
            target = $this.data('target');       
         
          // Load target page into container
          container.load(target + '.php');
         
          // Stop normal link behavior
          return false;
        });
      });
    </script>
  </head>
  <body>
    <nav id="nav">
      <ul>
        <li><a href="#" data-target="home">Home</a></li>
        <li><a href="#" data-target="about">About</a></li>
      </ul>
    </nav>
    <div id="content">
      <?php include('home.php'); ?>
    </div>
  </body>
</html>

    I will be very grateful for any help!

    The blog I need help with is: (visible only to logged in users)

  • deancroyal · Staff ·

    Hi there – Just to clarify, are you attempting to apply this code, and see it work, on your site at fazgraphicblog.wordpress.com?

    If you are, I recommend reading this: https://wordpress.com/support/code/

    Hopefully that sheds some light on some of the behavior you are seeing that may be causing some confusion. :)

    Let us know if you have any questions about what you read there.

    If this is for another site, pass us the URL and we can take a look to see if/how we can help.

  • The topic ‘Changing posts content without reloading page’ is closed to new replies.