Replace Older, Newer And Home Blogger links with an image or text andrey суббота, 6 апреля 2013 г. No Comment

Newer Post, Home and Older Post are links that appear on the bottom of the posts. When a visitor click on one of these links, they will take him to the page with the list of your previous posts.
The number of the posts on these pages will be the same as the number of the posts on your main page.

Replace Older
What we can do:

A. Change the text of Newer, Older, Home links
B. Place a picture beside them (a small icon, arrow, or whatever...)
C. Add an image instead of the links

So let's start customizing them...

1. Log in to your Blogger Dashboard, go to Design > Edit HTML > make a backup of your template
2. Check the "Expand Widget Templates" box
3. Find (CTRL + F) the following code:

   
     
     
     

   


   
     
     
     

   


   

Find in this code the following fragments which corresponds to each page links
  1. represents Newer Posts link
  2. represents Older Posts link
  3. represents Home link
Now change these fragments of codes as it follows:

A. Change the text of the links

You need to REPLACE following parts in original code with ANY TEXT you like:
  • replace with, for example NEXT POST 
  • replace with, for example PREVIOUS POST
  • replace (only the first one) with, for example HOMEPAGE

    B. Place a picture beside Newer Posts, Older Posts and Home links

    Add the below code just at the beginning of each of the colored fragments of codes from step 3.

    URL Address"/>

    So it should look like this

    URL Address"/>

    Note: Replace URL Address text with the url address of the image you want to appear

    C. Replace Older Posts, Newer Posts and Home links with an image/picture

    You can place any kind of picture you want All you have to do is use this code for the pic:

    URL ADDRESS"/>


    ...just replace URL ADDRESS, with the URL of your hosted picture
    ...and in code, REPLACE the original link code for text with picture code
    • replace with the pic for newer (next) posts
    • replace with the pic for older (previous) posts
    • replace (only the first one) with the pic for homepage

    4. That's it! Preview and Save the Template.
    Newer Post, Home and Older Post are links that appear on the bottom of the posts. When a visitor click on one of these links, they will take him to the page with the list of your previous posts.
    The number of the posts on these pages will be the same as the number of the posts on your main page.

    Replace Older
    What we can do:

    A. Change the text of Newer, Older, Home links
    B. Place a picture beside them (a small icon, arrow, or whatever...)
    C. Add an image instead of the links

    So let's start customizing them...

    1. Log in to your Blogger Dashboard, go to Design > Edit HTML > make a backup of your template
    2. Check the "Expand Widget Templates" box
    3. Find (CTRL + F) the following code:

       
         
         
         

       


       
         
         
         

       


       

    Find in this code the following fragments which corresponds to each page links
    1. represents Newer Posts link
    2. represents Older Posts link
    3. represents Home link
    Now change these fragments of codes as it follows:

    A. Change the text of the links

    You need to REPLACE following parts in original code with ANY TEXT you like:
    • replace with, for example NEXT POST 
    • replace with, for example PREVIOUS POST
    • replace (only the first one) with, for example HOMEPAGE

      B. Place a picture beside Newer Posts, Older Posts and Home links

      Add the below code just at the beginning of each of the colored fragments of codes from step 3.

      URL Address"/>

      So it should look like this

      URL Address"/>

      Note: Replace URL Address text with the url address of the image you want to appear

      C. Replace Older Posts, Newer Posts and Home links with an image/picture

      You can place any kind of picture you want All you have to do is use this code for the pic:

      URL ADDRESS"/>


      ...just replace URL ADDRESS, with the URL of your hosted picture
      ...and in code, REPLACE the original link code for text with picture code
      • replace with the pic for newer (next) posts
      • replace with the pic for older (previous) posts
      • replace (only the first one) with the pic for homepage

      4. That's it! Preview and Save the Template.
      by Jillur Rahman

      Jillur Rahman is a Web designers. He enjoys to make blogger templates. He always try to make modern and 3D looking Templates. You can by his templates from Themeforest.

      Follow him @ Twitter | Facebook | Google Plus

      No Comment