hosted by liquidweb


Go Back   Web Hosting Talk : Web Hosting Main Forums : Web Design and Content : How to implement this code into wordpress
Reply

Forum Jump

How to implement this code into wordpress

Reply Post New Thread In Web Design and Content Subscription
 
Send news tip View All Posts Thread Tools Search this Thread Display Modes
  #1  
Old 02-12-2013, 03:15 PM
mixers31 mixers31 is offline
Newbie
 
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



Sponsored Links
  #2  
Old 02-12-2013, 05:43 PM
james-r james-r is offline
Newbie
 
Join Date: Dec 2012
Posts: 19
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.
  #3  
Old 02-13-2013, 02:10 PM
solarblunet solarblunet is offline
Junior Guru
 
Join Date: Jan 2005
Location: Chicago
Posts: 185
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)."'>&laquo; First</a>";
if($paged > 1 && $showitems < $pages) echo "<a href='".get_pagenum_link($paged - 1)."'>&lsaquo; 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 &rsaquo;</a>";
if ($paged < $pages-1 && $paged+$range-1 < $pages && $showitems < $pages) echo "<a href='".get_pagenum_link($pages)."'>Last &raquo;</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);
} ?>

Sponsored Links
Reply

Similar Threads
Thread Thread Starter Forum Replies Last Post
Is your wordpress blog hacked with base64 code, iframe code, etc? Let us clean it! NetworkSamurai Other Web Hosting Related Offers 0 02-10-2012 09:49 PM
Code Snippet in Wordpress crazylane Web Design and Content 1 07-31-2009 01:12 PM
need to implement code in javascript 3-rx Programming Discussion 6 12-06-2007 08:27 PM
Code to implement contextual Ads? dbeck Programming Discussion 0 07-19-2005 02:06 PM
Code to implement contextual Ads? dbeck Hosting Security and Technology 0 07-19-2005 11:39 AM

Related posts from TheWhir.com
Title Type Date Posted
Researchers Uncover Security Vulnerabilities in Popular WordPress SEO Plugin Web Hosting News 2014-06-02 14:51:06
Web Hosting Sales and Promos Roundup - May 9, 2014 Web Hosting News 2014-05-23 16:54:10
Swarmify's New Approach to Content Delivery Uses Site Visitors to Accelerate Content Web Hosting News 2014-05-01 08:34:03
Media Temple Launches Premium WordPress Hosting for Designers, Web Developers Web Hosting News 2014-03-04 14:24:41
Pagely Launches Partner API for WordPress Shops to Offer Web Hosting Web Hosting News 2012-08-30 16:46:36


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes
Postbit Selector

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump
Login:
Log in with your username and password
Username:
Password:



Forgot Password?
Advertisement:
Web Hosting News:



 

X

Welcome to WebHostingTalk.com

Create your username to jump into the discussion!

WebHostingTalk.com is the largest, most influentual web hosting community on the Internet. Join us by filling in the form below.


(4 digit year)

Already a member?