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

Search the Community

Showing results for tags 'button'.

  • 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://www.azulstudio.co.uk/ Site URL: https://www.azulstudio.co.uk/ Hello! my website is https://www.azulstudio.co.uk/ I need help with my slideshow gallery section (the WORK section) so the button becomes a sort of frame around the project image (see screenshot). Also, I would like the title to be placed on top of the image, and the description below (while remaining inside the frame). This way it will feel like you are clicking on the image but instead you are clicking on the button. If this is not possible, could the image have a link to its specific project (page)? thanks for the help!
  2. I have a button issue I have not been able to solve. On the home page there is a blue button called subscribe today. It functions like I want it to. Stays a solid color (blue) and the only change on hover is it outlines the box in white. The buttons on the pages (stock market dashboard & cryptocurrency dashboard) have a wiper effect in the section called "charts of Interest" at the bottom of the page that shows the button all in white when one hovers. How do I get these to act like the home page? I moved the links to the header for easy access. Website: www.MidnightInvestor.com Password: 123456$
  3. Once you add the second Button via the Code you have provided how can you get it to link to an internal part of your page, I understand how to change the code to reflect to different URL's but i can't get it work so that it links to somewhere already on my page. My existing button is done via the following <div ID="example"></div> and my button link then is - #example and this takes me to a different section of my page. Any help is much appreciated, thank you.
  4. Site URL: https://www.prsnlhb.com/ Hi everyone, Does anyone know how customise / increase the weight size for buttons? Thank you!
  5. Site URL: https://www.pinteafilmcompany.com/portfolio/sukh-dhaliwal Trying to make the font size smaller, specifically on the mobile version of the portfolio page if possible. As you can see, the text on the bottom collides, doesn't look too pretty. Totally fine on desktop though.
  6. Site URL: https://www.sequoialongevity.com/test Hi everyone. I'm new to coding. I'm trying to customize an embedded form/script. The app I'm using has a Wordpress Plugin but it doesn't look like I can use it on Squarespace. I was checking out this post on Squarespace help pages https://forum.squarespace.com/topic/26778-how-do-i-change-styling-for-only-one-button/ And I can't seem to change the color on the button This is the code I inserted in that section: <script src='https://www.uplaunch.com/api/v1/scripts/fetch_new_lead_form.js' data-form-url='https://marqihealth.uplaunch.com/new_lead_form_embed/11377'></script> And what I'd like to do is change the color of the button from blue to black. This is what I tried in Design -> Custom CSS: Attempt 1: #page-section-6333be4cfb6650597753609a div#block-yui_3_17_2_1_1664645077280_507 a { background: black; } Attempt 2: #page-section-6333be4cfb6650597753609a div#col-12 a { background: black; } I really appreciate your help!
  7. Site URL: https://www.pinteafilmcompany.com Hoping to add a popup "lightbox" video on the "WATCH OUR REEL" button on the home page! Would love to do this without the use of third party plugins... but if it's necessary, let me know what you suggest. Similar to this: https://www.noravera.com/ Mike
  8. I have the below css code for a button. When the button is hovered it will outline the button in white. When I move the mouse off of hover, I get a bit of blue at the bottom of the button. How do I remove the blue at the bottom of the button? /* add to cart button */.sqs-add-to-cart-button:before { background-color: #000000 !important;}.sqs-add-to-cart-button:hover:before { border-color: #ffffff !important; background-color: #000000 !important; }.sqs-add-to-cart-button:hover .sqs-add-to-cart-button-inner { color: #ffffff; }
  9. Site URL: https://www.worldisonfire.com/services Hello, I just noticed the "Add to Cart" button is missing from two of my 3 products, but I can't figure out why they disappeared. Does anyone happen to know how I might fix this? Here is the one product page where the button appears normally and is working properly: https://www.worldisonfire.com/services/resonant-you-private-lessons And here are two product pages where the add to cart button is missing: https://www.worldisonfire.com/services/resonant-you-biofield-tuning https://www.worldisonfire.com/services/resonant-you-bemer-circulation-enhancement Everything appears to be the same to me in my layout and settings with all products. Does someone know how to fix this issue of missing add to cart buttons? Thank you in advance. -Julius
  10. Site URL: https://malenyvedicvillage.squarespace.com/ Hi community! I am wanting a gradient secondary navigation button to be featured only on pages with no background images. The below code works great for all pages, as in it changes the home page button as well. I don't want this to happen, I would like it to remain white, while the rest are gradient. pw : Maharishi Thanks for any help 🙂 .Header-nav--secondary .Header-nav-item { background: linear-gradient(to right, #e4bc60, #b7812d) !important; }
  11. Site URL: https://freedomofmovement.squarespace.com/ Hi, I used the following code (see attached screenshot) for a hover effect for my newsletter buttons. So far it has worked but now I noticed that the hover effect does not work anymore - no idea why. Can someone help me? I am looking forward to your help! Password: fom2022
  12. Hello, Need assistance finishing out the below hover button code. I would like for the button to stay 100% black when it's not being hovered and 100% black when it is being hovered. The only hover effect is for a white border to go around the perimeter. Text of the button should be white. /* add to cart button color */ .sqs-product-quick-view-content .sqs-add-to-cart-button {background-color: #000000!important}
  13. Site URL: http://laurabustaffa.com I've customised the appearance of items in my mobile menu. The aim was to have all items appear at the top of the screen rather than in the middle and the button after them rather than at the bottom of the screen. Like this: But on iPhone safari the button disappears: I've botched this code digging through past responses: /*move nav items to the top on mobile*/ [data-folder] .header-menu-nav-folder-content { justify-content: flex-start; } /*move button up on mobile nav*/ header#header .header-menu-cta { position: relative; top: -600px; } Maybe -600px is too much? I guess a measure relative to the menu items rather than absolute might be better? but I'm not a developer... 🙂 Thanks!
  14. Site URL: https://mozerisfineantiques.com Hello, Below is screenshot of product page on mobile. I would like to move the add to cart button where "live chat" and "send an enquiry" buttons are, just below them. Add to cart button and price is currently being displayed below store reviews, this is mobile only issue. Thank you.
  15. Site URL: https://www.wearefixology.co.uk/ Hello Forum, I'm using a form block with the lightbox/button option - I would also like it to have the same design as my Primary Buttons. Which has a teal (#45A29A) outline and goes yellow (#FDDB27) on hover...? I've made a page as an example - so the REGISTER INTEREST button is a form - top right is my BOOK button that has the yellow hover..... My website: https://www.wearefixology.co.uk/form-with-button-examples Password: ruth Any ideas forum pals?
  16. Site URL: https://cat-wedge-xh9c.squarespace.com/programs I'm trying to create a list of the programs and services that we offer at the Community Center where I work. We're a small non-profit which is why I am doing 20 jobs and learning them as I go. I want two buttons to appear inside each accordion drop-down. One that says "Learn More" and one that says "Volunteer". I've figured out how to get the button in there. I've even figured out how to make it look decent, but it is changing EVERY link/button on my page when I do that and making them all look crazy. Here is the code I was using. I don't even remember where I found it. (The button won't link to google, obv, I just haven't gotten very far yet.) The password to the website is: bft2020 <style> a:link, a:visited { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block;} </style> <a href="https://google.com" target="_blank">Volunteer</a>
  17. Site URL: https://www.mikesmithlive.com/store Hey all, I'm a custom CSS newbie and am having issues with moving my "Add to Cart" button so that it's displayed below the price on a particular product page: https://www.mikesmithlive.com/store/storyteller-e-course (PW: Test-32). I have separately implemented some custom CSS on two other product pages to stylize and redirect their checkout buttons to an external third party vendor, and was successfully able to move those checkout buttons below the price; see https://www.mikesmithlive.com/store/lvl-bulk and https://www.mikesmithlive.com/store/lvl-single, respectively (same PW). I'm getting the sense that some of my CSS may be canceling out the rest, but am unable to gauge that with any certainty. I'm including all of my custom CSS below to see if anyone here could help me determine that, and/or if there's some additional CSS I need to include to move the checkout button on the first product page (which is #item-62fec0203c643a6de7dbe707). /* CUSTOM CSS TO HIDE PRODUCT DESCRIPTIONS FROM ALL PRODUCT PAGE HEADERS */ #item-62eb0216b0a87f42c025ec0d .title-desc-inner .page-desc { display: none; } #item-62eaffad989f1737e1b2f343 .title-desc-inner .page-desc { display: none; } #item-62fec0203c643a6de7dbe707 .title-desc-inner .page-desc { display: none; } /* CUSTOM CSS TO HIDE OR STYLE ADD TO CART BUTTON ON SELECT PRODUCT PAGES */ #item-62eb0216b0a87f42c025ec0d .sqs-add-to-cart-button { display: none !important; } #item-62eaffad989f1737e1b2f343 .sqs-add-to-cart-button { display: none !important; } #item-62fec0203c643a6de7dbe707 .sqs-add-to-cart-button { text-decoration: none; border-radius: .4rem; -webkit-transition: .1s opacity linear; -moz-transition: .1s opacity linear; -o-transition: .1s opacity linear; transition: .1s opacity linear; -webkit-backface-visibility: hidden; color: #fff; background-color: #000; border-color: #000; display: inline-block; width: auto; height: auto; border-width: 0; text-align: center; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; line-height: 1em; font-weight: bold; font-style: normal; text-transform: none; line-height: 1.2em; letter-spacing: .05em; -webkit-font-smoothing: antialiased; font-size: 1rem; line-height: normal; padding: 1.2em 2.004em; width: 250px; } /* CUSTOM CSS TO HIDE PRODUCT QUANTITY FIELD AND SHOW PRODUCT DETAILS BELOW PRICE ON ALL PRODUCT PAGES */ #productDetails .product-price { order: 1 !important; } #productDetails .product-quantity-input { display: none !important; order: 2 !important; } #productDetails .sqs-add-to-cart-button { order: 3 !important; } #productDetails .product-excerpt { order: 4 !important; display: block !important; } /* CUSTOM CSS TO SHOW "BUY FROM JOSTENS RENAISSANCE" BUTTON ON SELECT PRODUCT PAGES */ #productDetails .product-excerpt a[href*=jostens] { text-decoration: none; border-radius: .4rem; -webkit-transition: .1s opacity linear; -moz-transition: .1s opacity linear; -o-transition: .1s opacity linear; transition: .1s opacity linear; -webkit-backface-visibility: hidden; color: #fff; background-color: #000; border-color: #000; display: inline-block; width: auto; height: auto; border-width: 0; text-align: center; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; line-height: 1em; font-weight: bold; font-style: normal; text-transform: none; line-height: 1.2em; letter-spacing: .05em; -webkit-font-smoothing: antialiased; font-size: 1rem; line-height: normal; padding: 1.2em 2.004em; width: 250px; } Any help or guidance anyone could give me here would be greatly appreciated! Thanks in advance.
  18. Site URL: https://www.azulstudio.co.uk/ Hello! my website is https://www.azulstudio.co.uk/ I would like to add some custom CSS to my slideshow gallery section (the WORK section). Since the only way to link the images to specific pages (each image corresponds to a different project), is by adding a button; I was wondering if there is a way to customize the button, in order to make it look like a frame around the image (see screenshot). The title and subtitle would be inside the button as well. thanks for the help!
  19. Site URL: https://www.wearefixology.co.uk/classes-and-talks Hey there, Site: https://www.wearefixology.co.uk/classes-and-talks Password: ruth My form block 'REGISTER INTEREST' is relevant to most pages on my site - but I don't want to have to rebuild the form every time...is there a way or some CSS to save it so it can be re-used across the site?
  20. Site URL: https://www.therockleypub.com.au/ I'm really struggling to adjust two buttons that are next to each other once the screen hits between 1828 - 1126p (it is fine for desktop and mobile) . One button text changes positioning and then the two buttons overlap. This has been an issue since using the fluid engine. Thank you
  21. Site URL: https://www.ellesentials.com/shop/p/cloud-cashmere-lashes-sfjfk Hi there, I'm looking for some assistance with my website. I'm looking to change variant down menu into buttons so it's easier to see and select. I'd like it to be like the photo attached with the "button"/circle around the selected option. I'm not exactly sure how to do it. Thank you!
  22. Site URL: https://mandolin-banjo-jxep.squarespace.com/ I have several spots on my website where we are featuring small groups of events sorted by category, but I want to give them the option to skip the 'Event Detail' page, and directly register for the event (an external URL). Does anyone know if this can be done? I made a couple of quick mock-ups to show my intention. Thanks in advance!!!
  23. Site URL: https://www.megankeely.com/ I'm using the Bandintown integration (in a block) to feed by upcoming shows straight from Bandsintown to my Squarespace website. It works great, but for some reason the ticket button is tiny. I believe it is a 'Primary Button' because I change the primary button font and the ticket button instantly changed. I understand the button size is determined by the font size, but I can't figure out how to update the font size (for this block or all buttons) to make this button larger. Any help is greatly appreciated. Thanks!
  24. Site URL: https://shuifeng.squarespace.com My button text is word wrapping to the next line and I need it to stop (figure #1) - I need all the text on the same line (figure #2). This was not an issue in 7.1 without the Fluid Engine; when I created a button all the text would just elongate the button (figure#2) In Fluid Engine the button text is word wrapping/stacking. How can I get them to not word wrap for all buttons, sitewide? The only solution I've found so far is the below code, but I'd have to do it with every single button with extended text. The padding would vary depending on the length of the text (which is less than ideal). Thanks. div#block-yui_3_17_2_1_1663950227242_11793 a { padding-right: 4em !important; white-space: nowrap; }
  25. Site URL: https://cliftoncreativeevents.com I have multiple shop pages but I don't want anyone to be able to purchase anything directly. So I hid the add to cart button and want to add a contact button which links to the form page. But is there a way to have that button pop up on all product pages without having to individually add it in?
  • Create New...