Jump to content

Search the Community

Showing results for tags 'button'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • Welcome to the Forum
    • Customize with code
    • Commerce
    • Feedback on Your Site
    • Images & Videos
    • Pages & Content
    • SEO
    • Products
    • 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


  • Events Calendar

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. Hello. I am wondering if someone can provide the css code to add a second button to my navigation. I would like to have an existing page "Client Portal" - be accessible only through a button instead of a link in the navigation. If possible, this button would be next to the Donate button in the current navigation. Any assistance would be much appreciated! https://hibiscus-dachshund-wk7b.squarespace.com/config/ pw: forumhelp1 Thank you in advance!
  2. Hi there, I used this code from another discussion to get a back to top button. I am wondering what code I can use so it appears on every page, not just one. Thank you! this is what I have from the other discussion: Simply paste the code in Setting > Advanced > Header <div id="scroll-here"></div> <a id="back-to-top" href="#scroll-here"> <img src="data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' aria-labelledby='title' aria-describedby='desc' role='img' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3EAngle Up%3C/title%3E%3Cdesc%3EA line styled icon from Orion Icon Library.%3C/desc%3E%3Cpath data-name='layer1' fill='none' stroke='%23202020' stroke-miterlimit='10' stroke-width='2' d='M20 40l11.994-14L44 40' stroke-linejoin='round' stroke-linecap='round'%3E%3C/path%3E%3C/svg%3E" alt="Angle Up" /> </a> <script src="https://code.jquery.com/jquery-3.6.0.js"></script> <script> $(function(){ //Function To Add Class function showBackToTop(){ $('#back-to-top').addClass('show-btt'); } //Function To Add Class function hideBackToTop(){ $('#back-to-top').removeClass('show-btt'); } //Check Scroll and Add Class function checkScrollPos(){ if ($(this).scrollTop() >= 700) { //if scroll position is lower than 700px from the top of the screen showBackToTop(); } else { hideBackToTop() } } // tell the browser to run the "checkScrollPos()" function just above when the user scrolls $(window).on('scroll', function(){ checkScrollPos(); }); //Check the scroll position once when the page loads checkScrollPos(); }) </script> <style> html { scroll-behavior:smooth } #back-to-top { height: 50px; width: 50px; position: fixed; right: 0; z-index: 99; border-radius: 50%; box-shadow: 0px 0px 5px #ccc; margin: 17px; background: white; bottom: -150px; opacity: 0; transition: all .5s ease; } /Position Out of View/ bottom:-150px; opacity:0; transition: all .5s ease; } #back-to-top.show-btt { bottom: 0; opacity: 1; transition: all .5s ease; } </style> for you have to hide your current code <style> .t-top { display:none !important; } </style> Add this also in same header block
  3. Hi! I would love to add a button with 'back to all work' in between my portfolio pagination (see screenshot). The only way people can come back to my homepage now (which is also the start of my portfolio page) is to click my logo in the header or footer, or click 'werk' in the navigation. I tested my website on some people and they really miss a clearer option. I found some codes online offered by @tuanphan, but unfortunately they don't do anything for me. The codes are the two added underneath. Can someone maybe help me with this? Thank you in advance! password: Illusterre2022 https://illusterre-sample.squarespace.com #19. Add Button to Pagination <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function() { $('<a href="/portfolio" class="item-pagination-link item-pagination-link--prev portfolio-backto"><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"><div class="visually-hidden">Back to Work</div><div class="item-pagination-prev-next">- BACK TO WORK</div><h2 class="item-pagination-title">BACK TO WORK</h2></span></a>').insertBefore('a.item-pagination-link.item-pagination-link--next'); }); </script> <style> /* Portfolio back to button */ a.portfolio-backto .item-pagination-title { background-color: black; color: white !important; padding: 10px; } </style> and #20. Add “Back to all projects” under pagination <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> jQuery(document).ready(function($) { $('<section id="back-to"><div class="sqs-block-button button-block Index-page-content"><div class="sqs-block-button-container--center"><a href="/portfolio" class="sqs-block-button-element--small sqs-block-button-element sqs-button-element--primary">Back to all project</a></div></div></section>').insertAfter('.item-pagination[data-collection-type^="portfolio"]'); }); </script>
  4. Hi everyone, I'm realising that buttons' width are dependent on Fluid's Engine grid, which means I can't truly control their width and left and right padding. If I do add left and right padding via CSS or Site Styles, then the text goes over two lines in some cases, which doesn't look good, and if I make the button larger editing the block with Fluid Engine, then it's too large because I'm stuck with the grid's dimensions (i.e. ~70px on each side instead of the desired 40px). Is there any way to work around this? Thanks!
  5. Even though the padding on all of my buttons are set to the same values, I'm noticing the sections that I've converted to fluid aren't reflecting my settings. Any ideas?
  6. Hi, In Analytics there you can see "Traffic Sources" and you can see "Form & Button Conversions" I would like to be able to tie these together so you can see which traffic sources led to which form and button conversions. Is there a way to do this? Thanks!
  7. Blessings upon everyone who reads this message. I encounter some trouble removing a button on the page. When I use "Edit Section -> Background -> Art", an extra button appears on the page. It's the button to Play / Stop animations. Is there any way to remove this? I managed to find it using 'Inspect Element', but I am not able to remove/ hide it. Could you please help a friend?
  8. Site URL: https://star-pufferfish-4sy4.squarespace.com/config/pages Hi, I would like to know how to redirect my "Add to cart" button on my products page to my Etsy shop? I dont have a commerce plan so I don't want to have a cart. My website is not published yet but here is the url www.shopsimpul.com Thank you very much for your help!
  9. Hello, I'm looking to change the function of the "add to cart" button in the Squarespace product template so it links to the Etsy product listing page url instead. I want the benefits of the Squarespace product page organization and design but want the button to link to Etsy for the transaction and avoid the Squarespace cart altogether. Ideally, I'd like the button to read "purchase" rather than "add to cart" if possible, too. FYI, the product will not have any size variations/options so there will only be the "add to cart" button on the Squarespace product page. Thanks in advance
  10. Site URL: http://www.thenajinproject.squarespace.com Hi, I'm needing help adding these behaviours to the "back to top" button on my site: For it's background to be a white circle For it to only appear after the user has scrolled down I would also be so grateful if you can help me understand why the code block that sits in my footer for this button is so large in height on mobile. And help me reduce it so that the footer on mobile isn't huge. Site password: Fatu
  11. Hello everyone! I want to be on my page link:https://www.x2create.com/work-1/project-one-ephnc-9znnb-3mfgd-yjzwj-ycszw Once you enter, you will see the blue button "more Project" Add a link to go to the next project How should I set Thank you for your help!
  12. Hi there, I am trying to reduce the top and bottom padding white space in this form button and this is the smallest I've been able to get it. But it's just refusing to go any lower than it is, even with smaller px as you can see in the Custom CSS box. I've attached the Inspect if this is any help. Could someone tell me why it's not removing the white space and how to code it so that it removes the space? Thank you to whoever can help with this!
  13. HELP....I NEED HELP with my site. I tried to change my landing page to include a 'Shop Now' button. Once I finally got the button on the landing page, I opened the page with my individual products and noticed the 'Add to Cart' button has changed. It is now very tall (see pic below). Prior to changing the landing page my 'Add to Cart' button looked like the pic below [with the pink dress]. Also, I inserted custom code to get the button as it was. Why did the button change? How to do I get my button back to it's original size?
  14. I have used an events section and customized the card styles, I am hoping to change one of those red primary buttons to a secondary button which is in a different color and less prominent. I don't see a section to change button styles for these cards, if I was to change the theme, it will change all buttons to secondary or tertiary which is not what I am looking for.
  15. Hi, I have problem with buttons. On dekstop (image 1) they are nicely after text block but in mobile there's too much space after text block (image 2). How can I move buttons on mobile so they are nicely after text block (image 3).
  16. Hi could anyone advise me why the submit buttons do not show when in the Lightbox mode on the forms? (see attached) I've tried different colours but still no luck. Many Thanks
  17. Hey! How can I add a pop up with text to my download button? I want users to be able to download files from my site, but they need to know the legal terms that come with downloading that file. Cheers
  18. Is it possible to make certain navigation items in the top menu appear as buttons instead of regular text links? I'm not talking about the "button" option for the last menu entry in the header. I want to make other menu entries appear as buttons.
  19. Hi Everyone, I'm trying to add a secondary "View Cart" button underneath my "Add to Cart" button on each of my product pages. I've followed the tutorial listed here, and it has worked great in adding the secondary button where needed, however, once you back out of one product and into another on mobile, the button becomes invisible. If you click the area where the button is supposed to be, it will in fact take you to the Cart, but you can't actually see the button. The problem seems to be unique to mobile. In Squarespace's mobile preview the button is fine on each product but when testing the site on my actual mobile phone, it disappears as described. Any ideas? Site password: hibean The problem is in the "Prints" area
  20. Am looking for a way to make a single button to access multiple page. each of the page have its own different category. I want o create a button or page to access those different categories in a single page if possible. Thanks for the response
  21. Hi! I did a website for a beauty house/saloon (kauneushoitola in Finnish). Website is https://www.emisbeauty.fi/ and first time I am using Squarespace. I was wondering if people have any feedback or suggestions to make my website a little better (SEO, content, anything). Thank you! There's some problems in mobile version with button paddings in front page and here with accordion tabs: https://www.emisbeauty.fi/kestopigmentointi I am trying still solve those.
  22. Site URL: https://bird-bobcat-b7c3.squarespace.com/butik/p/kopper Is it possible to add a custom button to a product page like shown on the screen shot? PW: PRC Because it is a product page, I can't add a block or add specific custom code for the page. It's a request from the client so I hope it somehow is possible. The button is suppose to be a scroll down button.
  23. On Android phone, the Contact Button doesn't show up properly. It's half covered by the business info. Do you know if it's possible to move it up? because in edit you can't modify the button position.
  24. Curious how to add a secondary button on a product page. Here is an example: https://www.bigcatcreative.com/templates/gigirose-squarespace-template#!/~/ Thanks!
  • 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.