Change left/right arrows on blog section from article title to "next/previous"

Site URL: https://marigold-wolf-xzky.squarespace.com/

Hi there, I was wondering how to change the arrows that are on the bottom of the blog articles from the titles of the other articles to "next" / "previous". I assume it is some sort of custom coding as I could not find that option in the design popup when I am in the style editor. I attached a screenshot of what I would like to change for refrence and the site info is below.

Please let me know if I need to provide any additional information! Thank you very much in advance! 

Being that the site is in development it is password protected.

The url is: https://www.bellehumeurco.com/articles/fuel-your-productivity-with-the-power-of-documentation
The password is: "documentation"

I have searched a ton and not found any suggestions that seem to apple to 7.1 -- anyone have any thoughts? 

Hi. You mean replace pagination titles to Prev/Next text?

Hi there, that is correct! I would like the pagination to be prev/next instead of the title of the artice.

On 7/10/2021 at 11:15 AM, tuanphan said:

Hi. You mean replace pagination titles to Prev/Next text?

Oops! I am not sure if I replied correctly (sorry still new to this!)

Hi there, that is correct! I would like the pagination to be prev/next instead of the title of the article.

Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page.

<style>

  .item-pagination-title {
  
    display : none;
    
    }
    
  .item-pagination-link .item-pagination-prev-next {
  
    display : block;
    font-family : Open Sans;
    font-size : calc( 1 * 1rem );
    font-style : normal;
    font-weight : 700;
    letter-spacing : 0em;
    line-height : 1.3em;
    text-transform : none;
    
    }
    
  </style>

This for v7.1.

Let us know how it goes.

19 hours ago, creedon said:

Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page.

<style>

  .item-pagination-title {
  
    display : none;
    
    }
    
  .item-pagination-link .item-pagination-prev-next {
  
    display : block;
    font-family : Open Sans;
    font-size : calc( 1 * 1rem );
    font-style : normal;
    font-weight : 700;
    letter-spacing : 0em;
    line-height : 1.3em;
    text-transform : none;
    
    }
    
  </style>

This for v7.1.

Let us know how it goes.

This worked perfectly!!! Thank you so so much! I really appreciate it! 

is there a way to do this for carousels? 

www.annajonesbridal.co.uk/home-new

Thank you! your coding was helpful! Is there anyway we can these arrows up here?

16 hours ago, Gjergji said:

Is there anyway we can these arrows up here?

Depending if there is enough space to the sides to the blog post you can use the following.

Add the following to Blog Settings > Advanced > Page Header Code Injection for the blog page.

<style>

  #itemPagination {
  
    position : absolute;
    right : 0;
    top : 50%;
    transform : translateY( -50% );
    
    }
    
  </style>

This for v7.1.

Let us know how it goes.