jQuery Ajax in WordPress: make your posts dynamic

As front end dogmas go, jQuery is getting all the buzz.  If you’re using WordPress, jQuery is already built in to the code, so you can build your own little plug-ins and widgets with minimal set-up time.

Let’s say that you wanted to have a post with all the hottest things that people are searching for on Google right now. Something like this:

How would you do that? Turns out, it’s ridiculously easy. I won’t go into the http proxy you have to build to grab aggregate data from a remote server (another lesson, another time), but once you’ve set up this proxy, you can incorporate it into your wordpress post or page by including the following lines of code:

1
2
3
4
5
6
<script type="text/javascript">// < ![CDATA[
// < ![CDATA[
  jQuery.get("PAGE_URL",function(data){
    jQuery("#ID").html(data);
  });
// ]]></script>

Just replace ID with the id of the paragraph element you want to insert the data into, and replace PAGE_URL with the URL of your http proxy page.  Why is this so easy? We’re building upon the native jQuery library that’s already embedded in wordpress.  Of course, if you don’t use wordpress, you can still use this method, but you’ll want to install jQuery first, and link to the library before calling the above script.

If the above code doesn’t work on your blog, you may want to check out my post on troubleshooting jQuery.

  • Print
  • PDF
  • email
  • Facebook
  • Twitter
  • Digg
  • Google Bookmarks
This entry was posted in Technology and tagged , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>