Jump to content

Adding Anchor Links in 7.1

Recommended Posts

Hi everyone,

I am used to creating anchor links in earlier versions of Squarespace. Now I need to link from a header button down the page to a section. HOWEVER that section is a Simple List in which you can only Edit Content via the side panel.

I can find no where to put the anchor link code without it being visible and no way to add it just above the title. If I add a new section above it for the code there is this weird visual gap in the website design. Can someone help me solve this?

Screenshot 2022-10-21 at 12.22.18.png

Link to comment
  • Replies 5
  • Created
  • Last Reply

Top Posters In This Topic

This is a problem that crops up regularly. I would suggest that you could hide the List Section Title, and replace that with a bottom-aligned narrow section with a text block to replace the title, and you can then add a code block with your anchor ID (or add the title in the code block depending on your preference.) This is a work around, but it will work, and shouldn't affect the look. Hope that helps!

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment
23 minutes ago, aliciainspired said:

Hi Ziggy, thanks for your suggestion, although I am a bit confused about what you mean? How do I replace the title with a text block in this list?

The only way I know how to do it is to Add a Section above it, add text to that but then again there is a super weird gap in the website...

Are you using Fluid Engine in 7.1? I have anchor links on my site and ran into the same problem. If you're using FE then you can add a section above it, shrink it down and add the code and it leaves a minimal gap.

Link to comment
On 10/23/2022 at 7:29 AM, aliciainspired said:

The only way I know how to do it is to Add a Section above it, add text to that but then again there is a super weird gap in the website...

Yes, this is what I was suggesting. Generally it's helpful to share your website URL so that you can get the most relevant advise, knowing a bit more about your setup and design, including Squarespace version, really helps. If you're on Fluid Engine, you can very easily make the grid span top to bottom with no extra space, If you're on classic engine, I can give you code to reduce the padding.

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment

I just solved for a member. We tried script code to add id to section.

Here is code for reference

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
  // about
$('[data-section-id="6347865dc6e0f3031847aaa3"]').attr('id','about');
  // collections
  $('[data-section-id="6347a295963cec6e06646a21"]').attr('id','collections');
  // faq
  $('[data-section-id="63576f792a2a3d7110ae0494"]').attr('id','faq');
  // contact
  $('[data-section-id="6347865dc6e0f3031847aaa9"]').attr('id','contact');
});
</script>

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

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

Create an account or sign in to comment

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

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.