Need help? Check out our Support site, then


Changing the format of "Next" and "Previous" posts

  1. notchangingmyname
    Member

    At the bottom of my page, after the post and then after the comments, are the links for my last and my next post. Right now it displays the actual title of the post, but I'm thinking i would like to change it to say "Previous post" and "Next post". Is it possible to do that with CSS? Thanks!

    The blog I need help with is notchangingmyname.com.

  2. notchangingmyname
    Member

    Actually, after thinking about it more I'd like it to say "Next post: (title of blog post)" and "Previous post: (title of blog post)". Thanks again!

  3. You can do this, but you lose the grey background

    .nav-previous a, .nav-next a {
    visibility: hidden;
    }
    
    .nav-previous a:before {
    content: "« Previous";
    visibility: visible !important;
    }
    
    .nav-previous a:after {
    content: "Next »";
    visibility: visible !important;
    }
  4. Actually you can get the grey background back by adding a background declaration and padding to the last two rules I listed above.

    .nav-previous a:before {
    content: "« Previous";
    visibility: visible !important;
    background-color: #eee;
    padding: 10px;
    }

    .nav-previous a:after {
    content: "Next »";
    visibility: visible !important;
    background-color: #eee;
    padding: 10px;
    }`

  5. Oops, I forget a code tag.

    .nav-previous a:before {
    content: "« Previous";
    visibility: visible !important;
    background-color: #eee;
    padding: 10px;
    }
    
    .nav-previous a:after {
    content: "Next »";
    visibility: visible !important;
    background-color: #eee;
    padding: 10px;
    }
  6. Thanks for posting this code. For my site it comes up as one link that serves as a 'next' link, not as two separate links – next and previous.

    I am using the Chunk theme:
    http://wearelocalvancouver.wordpress.com/
    Click on "west side" and scroll down to see what I mean.

    Is there something I can add/change to the code that will solve this problem?

    Thanks!

  7. @wearelocalguides, since you are using a different theme, please start a new thread to prevent confusion on this one. CSS is theme specific so putting a solution for you here could confuse people finding this thread later on.

  8. notchangingmyname
    Member

    Helpful as always thesacredpath, thanks!!! I will give it a try tomorrow.

  9. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic