And Next and Prev Buttons to Post Widget. WordPress
- SOLVED
I am trying to add prev and next button under 5 post so they don't have to see all of them at once like this: http://209.151.238.98/~saffronr/nextposts.jpg
Here is what I have so far: http://209.151.238.98/~saffronr/?page_id=78
Thanks,
Rp
Answers (2)
Ivaylo Draganov answers:
Hello,
maybe you mean a content slider? For cycling the posts via prev/next links. Something like this:
[[LINK href="http://jquery.malsup.com/cycle/int2.html"]]http://jquery.malsup.com/cycle/int2.html[[/LINK]]
This could be implemented with jQuery and the above-mentioned plugin (there are lots of other plugins as well). If that's what you want then it's got little to do with PHP.
Let me know if you need help on implementing the solution.
Cheers
Ryan Pierce comments:
Yeah.. think solution might work. Let try it?
Ivaylo Draganov comments:
Alright, here come the steps:
1) Download the plugin (the lite version, download link is at the bottom of the page):
[[LINK href="http://jquery.malsup.com/cycle/download.html"]]http://jquery.malsup.com/cycle/download.html[[/LINK]]
2) Include it in the <head> (we do it using <em>wp_enqueue_script</em>) :
<?php
function my_init_method() {
if (!is_admin()) {
wp_register_script( 'jquery-cycle', 'http://path/to/your/js/folder/jquery.cycle.lite.1.1.min.js', array( 'jquery' ) );
wp_enqueue_script( 'jquery-cycle' );
}
}
add_action('init', 'my_init_method');
?>
3) Initiate the script (also in <head>)
<script>
// use whatever selector applies best to you
$('#categoryposts-4 > ul').cycle({
prev: '#prev',
next: '#next',
timeout: 0
});
</script>
4) Add another text widget below your posts' widget with the following HTML:
<a href="#" id="prev">Prev</a>
<a href="#" id="next">Next</a>
And let me know what happened :)
Ryan Pierce comments:
[[LINK href="http://209.151.238.98/~saffronr/?page_id=78"]]Check it[[/LINK]]
Did everything you said.. Just need to load in the post somewhere. Let me know.
thanks!
Ivaylo Draganov comments:
The Cycle plugin is not loaded in the page. You have to put the code from step 2 in your <em>functions.php</em> file. Maybe I did not explain that clearly enough.
And also, change the code from step 3 to:
<script type="text/javascript">
jQuery('#categoryposts-4 > ul').cycle({
prev: '#prev',
next: '#next',
timeout: 0
});
</script>
Ryan Pierce comments:
K,
added it to the functions and updated the other code in the header.php.
Still not workin..
Thanks,
Rp
Ivaylo Draganov comments:
I can fix that for you but it's too cumbersome to explain here. If you agree to grant me access you can contact me at iv.draganov [at] druuf.com
Ryan Pierce comments:
email sent.
Oleg Butuzov answers:
wp pagenavi
http://wordpress.org/extend/plugins/wp-pagenavi/
+
php code widget
http://wordpress.org/extend/plugins/php-code-widget/
Oleg Butuzov comments:
just install it and use this code for widget...
<?php if (!is_single()){ wp_pagenavi(); } ?>
first install widget
next wp-pagenavi
after for to the widgets area and add it.
Oleg Butuzov comments:
and only for next | prev links
<div class="nav-previous">
<?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts' ) ); ?>
</div>
<div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>' ) ); ?></div>
no need page navi in this case. just php code widget.
Ryan Pierce comments:
I got it kinda working just need to find out where to add the post to it..
http://209.151.238.98/~saffronr/?page_id=78
Ryan Pierce comments:
its category ID=1
Oleg Butuzov comments:
i can write custom query loop + paging structure if you want. thats will take about 10-15 minutes. jsut let me knwo if you intrested.
Oleg Butuzov comments:
Ryan, i will go sleep next half of hour... so if you want custom solution that will work... let me know next 15 minuts. =)