Reverse / Inverse Pagination links on project pages

Hello,

Hoping someone can help me with this, when you click into a project, you get the pagination link at the bottom right and that link takes you to the previous project in the list, and if you click on the pagination link at the bottom left that takes you to a more recent project. Does anyone happen to know the CSS code so I can invert the pagination links.

I would like the pagination link on the bottom right to allow you to move towards the more recent projects, just like how when you read a book or a magazine on an iPad you flip from the right of the page to go to the next page. It doesn't feel natural the current way Squarespace has it by default that to go from say Project 2 to Project 3 in the list you're clicking the pagination link in the bottom left. 

Hi,

Can you share link to this page? We can check easier

Hello, the site is not currently live. 

On 4/12/2023 at 4:46 AM, HankCo said:

Hello, the site is not currently live. 

You can follow this to share url

Thanks. Sorry for the delay, for some reason I never got email notification on this and forgot to check back.

https://okra-gar-f7xf.squarespace.com
password: Happypencilclub

On 5/5/2023 at 12:58 AM, HankCo said:

Thanks. Sorry for the delay, for some reason I never got email notification on this and forgot to check back.

https://okra-gar-f7xf.squarespace.com
password: Happypencilclub

I think I misread the question. You want to change position of these paginations: left item to right and right item to left?

Exactly. I get you change those by rearranging the order of projects on the homepage but I want to keep the order of projects on the homepage showing the latest project first. So I was wondering if there’s a way to change the project pagination without messing up how they display on the homepage. 

On 5/8/2023 at 12:53 AM, HankCo said:

Exactly. I get you change those by rearranging the order of projects on the homepage but I want to keep the order of projects on the homepage showing the latest project first. So I was wondering if there’s a way to change the project pagination without messing up how they display on the homepage. 

Add to Design > Custom CSS

section#itemPagination {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}
section#itemPagination>a:first-child {
    margin-right: 0;
}
section#itemPagination>a:last-child {
    margin-left: 0 !important;
    margin-right: auto;
}

Thanks so much! Seems to be working, except for the first image it still clicks backwards, and is there a way to tweak it slightly so the arrows don't point in the opposite direction? 

 

On 5/10/2023 at 1:52 AM, HankCo said:

Thanks so much! Seems to be working, except for the first image it still clicks backwards, and is there a way to tweak it slightly so the arrows don't point in the opposite direction? 

 

No automatic way to change these items url, you will need to change manually on each page

If you still need, I can give code, you can repeat it & change url for all

Change the url? Is there a way to change the orientation of the arrows so they point in the opposite direction?

On 5/12/2023 at 10:16 PM, HankCo said:

Change the url? Is there a way to change the orientation of the arrows so they point in the opposite direction?

You mean this?

Yes but have them point in the opposite direction. The arrow on the right points to the left. But since we’ve inverted the pages, how do we get the arrows to also invert, so the arrow on the right for example should point to the right 

On 5/14/2023 at 3:35 PM, HankCo said:

Yes but have them point in the opposite direction. The arrow on the right points to the left. But since we’ve inverted the pages, how do we get the arrows to also invert, so the arrow on the right for example should point to the right 

Do this?

Correct