News!! How To Alter Or Take The Newer Post Service Too Older Posts Links

This article explains how to enshroud or alter the format of the "Older Posts" together with "Newer Post" together with "Home" links that are shown at the bottom of Blogger blogs amongst Layout or Designer themes.

Why are the older together with newer posts links used

Most designer together with layout themes have links at the bottom of your page of weblog posts which allow readers navigate dorsum together with frontward amid the listing of posts.

This is basic to how a weblog is intended to work:  you post regularly, together with give people a agency to become dorsum to previous posts.

The pager-links are peculiarly of import on pages that are reached using the Label or Archive gadgets, which may demo to a greater extent than posts than you lot usually create got on your dwelling solid page, or displaying inwards your blog.

But some people desire to withdraw them - together with this is fine provided readers create got other ways of navigating or thus the blog.

How to withdraw "Newer Posts" together with "Older Posts" from your blog

To totally withdraw these items, you lot simply add some novel CSS rules to your template inwards the usual way.

To withdraw "Older Posts" add:

#blog-pager-older-link {
float: right;
}

To withdraw "Newer Posts" add:

#blog-pager-older-link {
float: right;
}

Or to withdraw both of them together with the "Home" link that appears inwards betwixt them, add:

#blog-pager {
display: none;
}

How to format the "Newer Posts" together with "Older Posts"

Changing the agency that these links await is rattling similar, you lot simply add together the same codes, except instead of 

display: none;

you lot take to use the CSS chemical element for the upshot you lot want.   For example, to brand the text bigger together with bold, you lot mightiness operate rules like

font-size: 150%;
font-weight: bold;

You take to pose these commands within the curly brackets, where the display: none; is straight off - brand certain that each element has a semi-colon at the halt of it.   It makes the code easier to read if each element is on a novel line, but this isn't necessary.

Another selection is to swap the "float" commands or thus to put "older posts" on the left together with "newer posts" on the right (I've never quite understood why they were the other agency around).

You tin also use background images together with colours, amongst elements like:

background-image:url('URL OF YOUR IMAGE');

background-color:#cccccc;

How to alter the "Newer Posts" together with "Older Posts" text

If you lot desire to alter the text values - either to dissimilar words, or past times replacing them totally amongst pictures, you lot take to accept the disadvantages of editing your theme.   If this is ok, together with you lot you desire to buy the farm along then:

1  Edit your theme in the usual way

two  Replace the existing links:

• To supplant the "newer posts" link, find <data:newerPageTitle/>  in your theme, together with supplant it amongst whatsoever text you lot want.
  
• To supplant the "older posts" link, find <data:olderPageTitle/>  in your theme, together with supplant it amongst whatsoever text you lot want.
  
• To supplant the "home" link, find <data:homeMsg/>  in your theme, together with supplant it amongst whatsoever text you lot want.   

In each case, the code you lot are replacing volition locomote within another code, similar this:

  <span id='blog-pager-newer-link'>
      <a class='blog-pager-newer-link' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
      </span>

Make certain that you lot only supplant precisely the code listed above, including the < together with >'s.   The other code or thus sets upward the links to the actual older or newer posts, together with you lot don't desire to alter this.

Also, if you lot desire to operate a motion-picture demo instead, supplant it with <img alt='...' border='0' src='THE URL OF YOUR PICTURE'/> - of class amongst the right motion-picture demo URL pose in.

Do brand certain that the important of your pictures is obvious though - what may await similar a cute "newer posts" symbol to you lot mightiness locomote totally meaningless to person else.

---

Related Articles

How to add together a CSS dominion to your theme

How to edit your blogger theme

Understand the advantages together with disadvantages of subject editing

Finding the URL of a motion-picture demo inwards Picasa-web-albums

Understanding designer together with layout theme

Tweet

Subscribe to receive free email updates: