Is there a way to change default arrow icons that navigate pages left and right?

Custom code
1

As in the topic:
Is there a way to change default arrow icons that navigate pages left and right in R/m. I don’t think you can do that in the interface, but maybe someone did that with custom code and can share it with us.

Screen Shot 2022-08-31 at 2.40.15 PM
Screen Shot 2022-08-31 at 2.40.15 PM720×666 164 KB

Thank you!

2

Hi @Repponen Yes! There certainly is a way. You can do this using CSS with the following code. I’ve shared two options. One is to replace the image file. And there other is if you wish to use text or a glyph to make your arrows.

<style>
  /* OPTION 1: FOR REPLACING THE DEFAULT ARROW IMAGE */
  .right>.sprite {
    background-image: url('URLHERE');
  }

  .left>.sprite {
    background-image: url('URLHERE');
  }

  

  /* OPTION 2: FOR REPLACING THE DEFAULT ARROW WITH TEXT  */
  .right>.sprite, .left>.sprite {
    background-image: none !important;
  }

  .left:after {
    color: #000 !important;
    content: 'Lefty' !important;
    font-size: 12px;
  }

  .right:after {
    color: #000 !important;
    content: 'Righty' !important;
    font-size: 12px;
  }
</style>
2 Likes