Wednesday, February 23, 2011

Show post with next previous links with jquery wordpress

First you need to download three images and upload it to your theme/images directory..
Here is the images..

second copy this code and paste it in the function.php in your theme directory.

function my_init_method() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery', '');
    wp_enqueue_script( 'jquery' );
add_action('init', 'my_init_method');

if(!function_exists('limit_post')) {
function limit_post($content) {
 $content = get_the_content($more_link_text, $stripteaser, $more_file);
      $content = apply_filters('the_content', $content);
      $content = str_replace(']]>', ']]>', $content);
      $content = substr(strip_tags($content), 0, 50).'…';
      echo $content;

if(!function_exists('content')) {
function content($id=''){
    $single = new WP_Query;
    while ($single->have_posts()) : $single->the_post(); ?>
               <div class="meta">             
               <a href="<?php the_permalink() ?>"><?php limit_post('the_content()'); ?></a>
<?php endwhile;

And place this code where you want to show post links.

<?php if(!is_page()) { ?>
#postPagination {float:left; padding: 3px;}
#postPagination label { color: #a68a5a;}
#contentInner {float: left;  padding: 3px;}
#contentInner a{color:#333333; text-decoration: none; }
#contentInner a:hover {color: #ff4b33; }
<div id="postPagination">
   <label>latest on blog</label>
   <a href="<?php echo get_permalink(get_adjacent_post(false,'',true)); ?>" title="Previous"><img src="<?php bloginfo('template_directory') ?>/images/previous.gif" border="0" /></a>
   <a href="<?php echo get_permalink(get_adjacent_post(false,'',false)); ?>" title="Next"><img src="<?php bloginfo('template_directory') ?>/images/next.gif" border="0" /></a>
<div id="contentInner">
if($_POST['id']) {
} else {
} ?>
<script type="text/javascript" charset="utf-8">

jQuery('#postPagination a').live('click', function(e){
var link = jQuery(this).attr('href');
var id = link.split("=");
return "<img src='<?php bloginfo('template_directory') ?>/images/loading.gif' />"
jQuery('#contentInner').load(link+' #contentInner', {id:id[1]});
jQuery('#postPagination').load(link+' #postPagination');
<?php } ?>

No comments:

Post a Comment