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

how to remove previous and next project links from version 7.1 portfolio

Question

Hi first time using Squarespace to set up my photography website. I'm not familiar with coding so need some help with removing the < previous project and next project > links that show at the end of the gallery block as below. I can't select the links whilst in edit to delete.

image.png.0c166939a9b28e6eef580ad42fe1397f.png

When i inspect the page coding it looks like the code below controls this section as it entire line (i.e. arrows and words) are removed from the squarespace page when i delete the html code, but reappears when i exit editing. Can anyone help with a code i can insert into the specific pages that i would like to use portfolios in?

<section class="item-pagination item-pagination--prev-next" data-collection-type="portfolio-grid-basic" data-controller="ItemPagination" data-controllers-bound="ItemPagination" id="yui_3_17_2_1_1577582297708_1767">
 
    <a href="/portfolio/project-one-lx24m" class="item-pagination-link item-pagination-link--prev" id="yui_3_17_2_1_1577582297708_1766">
      <div class="item-pagination-icon icon icon--stroke">
        <svg class="caret-left-icon--small" viewBox="0 0 9 16">
          <polyline fill="none" stroke-miterlimit="10" points="7.3,14.7 2.5,8 7.3,1.2"></polyline>
        </svg>
      </div>
      <span class="pagination-title-wrapper" id="yui_3_17_2_1_1577582297708_1765">
        <div class="item-pagination-prev-next">Previous</div>
        <h2 class="item-pagination-title" id="yui_3_17_2_1_1577582297708_1764">Project One</h2>
      </span>
    </a>
 
 
    <a href="/portfolio/project-three-xswdx" class="item-pagination-link item-pagination-link--next">
      <div class="pagination-title-wrapper">
        <div class="item-pagination-prev-next">Next</div>
        <h2 class="item-pagination-title">Project Three</h2>
      </div>
      <div class="item-pagination-icon icon icon--stroke">
        <svg class="caret-right-icon--small" viewBox="0 0 9 16">
          <polyline fill="none" stroke-miterlimit="10" points="1.6,1.2 6.5,7.9 1.6,14.7"></polyline>
        </svg>
      </div>
    </a>

thanks

Share this post


Link to post

7 answers to this question

Recommended Posts

  • 1

add to Page Settings > Advanced > Header

<style>
  .item-pagination {display: none !important;}
</style>

 


You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan. I work for a non-profit project (promote the establishment of free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. There are so many questions every day so I can't answer them all at once, I will try to answer them in the next few days.

Share this post


Link to post
  • 0
19 minutes ago, tuanphan said:

add to Page Settings > Advanced > Header


<style>
  .item-pagination {display: none !important;}
</style>

 

Thanks very much that worked perfectly

Share this post


Link to post
  • 0

@tuanphan Hi there, i'm trying to achieve something similar – do you know how to remove the right/left arrows next to the text or adjust the stroke line so the arrows are thinner? 

Thanks v much in advance!

Nabil 

Share this post


Link to post
  • 0
1 hour ago, noblestudio said:

@tuanphan Hi there, i'm trying to achieve something similar – do you know how to remove the right/left arrows next to the text or adjust the stroke line so the arrows are thinner? 

Thanks v much in advance!

Nabil 

Add to Home > Design > Custom CSS

.item-pagination-icon.icon.icon--stroke {
    display: none;
}

 


You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan. I work for a non-profit project (promote the establishment of free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. There are so many questions every day so I can't answer them all at once, I will try to answer them in the next few days.

Share this post


Link to post
  • 0
19 hours ago, tuanphan said:

Add to Home > Design > Custom CSS


.item-pagination-icon.icon.icon--stroke {
    display: none;
}

 

Thank you! : )

Share this post


Link to post
  • 0

I am trying to do something similar. However - I would like the project advance text to be different from the rollover state for each project  square.

Is this possible? 

If not simpler - I would like to keep the arrows for advancing but lose the text.  

THANKS IN ADVANCE!!

Share this post


Link to post
  • 0
On 9/10/2020 at 11:31 PM, AngelaD said:

I am trying to do something similar. However - I would like the project advance text to be different from the rollover state for each project  square.

Is this possible? 

If not simpler - I would like to keep the arrows for advancing but lose the text.  

THANKS IN ADVANCE!!

Can you share ink to portfolio page?


You can send your question to my email to get faster answer. / How to Setup Password & Share URL 

-- I'm Tuan. I work for a non-profit project (promote the establishment of free libraries). I check the forum once or twice a day to help out the community. If you don't see me answering your question, you can send it to the email above. There are so many questions every day so I can't answer them all at once, I will try to answer them in the next few days.

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...