Change Design of Older Post Button

  • Unknown's avatar

    Hi,

    I was wondering if it was possible to make the older posts link at the bottom of the page into a button of some format ( like an arrow or a starfish). I’d like to make it stand out more. Is there any way to do it?

    Thanks so much!

    Arianna

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Yes, you can add an image as a background element to the newer and previous posts links and then hide the text. Or, you can add the image beside the text and keep the text.

    To replace the text for the previous and next navigation links below the posts, upload your images to your media library, get the URLs of those images and replace URL_OF_PREV and URL_OF_NEXT between the quote marks in the first two rules below and the copy and paste all the following to your custom CSS. The last rule below hides the text and also increases the size of the text so that the entire area where the image will be is clickable. The height and width values can be adjusted as desired.

    .nav-previous {
    background: url("URL_OF_PREV") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 50px;
    width: 90px;
    }
    
    .nav-next {
    background: url("URL_OF_NEXT") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 50px;
    width: 90px;
    }
    
    .nav-previous a, .nav-next a {
    color: rgba(0, 0, 0, 0);
    font-size: 20px;
    }
  • The topic ‘Change Design of Older Post Button’ is closed to new replies.