Changing the direction of the arrows

  • Resolved Corina_vocables

    (@corina_vocables)


    9 years, 2 months ago

    Hello!

    I have a technical question.

    When you are on a Post, there are arrows appearing down on the page. By clicking on the right one, you are going “forward” in time (according to the date on which the Post was written) and “backwards” in time by clicking on the left arrow.

    If you take the Homepage, the Posts go from the most recent to the oldest, which means that by clicking on the right arrow of a Post, (forward in time), you are going on the left on the Homepage. I hope you’re following me…

    This situation is a little counterintuitive in my case, because I’m not using the Posts as typical blog posts from the most recent to the oldest. So I’m wondering how to switch the direction of the arrows. In other words, by clicking on the right arrow, I would like to go “backwards” in time.

    Thanks for your time!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator Kathryn Presner

    (@zoonini)

    Hi there – to swap the position of the next/previous post navigation on single posts, and also flip the direction of the arrows, try this custom CSS and see if it does the trick:

    .post-navigation .nav-previous {
  float: right;
}
.post-navigation .nav-next {
  float: left;
}
.post-navigation .nav-previous a:before {
  -webkit-transform: rotate(-90deg);
  -moz-transform:    rotate(-90deg);
  transform:         rotate(-90deg);
}
.post-navigation .nav-next a:before {
  -webkit-transform: rotate(90deg);
  -moz-transform:    rotate(90deg);
  transform:         rotate(90deg);
}

    Don’t edit the theme files directly, otherwise your changes will be overwritten every time the theme is updated to the latest version.

    An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS.

    As alternatives, you could either install a standalone custom CSS plugin, or create a child theme.

    Let me know how it goes.

    This is exactly what I would like to do on a wordpress.com blog I have running cubic. I have premium so can do some custom CSS, will the above work or is there something else I can do?

    Thread Starter Corina_vocables

    (@corina_vocables)

    Hi!
    It worked for me yes!

    Moderator Kathryn Presner

    (@zoonini)

    mrsrg – yes, the same CSS should work on WordPress.com as well. If you need further help feel free to post in the CSS Customization forum:

    https://en.forums.wordpress.com/forum/css-customization

    Corina_vocables – thanks for confirming that it worked.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Changing the direction of the arrows’ is closed to new replies.