katycarlisle

Without knowing the links in question and knowing which page is set as the 404 page I can't help much more I'm afraid! Once you've checked the 404 page, please let me know what it's set to and also share the following: What was the URL that you clicked on Google which took you to the wrong place? What is the URL of the blog post it should have taken you to? What is the URL of the secondary blog page that you set up? Did you change the link of the original blog collection at any point when setting up the new layout?

So do you want some of the card images to still have the space to the left or the right? I'm just trying to understand the scenario when you don't want the image to take up the full width of the block. If you could share links to some example pages, and which images on those pages you do/don't want to target with the CSS, that would be really helpful. If you wanted some CSS to apply to all images on a particular page then you can use the page ID. For example, this would only affect the card layout images on the Clinic page: /* Increase the width of all card images on the Clinic page */ #collection-66baba6ea01101188b98c0e6 .sqs-block-image .design-layout-card:not(.sqs-narrow-width)>:first-child { width: 100%; } If you wanted to just target one image then you could use this code, replacing the relevant block ID as needed: /* Increase the width of a specific image */ #block-yui_3_17_2_1_1724347785082_69523 .design-layout-card:not(.sqs-narrow-width)>:first-child { width: 100%; } If you use Chrome, this is a great tool for identifying block and page IDs to target specific image blocks or pages. A note of caution though! If you have code for a specific block and then you delete the block, even if you add another block in the same place then the code won't work. It's unique to the block. Do also make sure to use comments (in between /* and */ ) to keep track of which ID you are targeting!

Hey! Based on what you've said there, it sounds like using an events collection wouldn't be a great fit for you if you don't have workshops at a specific date/time. You can sell products on the Business plan, you just get charged an additional 3% transaction fee. If you did sell them as products then you can also add a custom form that pops up when they add the product to their cart, so you can use this to gather extra information about their availability to kickstart the conversation (there is also a date picker form field in case that's useful). If you wanted to use the products functionality but not take payments online then you could hide the add to cart button and instead just include your email or link to a contact page. How you hide the button will depend on which version of Squarespace you're using so let me know if you want more help with this. You may not even need to use products; you could just use pages or even blog collections to tell people about the workshops. If you're using Squarespace 7.1 then auto layout sections (also known as list sections) are a great way of displaying information in a nice grid. Using Squarespace's blog or products functionality would allow you to have categories and/or tags, and use summary blocks to display the workshops on other pages too. I don't know if it would be appropriate for you but if you wanted to automate your booking process a bit more then Acuity Scheduling (or similar tools) might be worth looking into. Sorry if this has given you even more to think about 🙈 Feel free to share a link to your website and a bit more about the business and the workshops!

There's more detail in the post below (along with some potential workarounds) but essentially how the arrows display is set by the browser, so it's trickier to customise with code. In addition to the arrow buttons, customers can type their desired quantity into the box. On desktop, they can also click into the quantity box and use the up and down arrows on their keyboards to increase/decrease the quantity.

Have you tried refreshing the page? Recently there has been a bit of weirdness with drop downs, so it's possible that the pages didn't quite "stick" when you moved them into the drop down (even though it looks like they are there) and they might be in your Not Linked pages instead. If that's the case, you can just move them back in to the drop down and hopefully they should work! If that isn't the problem you're having, or refreshing the page doesn't make a difference, then please can you share a link to the site, along with any password if needed? Here's how to set a site-wide password if your site isn't published yet.

There is, but setting the image to 100% width in Site Styles should have the same effect. The CSS would just be overriding that same number in the code! I'll share for reference in case you want to be more specific and just target certain images, but I would recommend going with Site Styles over CSS where you can. This is the code for 100% width but you might want to reduce the number down slightly because of the offset border effect that you're using. /* Increase width of image on card layout */ .sqs-block-image .design-layout-card:not(.sqs-narrow-width)>:first-child { width: 100%; }

Do you by any chance have your general blog posts page set as the 404 page? You can check this under Website > Pages then scroll to the bottom and click System Pages > 404 Page. If so, it sounds like Google found that blog post at some point but since then the URL for that post has changed and it's actually sending you to the 404 page on your website, it just isn't obvious that's what is happening because it's redirecting to your general blog posts. To fix this and avoid this issue in the future, you can set up URL Mappings on Squarespace which tell your site to redirect from the old broken link to the correct blog post or page. You can find this under Settings > Developer Tools > URL Mappings. So for example if the broken URL on Google was yoursite.com/blog/my-lovely-bog-post and you'd since fixed the typo and changed it to yoursite.com/blog/my-lovely-blog-post, then in the URL Mappings box you would write: /blog/my-lovely-bog-post -> /blog/my-lovely-blog-post 301 You don't need to include the "yoursite.com" part. The 301 part is just saying this is a permanent redirection. If you need any extra help with this, please share the link from Google that was broken, and the link it should have gone to!

You can add this code to Design > Custom CSS: /* Reduce margin under images on gallery block */ .sqs-gallery-block-grid .sqs-gallery-design-grid-slide .margin-wrapper { margin-bottom: 0 !important; } Adjust the value for margin-bottom as needed.

One possible reason for it zooming in is because the text and the button are forcing the height of the section to increase. When that happens, in order to keep the background image covering the whole section, it has to zoom in, otherwise there would be a gap above or below the image. You can try turning off "Fill Screen" in the section settings; this essentially removes the padding at the top and bottom of the section and gives you a bit more room to play with. It might also be worth trying to remove the background image and add it as an image block instead, as you'll have more control over the size and positioning, especially on mobile. You can still set an overlay colour on the image to give enough contrast to the text. If you need any additional help with this, please share the URL for the page, and the password if there is one.

By default when you use the card layout (even when there's no title and subtitle) it will still leave space for the card and text to the left or right of the image. On most of the images on that page, that's what is happening. However, there comes a point when if the width of the block is too narrow to show the image and card next to each other, it will push the card underneath the image so it's stacked instead. On the first image you've got the text block extended past the centre of the page, so that's forcing the card onto a new line. Of course, you can't see this is happening because there's no text content! But if you increase the width of the text blocks for the other images, you will see the image take up the full width of the remaining space. You could also add a spacer to get the same effect. Alternatively, you can increase the image width for card layouts to 100% in Design > Site Styles (it looks like it only goes up to 75% but you can type in 100% and override the limit). By the way, the Clinic page name and URL has a typo in and is actually "Cinic" and /cinic. I was able to find the right page it using the site search but you probably want to update it.

Hey @ErinHardyDesign I'll reply here as I did have another thought about the original question from @ruthandshelby too. So you could actually have the code applied to the whole page on every page by effectively hiding the section background (and borders) completely to allow the background to show through. The code for that is here: body { background-image: url('https://images.squarespace-cdn.com/content/v1/62e136bb36a33d59fa7bb016/e1c04da5-637f-4a4c-a620-b0af60bbdc32/Asset+1.png?format=750w'); background-size: 200px; background-repeat: repeat; } .page-section .section-border { display: none; } You can change the background size as needed. You will also need to edit the image so it doesn't get cut off when it repeats. If you want the background to apply as a background to just the sections, use this code: #page .section-background { background-image: url('https://images.squarespace-cdn.com/content/v1/62e136bb36a33d59fa7bb016/e1c04da5-637f-4a4c-a620-b0af60bbdc32/Asset+1.png?format=750w'); background-size: 200px; background-repeat: repeat; } This isn't currently available but Squarespace do regularly release new features so it may be an option in the future. As a workaround for now, you can use the colour themes to be more specific with which sections to target in the code. You probably don't need to use all 10 themes so you can choose one (or several) that will use the background image repeat. For example, you could have Lightest 1 be a regular section background and Lightest 2 reserved for the repeating background, in which case you can use this code: [data-section-theme="white-bold"] .section-background { background-image: url('https://images.squarespace-cdn.com/content/v1/62e136bb36a33d59fa7bb016/e1c04da5-637f-4a4c-a620-b0af60bbdc32/Asset+1.png?format=750w'); background-size: 200px; background-repeat: repeat; } I've put the colour codes for each section as a reference at the bottom of this post. Don't worry about this 👆 I was just trying to explain that the section backgrounds would cover up the background if it was targeting body {} and that was why it wasn't working originally. Colour themes for code reference: Lightest 1 [data-section-theme="white"] Lightest 2 [data-section-theme="white-bold"] Light 1 [data-section-theme="light"] Light 2 [data-section-theme="light-bold"] Bright 1 [data-section-theme="bright-inverse"] Bright 2 [data-section-theme="bright"] Dark 1 [data-section-theme="dark"] Dark 2 [data-section-theme="dark-bold"] Darkest 1 [data-section-theme="black"] Darkest 2 [data-section-theme="black-bold"]

Just spotted that you're also in BC! I'm on Vancouver Island, hello from across the water 👋

Thanks for sharing the link and I agree that is confusing! So on the first section of the home page it looks like you've set an inset image as the background for that section. If you add it as an image block within a section that doesn't have a background image instead, then it should show through. You will probably also have to set the background to Full Bleed (which is somewhat hidden under Background > Video section editor). Note that if you want the pattern to be continuous and match up perfectly then you'll need to have all the content in the same section. Now I can see your site and the image you're using, I'd suggest changing background-size from contain to a specific value, for example 200px. That will stop it from getting too pixellated and ensure it repeats enough. You might also want to add an additional line of CSS to increase the opacity of the image so the text above it is readable enough. For example: opacity: 0.2;

It's always helpful if you can provide the link to the website, along with a password if the site isn't public so people can try to troubleshoot more effectively. However as a starting point I can see a couple of reasons why your code probably isn't working. I'll assume you're using version 7.1 of Squarespace. Firstly, you have background-size set to cover which will override the repeat. Cover tells the code to make the image expand to fill the entire space available so there won't be any space left to repeat! Changing cover to contain will allow it to repeat. However, even with that you will still not see the image unless you create a new page and don't add a section. And I'm guessing you don't want a totally blank page! If you switch body to .section-background then you should see the repeat. Bear in mind that the footer sections are separate so you the repeat will re-start in the footer. If you don't want that to happen, either hide the footer or you can change it to #page .section-background at the start to stop the code from applying to the footer sections.

You should be able to put the CSS in the Page Settings under Advanced > Header Code Injection. Just remember to put the CSS in between <style> </style> tags. However, Squarespace should now automatically display the TikTok icon (I know it didn't originally) so it might be worth removing and re-adding to see if that solves the problem. I added your account onto a cover page and it worked for me.