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

Search the Community

Showing results for tags 'anchor'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
    • Resources
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. Site URL: https://cargofilm-staging.squarespace.com/films I have added an anchor on the film pages of this site https://cargofilm-staging.squarespace.com/films (password: cargo). It works perfectly in Chrome but does not work in Safari. Any suggestions? Thank you!
  2. Hello, I have spent a good amount of time digging through multiple threads/forums regarding anchor links in 7.1 sites and wanted to summarize what I have working, and what issues I am seeing. (I apologize as I am unable to share my site yet as it is not public, and also for the giant info dump, but I thought it may help others to see it all consolidated, as I am combing multiple problems) My setup: Currently I am using code inject blocks to create div tags for header site navigation anchor links. Example: <div id="about" class="anchor-offset-about"></div> Header nav links are written as follows: /home#about The class is so I can create a manual offset for both desktop and mobile jumps to display in the exact spot I want. Example: //desktop// .anchor-offset-about { position: relative; top:0px; } //mobile// @media(max-width:767px) { .anchor-offset-about { position: relative; top:100px; } } Smoothing scrolling is enabled via: html { --scroll-behavior: smooth; scroll-behavior: smooth; } Smooth scrolling on Safari specifically is enabled via: (site-wide header injection) <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script src="https://unpkg.com/smoothscroll-polyfill/dist/smoothscroll.min.js"></script> <script src="https://unpkg.com/smoothscroll-anchor-polyfill"></script> -- This setup IS WORKING correctly. HOWEVER, I am running into some weird glitches across different viewing formats. 1. Chrome - Everything is working properly. Aside from the random anchor link not landing exactly correctly (very rare) this all works. 2. Safari -Upon landing on the home page for the first time, every anchor link appears to force a page refresh and jump to the anchor point without smooth scrolling. After this completes, anchor links will work properly and smooth scroll between them. I am still looking for a solution to this. There are the two options I have tried without success. 1. Force the home page to load at #top. This is not a viable solution, however, as it will work on the very first page load/visit. But if I visit another page on my site that is not the home page, and try to return to one of my anchor links from the header navigation it will force a page load to the top again and not jump to the correct location. 2. Purchased squareaddons.com Anchor Links product. This will solve the problem on desktop, however, I am unable to set class specific adjustments, so anchor link jumps do not land correctly on mobile. I have submitted a ticket to them to ask about this. 3. Mobile (Safari and Chrome on iOS - both iPhone and iPad) -Similar to above, page refresh occurs on first click of any header nav link after landing on home page. Scrolling will work after this. The main other problem on mobile only is that my site header, which is both fixed and using the "dynamic" setting in Squarespace 7.1 is not loading properly when using any anchor link for the first time. It jumps to the right location, but is transparent, showing content underneath where it should be a solid color (white in my case). If I start scrolling or click the anchor link again it will display properly, but makes for a very messy first-time viewing experience. And advice or solutions to these issues would be greatly appreciated. Thank you!
  3. I have found numerous tutorials on how to add anchor point navigation to buttons and text, but nothing that explains how (or if) you can add jumping to an anchor point to the Main Navigation links in the header. In other words, I want to be on the Home page, click on "About" in the main navigation in my header, and have the page scroll to that section of the Home page. However, the main navigation appears to be able to only go to new pages instead of staying on the current page and scrolling to an anchor point. I don't see a way of adding a url or any code to the main nav at the top of my site. Is there any way of doing this? Thanks.
  4. Hello, I have links to pages in my header. Is it possible to make those links go to sections of the homepage rather than linking to entirely different pages? I just want one page with links to scroll down to different sections. Is that possible? Thanks, Matthew
  5. Site URL: https://www.jarnanaturbruksgymnasium.se/#oppet-hus-inbjudan Hello, If you first check this site: https://www.jarnanaturbruksgymnasium.se/#oppet-hus-inbjudan When you go to this url then there is an old text appearing.I want to delete the old text but I can't find this old text when I edit?! https://www.jarnanaturbruksgymnasium.se/oppet-hus-inbjudan Anybody who can help me? Thanks I advance, Ronald
  6. Site URL: https://www.beautifeyehtx.com Does anyone know if you're able to create an anchor link to a specific tab within a menu block? I have 4 tabs under a service menu using the menu block and it'd be great to link to the specific tabs. TIA!
  7. Site URL: https://berkshireic-cms.squarespace.com I'm trying to add anchor links to my site, but am running into issues with the link landing below the corresponding anchor due to sticky navigation. I'm in Brine, 7.0 and, while I know this particular feature is possible via other methods in 7.1, that is not a possibility here. Can anyone help with this? Thank you! You can see an example on this page: https://berkshireic-cms.squarespace.com/clients-services-fees password: BIC2021 Pinned sticky header using Tuanphan's code from a previous post: .Header.Header--top { position: sticky; position: -webkit-sticky; top: 0px; z-index: 1000; width: 100%; } Tried this solution offered in previous post by a Wordpress user. Some folks had success with this, but it does not work for me: :target:before {content:"";display:block;height:120px; /* fixed header height*/margin:-120px 0 0; /* negative fixed header height */ }
  8. Site URL: http://ribetmyles.co.uk Hi there Wondering if anyone knows of a way I can create custom navigation items on an individual page of my site. Essentially my client is running a google ads campaign and has asked me to create new page with out any external links. They want the existing navigation (that currently links to different pages) to become anchor links, that link to specific parts of the webpage. (What we do, Meet us etc) which I can implement no problem through the link function. However when I do this, it then duplicates across the navigation of the whole site, which is not the desired outcome as I'd like the others to remain as page links. Any help here would be greatly appreciated! Thanks Rhys
  9. Hey all! I'm totally new to squarespace and I'm trying to set up a fairly simple photography website and wanted to have everything on one scrolling page. I have the index page all set up but I can't figure out how to get the navigation bar to link to sections of the index page. For example, I can only get a link to the "About" page to show up in the navigation bar if it's a separate page. If I move the About page to a section in the index page it disappears from the navigation bar. Is there a way to get sections of the index page to show up in the navigation bar, so I can set it up to scroll down to the About section by clicking it in the bar? Thanks in advance for the help!
  10. Site URL: https://nextcitylawyer.com/free-resources/the-truth-about-virtual-vacation-schemes Good afternoon I have added anchor links to the blog posts on my website in order to make it easier for visitors to navigate long blog posts. The anchor link functionality works well, but the code block includes a substantial amount of top and bottom padding which breaks up the page. It's more than the equivalent with a conventional h3 header. <p id="attitude"><h3> 1. Attitude </h3></p> This is an example of the code that I have used on the linked page. Is there a way to reduce the vertical padding between the blocks of the text? Thanks for your help in advance. I regard anchor links as a core feature of any blogging platform so it would be very useful to get some guidance on this issue.
  11. Site URL: https://www.ditbaderum.dk/ Hi all, I have added anchors from my main navigation to 4 different sections on my frontpage. It works perfectly, except that when clicking the anchor link, it scrolls too far so that it lands on the middle of the section instead of the top. Is this possible to fix? Best regards, Kasper
  12. Site URL: https://plasticarcade.com Hello so I setup my page to use mostly one page design with links in header to navigate to anchor links on the main page. Problem is when I goto my blog section for instance the links don't work anymore... so if I fix it by using full links like this; https://plascticarcade.com/#about instead of just "#about", it works on external pages but it breaks the links and scrolling effect on the home page. Is there a way to fix this? thanks and any help is appreciated
  13. Site URL: https://www.ditbaderum.dk/ Hi guys, So I created 4 anchor links in my header navigation. I want the nav link that is "active" to get an icon under. So when you scroll to the anchor point or click the nav links it gets an active icon. Is this possible? Password to site is Kris123
  14. Site URL: https://www.pozeband.com/boutique/p/t-shirt-noir-unisexe-grand-logo-smlxl Hi, I have set anchor links in my header which can glide down to sections of my home page with code blocks. When I'm on another page, like a product page (which is the site URL I have linked), if I click on my anchor links in my header, which just contain, for example "#biographie" or "#contact", it just stays on the product page because it's not mentionning my website's name, like so: "pozeband.com/#biographie" So, I have added my full website URL + the anchor to my header links, such as "pozeband.com/#biographie" and "pozeband.com/#contact". My issue is that, now, when I'm on my home page and that I click on my header links, it reloads the full page before gliding down to the anchors. Is it possible to have my header anchor links be "#biographie", "#contact" when I'm on my home page AND have my header anchor links be "pozeband.com/#biographie", "pozeband.com/#contact" on all other pages? (or any another way to make it work as intended) Thanks! EDIT: #biographie and #contact in my examples are anchors which are on my homepage
  15. Is there a way to create an anchor link to a List section template? I don't see a way to add any code to the a List. Attached is a photo of the selected template. Thanks!
  16. Site URL: https://www.thebeautyparlournashville.com/ Hi, I am trying to anchor link all the headers in the navigation but I am only making one page for this website and I cannot figure out how to anchor link from the navigation. I created "links" for the navigation bar and made code at the link (portfolio) to link to our work - just trying one as an example using a code snipper and then #our-work on the URL for that header link but its not working. @tuanphan Any ideas? Pw: TBP2021
  17. Hey! I was wondering if it would be possible to link the gallery and text(or button) through anchor tags. For example in a blog post there's text "image 1" and when the user clicks on that text(the text has an anchor link) it will take them to that specific image in the gallery, in this case the first image. I've been tinkering around with anchors, but i can't seem to find a way to have the anchor go to a specific image in the gallery(i'm using the slideshow design). If someone knows a solution or a plugin for this i'd greatly appreciate the info! Couldn't find anything on this myself, there are some closed forum posts with no answers from a couple years ago, but that's about it.
  18. Site URL: http://laidug.com I am a novice editing a site created by someone else. If you click on a meeting on this page http://www.laidug.com/allevents it takes you to another page with details on the meetings. Each year is a different page with anchors to the meetings held that year. I added the October 2021 and November 2021 meetings. I copied the coding from September and changed to Oct and Nov respectively. The November link works but the October one does not. I read that I'm suppose to use div rather than p, but I tried that and it still didn't work. Besides she used p and it works. What am I doing wrong?
  19. Site URL: https://pte.squarespace.com/about Hello, I have three buttons on the top of my About page that need to transport the user to three different Squarespace ID Sections of the page: "Team; Process; Pricing" I am using code blocks to achieve this, so I can implement an arrow icon into the button links. I managed to get the Process & Pricing anchors to work, but for some reason "Team" won't work. I think this is because there is an issue with jumping to the Squarespace section preset "List," which is what I am using. I came across the same issue on the "Careers" Page, (https://pte.squarespace.com/careers) where I got "Open Positions" to work, but "Benefits" wouldn't work because it is a template Squarespace list. I tried other methods of linking to anchors, but it still wouldn't work for these sections. Please please help.
  20. Site URL: https://alanschmuckler.squarespace.com/ site URL: alanschmuckler.squarespace.com password: kidding Hello, I have multiple anchor links throughout the site that are all working well. However, one on the homepage jumps too far only on mobile. The link is "currently working on" in the "I'm glad you're here" section on the homepage. It's supposed to jump to the title "In the works", and does it well on desktop but goes really far down on mobile. Any ideas on why and how to fix it? Thanks!
  21. Site URL: https://www.aestheticlounge.ca Hi 👋 I'm having an issue with anchor links on the homepage of my site aestheticlounge.ca. There are three images with anchor links to different sections on the /services page. The "lasers and lights" link as well as the "medical facials" links are not anchoring to the correct place on the page where I've added the code block for anchor links. Upon my investigation it appears that the markdown blocks are interfering with the anchor link code. Problem can be seen here: https://www.loom.com/share/8a0967e781764349bb259a1066c4ec73 Has anyone run into this issue before or know how I can fix it? Your help is very very much appreciated 🙂 Thank you!
  22. I am trying to insert an anchor link that brings you to a specific section of a new page. I've inserted code boxes with #id's at the top of each section that I would like to jump down to. And have directed the buttons to each of those coded section that indicate page and #id. I've used the below code: (the code is at the top of each unique "schedule" section) /// code block - id for jump link // <div id=“unique-name”></div> I also tried using <p id=“unique-name”></p> neither work /// Button address /// /pagename#unique-name It links back to the correct page, however, it does not jump down to the correct section. Can anyone take a look and let me know what I'm doing wrong? url:https://contrabass-round-d5yj.squarespace.com/agenda pass:wethepeoplesbefore
  23. Site URL: https://edu.ifixit.com/fast-fix-project-faq#two I added anchor links to my accordion menu using the markdown block and some CSS and jQuery, but I would like the question to expand automatically when the anchor links are used. The rest of the page functions just how I would like—users that end up on the page organically can toggle through each question—but when I send a specific anchor link to a user, I'd like the question to automatically expand. I'd ideally like to find a way to do this that also doesn't mess with the spacing or the hover color. I'm using Squarespace 7.0 with the Bedford template.
  24. I'd like to add a sticky sidebar with anchor link navigation to one of the pages on my site, exactly like the "Navigate This Post" sidebar on this site: https://thirtyeightvisuals.com/blog/free-squarespace-plugins-meet-ghost#mgfsp-anchor-08 What's the best way to go about adding this?
  25. Anchor links or page jumps are a vital component to any website, but specifically important for those websites that are text-heavy or have a lot of content on a single page. In essence, an anchor link is a special URL that takes you to a specific place on a page. They’re useful for letting your visitors skip to the parts of your content that interest them, and they’re a great organizational device that aids readability. As an added bonus, they help with SEO too. In Squarespace, there are two types of anchor links you can use, depending on the version of our platform you’re using. For example, if your site is on the Squarespace 7.0 platform, you can create anchor links on Index Pages using the steps in the guide Adding index page anchor links. If your site is on the 7.1 version, you can add a small custom code snippet and create an anchor link on Layout Pages. Check out our guide Creating anchor links. Before stuffing your Main Navigation with anchor links, there are some considerations you need to take into account. For example, too many items in your navigation can be aesthetically overwhelming and become a hindrance to readers. Links that are too close together can be a problem on mobile, specifically for visitors with limited hand mobility. How do you use anchor links on your website? Do you have any special practices or tricks? Let us know in the comments below!
  • Create New...