Results 1 to 3 of 3
-
02-12-2013, 03:15 PM #1Newbie
- Join Date
- Apr 2009
- Posts
- 27
How to implement this code into wordpress
I would like to add next / previous buttons on my post pages similar to DamnLol. I found this code code online but its for Blogger. Can someone help me with converting this to Wordpress? Here's the code:
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
.blog-pager-newer-link,.blog-pager-older-link
{
position:absolute;
top:1px;
z-index:999;
color:transparent !important;
width:55px;
height:66px;
background-color:red;
}
.blog-pager-newer-link {
position:absolute;
right:-27px; /* Change this value to change the position of newer post link */
top:50px; /* Change the position from top */
background:url('http://www.damnlol.com/img/buttons.png');
background-position:55px 0px;
background-color:transparent !important;
}
.blog-pager-newer-link:active {
background:url('http://www.damnlol.com/img/buttons.png');
background-position:55px 67px;
}
.blog-pager-older-link {
position:absolute;
left:-67px; /* Change this value to change the position of older post link */
top:50px; /* Change the position from top */
background:url('http://www.damnlol.com/img/buttons.png');
background-color:transparent !important;
}
.blog-pager-older-link:active {
background:url('http://www.damnlol.com/img/buttons.png');
background-position:0px 67px;
}
</style>
</b:if>
Thanks guys
-
02-12-2013, 05:43 PM #2Newbie
- Join Date
- Dec 2012
- Posts
- 20
Hello mixers31!
You would be better off changing that code to use the CSS classes in WordPress. Because WordPress finds each page using a database, you would need to use a plugin like the following:
codex.wordpress.org/Next_and_Previous_Links
You would then need to get the classes used by WordPress for their Next and Previous links and style them to have those images for the links. Looking at the CSS code you provided, you would have to change the classes .blog-pager-newer-link , .blog-pager-older-link, and the others for to use the WordPress classes.
Unfortunately, that will require you to know CSS code and how it works. You would be better off looking in the WordPress plugins to see if there is a version you like already set up.
<<signature to be set up in your profile>>Last edited by foobic; 02-12-2013 at 09:34 PM.
-
02-13-2013, 02:10 PM #3Junior Guru
- Join Date
- Jan 2005
- Location
- Chicago
- Posts
- 199
Here is some wordpress code to help you out buddy :-P you'll thank me.
Add to functions.php:
function pagination($pages = '', $range = 4)
{
$showitems = ($range * 2)+1;
global $paged;
if(empty($paged)) $paged = 1;
if($pages == '')
{
global $wp_query;
$pages = $wp_query->max_num_pages;
if(!$pages)
{
$pages = 1;
}
}
if(1 != $pages)
{
echo "<div class=\"pagination\"><span>Page ".$paged." of ".$pages."</span>";
if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href='".get_pagenum_link(1)."'>« First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>‹ Previous</a>";
for ($i=1; $i <= $pages; $i++)
{
if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
{
echo ($paged == $i)? "<span class=\"current\">".$i."</span>":"<a href='".get_pagenum_link($i)."' class=\"inactive\">".$i."</a>";
}
}
if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Next ›</a>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>Last »</a>";
echo "</div>\n";
}
}
Add to your css file:
.pagination {
clear:both;
position:relative;
font-size:11px;
line-height:13px;
}
.pagination span, .pagination a {
display:block;
float:left;
margin: 2px 2px 2px 0;
padding:6px 9px 5px 9px;
text-decoration:none;
width:auto;
color:#fff;
background: #555;
}
.pagination a:hover{
color:#fff;
background: #3279BB;
}
.pagination .current{
padding:6px 9px 5px 9px;
background: #3279BB;
color:#fff;
}
Now call where you want it in your template, and modify accordingly.
<?php if (function_exists("pagination")) {
pagination($additional_loop->max_num_pages);
} ?>
Similar Threads
-
Is your wordpress blog hacked with base64 code, iframe code, etc? Let us clean it!
By ipexperts in forum Other Web Hosting Related OffersReplies: 0Last Post: 02-10-2012, 09:49 PM -
Code Snippet in Wordpress
By crazylane in forum Web Design and ContentReplies: 1Last Post: 07-31-2009, 01:12 PM -
need to implement code in javascript
By 3-rx in forum Programming DiscussionReplies: 6Last Post: 12-06-2007, 08:27 PM -
Code to implement contextual Ads?
By dbeck in forum Programming DiscussionReplies: 0Last Post: 07-19-2005, 02:06 PM -
Code to implement contextual Ads?
By dbeck in forum Hosting Security and TechnologyReplies: 0Last Post: 07-19-2005, 11:39 AM