Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Replacing Pagination Titles on Portfolio Pages


Moonside

Question

16 answers to this question

Recommended Posts

  • 0

Is

26 minutes ago, christyprice said:

Hi @Moonside, I have a blog post on How to Replace or Remove Portfolio Pagination in Squarespace that should help!

Hi Christyprice

Is there a way to use the predefined font families of the page? As in heading 1 , heading 3 etc ? 

I tried to add it somehow but am new on CSS so I am not doing it right.

 

.item-pagination-link .item-pagination-prev-next {
  display: block !important;
  font-size: 15px;
  font-family: ?? 
  text-transform: uppercase;
}

 

 

Link to comment
  • 0

Ok I manage to do it I think  I am not sure.

 

.item-pagination-title {
  display:none;
}
.item-pagination-link .item-pagination-prev-next {
  display: block !important;
}
.item-pagination-link .item-pagination-prev-previous {
  display: block
}

.item-pagination-link .item-pagination-prev-next {
  display: block !important;
  font-size: 15px;
  font-family: "aktiv-grotesk"
  text-transform: uppercase;
}
.item-pagination-link .item-pagination-prev-previous {
  display: block !important;
  font-size: 15px;
  font-family: "aktiv-grotesk"
  text-transform: uppercase;
}

 

is this the right way? 

 

 

Link to comment
  • 0

@Panos_vsl, you have some redundant code in there. Try just this: 

.item-pagination-title {
  display:none;
}
.item-pagination-link .item-pagination-prev-next {
  display: block !important;
  font-size: 15px;
  font-family: "aktiv-grotesk";
  text-transform: uppercase;
}
.item-pagination-link .item-pagination-prev-previous {
  display: block !important;
  font-size: 15px;
  font-family: "aktiv-grotesk";
  text-transform: uppercase;
}

 

Edited by christyprice
added needed semicolons
Link to comment
  • 0
5 hours ago, natalia said:

What should I add to this code in order to substitute the words OLDER and NEWER at the bottom of the page for PREVIOUS and NEXT  ?

Thanks

 

If you share link to portfolio page, we can take a look

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
12 hours ago, tuanphan said:

If you share link to portfolio page, we can take a look

Thanks for your interest.

 
the blog has more than 100 posts, when we reach at the end of the first load we see the word OLDER in red and I would like to change it to PREVIOUS POSTS.
Same if you continue browsing and see OLDER and NEWER, I would like to read PREVIOUS and NEXT.
Thanks in advance. 
Link to comment
  • 0
20 hours ago, natalia said:

Thanks for your interest.

 
the blog has more than 100 posts, when we reach at the end of the first load we see the word OLDER in red and I would like to change it to PREVIOUS POSTS.
Same if you continue browsing and see OLDER and NEWER, I would like to read PREVIOUS and NEXT.
Thanks in advance. 

Add to Home > Design > Custom CSS

span.BlogList-pagination-link-label {
    visibility: hidden;
}
span.BlogList-pagination-link-label:before {
    visibility: visible;
    content: "Previous";
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

hello. hope everyone is well.

I have used @christyprice code posted on 22nd April. 

I have an error for font family line of code, i have highlighted in bold and included a screenshot of the custom css window.

.item-pagination-title {
  display:none;
}
.item-pagination-link .item-pagination-prev-next {
  display: block !important;
  font-size: 15px;
  font-family: "adelle-sans"
  text-transform: uppercase;
}
.item-pagination-link .item-pagination-prev-previous {
  display: block !important;
  font-size: 15px;
  font-family: "adelle-sans"
  text-transform: uppercase;
}

 

I have looked around other posts the see if i could problme solve but nothing worked so far.

thanks if you can help :)

Screenshot 2021-08-14 at 18.35.50.png

Link to comment
  • 0

A quick guess.

Your font-family lines are not terminated with a semi-colon.

But without being able to see the site it is hard to know.

Please post the URL for your site.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works.

We can then take a look at your issue.

Edited by creedon

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
  • 0

@Matthoosh I've updated the code above with the missing semicolons - thanks @creedonfor the catch there. If that doesn't work, as he mentioned, it's much easier to troubleshoot if you can share your site.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...