Jump to content

Ziggy

Circle Member
  • Posts

    8,139
  • Joined

  • Last visited

  • Days Won

    92

Everything posted by Ziggy

  1. You do need an # in front of the collection ID: #collection-662e5a98796ba234a49abd1c header.Header {background-image: url(https://kelseyautumn.com/wp-content/uploads/2024/06/WebShadows-scaled-e1719414045399.jpg)!important; background-size: cover; background-position: center center; background-repeat: no-repeat; }
  2. That website uses this template: https://camino-demo.squarespace.com/face-camino Try this Custom CSS, and make the footer on your website height set to "L" footer#footer-sections { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 0; } main#page { margin-bottom: 100vh; }
  3. Can you share your website URL? The question mark shouldn't matter, but you should be able to remove it from the link.
  4. You are looking for what is regularly referred to as "tabs". Here's one way to do it: https://www.will-myers.com/products/p/tabs-plugin-for-squarespace
  5. The easiest way to achieve this would be to hide the title and add the text as a pseudo-element like this in CSS: // hide title #block-yui_3_17_2_1_1719304445731_94358 .summary-heading { display:none; } // add text #block-yui_3_17_2_1_1719304445731_94358 .summary-title:before { content: 'FEATURED WORK — '; font-family: 'Aktiv Grotesk'; font-weight: 600; letter-spacing: .05em; }
  6. A simple setup like this is easy enough to get working, just anchor links, but some manual work for 250 words! https://www.perfectit.com/partners The alternative could be a tabbed setup like this: https://www.will-myers.com/products/p/tabs-plugin-for-squarespace If you wanted a more complex arrangement, then a blog page with a page for each term and the Universal Filter plugin to search, probably with Categories for letters would be interesting.
  7. Can you try setting the line spacing to 0px rather than 0.0rem?
  8. Try this Custom CSS: // List card border radius .user-items-list-carousel .list-item[data-is-card-enabled="true"] { border-radius: 20px; }
  9. Is this the code you're trying to use? https://www.sparkplugin.com/blog/add-a-mega-menu-in-squarespace Alternatively try this: https://www.will-myers.com/articles/building-a-mega-menu-in-squarespace-71-free
  10. Can you share your website URL and maybe a few screenshots to demonstrate the issue you are having?
  11. Square could be tricky with the embed, you can adjust this value to get closer to square, but because of the width generally needs to be a percentage value to adapt the screen it's going to be hard to match them up. Incidentally using 100% or another percentage won't work with the height! You could use 400px and 400px but you might have to play around with the block positions to look good.
  12. This code is your problem, why do you have it? @media only screen and (min-width: 769px) and (max-width: 4440px) { .fluid-engine .sqs-block-image .design-layout-fluid * { position: relative !important; width: 75% !important; } }
  13. Can you share your website URL? Are you using a template? Do you have any custom coding? how big are the images you are uploading?
  14. So you want the soundcloud embeds to be square?
  15. This is CSS not javascript, it would need to go in Custom CSS.
  16. If I understand correctly, add this to Custom CSS: .list-item-content__title { font-family:obviously-wide; }
  17. Yes, you could do that in CSS with these properties on :hover
  18. A few steps; first combine this text into a single text block: Pin this block with this button, and set the offset to 60px: Remove the background image from the section and add this code: section[data-section-id="66401df29cb8660c4f9af59c"] { .section-background{ &::after { /*creating the element*/ content: ""; width:100%; height:100%; position: absolute; /*adding the image*/ background-image:url('https://images.squarespace-cdn.com/content/v1/564557c3e4b0c87513050114/1601421132965-VGA8O3U4MAXR0TRBFDJU/Guests+%40+Gallery+Back+Room.jpg'); background-repeat:no-repeat; /*positioning the image*/ background-size:cover; background-position:center center; background-attachment: fixed; /*mobile*/ @media(max-width:787px){ background-position:center center; background-attachment: scroll !important; } } } } This code was developed by Will Myers, you can see his website and instructions that go along with it here: https://www.will-myers.com/adding-parallax-effect-to-a-background-image-in-squarespace-71
  19. No, not without a secondary service that can do something with the raw form data. (I can't think of a service to do this). You can link a form to Google Sheets and possibly pull the data from there? What are you hoping to achieve when receiving a PDF of the form submission? You could print/download the email as a PDF but I'm not sure that solves the problem you are trying to solve.
  20. Very happy to have solved this conundrum for you! Now I just need to solve it for everyone else! Setting a maximum column gap of (100vw - (2*--site-margin)) / 24 would do it.
  21. That's actually caused by narrow columns in your footer and a long single word for the email address:
  22. I've been trying to get this issue resolved for some time! If you can mark my post as the solution and give it a like that might help a little!
  23. This is a major problem with Squarespace's grid editor. When you set the column gap to the maximum 50px is breaks the view on smaller screens. This is because you have 26 columns with a 50px spacing, meaning that the content will always be 1300px and on a screen of 800px you can see why you have an overflow of 500px. The maximum I recommend for this value is 29px (768/26) (the minimum desktop screen size divided by the number of columns) In the real world, 24px for the column gap is a good safe maximum as this allows for the 25th and 26th columns which are determined by the page margin.
×
×
  • 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.