SaranyaDesigns

@Ziggy ah nevermind, it was caching the redirect to the config url, just tried incognito and its working, thanks! Good to know.

@Ziggy Hmmm I tried that but it still says I have no permissions, so won't let me see the site at all.

That's the link to your personal editor dashboard, we won't be able to see that. You need to share the link when you're previewing the live page. Something like https://pumpkin-ferret-d9d7.squarespace.com/testimonials - or whatever the page title is is usually the slug after the primary domain?

That's the editing page from within your dashboard, we won't be able to see it. I think for us to see the page, you need to publish it but keep it out of nav menu (unlinked) and just send us a direct link?

Can you share a direct link to the page, even if it's not linked to the navigation yet? Are you trying to get it to look like the first two images with the turquoise background?

@mhp try adding !important to the display: flex property, it looks like it's not overriding the grid. Once the flex property is working, you will want the padding: @media (max-width:767px) { .fe-653f0146fdf76728df80846c { display: flex !important; flex-wrap: wrap; gap: 25px; padding: 25px; } } let me know?

@Roseline can you provide a link to your website so we can have a closer look at the styling code?

Sure, you can just play around with the font size and padding in the code I sent, for example, try: div#productDetails .sqs-add-to-cart-button-inner, body:not(.button-style-default).button-corner-style-square .sqs-editable-button { font-size: 16px; } .collection-type-products .sqs-add-to-cart-button { padding: 12px 25px; } You can adjust the px of the font size until you find one you like, and then adjust the padding the same way, I suggest using px for padding instead of em like the current template, as em is dependent on font size, where as px will be static/consistent no matter the font size.

@2Eyeballs Looks like it's just part of the e-commerce template, but you can try adding this to custom CSS to override and match your other button styles: div#productDetails .sqs-add-to-cart-button-inner, body:not(.button-style-default).button-corner-style-square .sqs-editable-button { font-size: 12px; } .collection-type-products .sqs-add-to-cart-button { padding: 1em 2.5em; } You may want to click around and see if any other button targets need to be added...?

@FramedView looks like there is a min-height and an excessive amount of padding built into the template here: .page-section.section-height--medium:not(.content-collection):not(.gallery-section):not(.user-items-list-section) { min-height: 66vh; } .page-section.vertical-alignment--middle:not(.content-collection):not(.gallery-section):not(.user-items-list-section):not(.editmode-changing-rowcount).section-height--medium>.content-wrapper { padding-top: 6.6vmax; padding-bottom: 6.6vmax; } So you need to override that for mobile, something like this: @media (max-width:799px) { .page-section.section-height--medium:not(.content-collection):not(.gallery-section):not(.user-items-list-section) { min-height: 0; } .page-section.vertical-alignment--middle:not(.content-collection):not(.gallery-section):not(.user-items-list-section):not(.editmode-changing-rowcount).section-height--medium>.content-wrapper { padding-top: 25px; padding-bottom: 25px; } } You may want to browse around your site to ensure this override doesn't inadvertently affect other areas, as the targeting is very wide, just FYI. If it does and you don't want it to, you may need to get more specific with your selectors or add IDs to the divs you specifically want to target. Hope this helps!

Try changing to flex instead of grid for mobile? @media (max-width:767px) { .fe-653f0146fdf76728df80846c { display: flex; flex-wrap: wrap; gap: 25px; padding: 25px; } }

You should use flexbox instead of float, can you please provide link to your website? Then we can provide more specific code 🙂 thanks!

Try adding this to custom CSS: .header-actions .language-picker { order: 1; } .header-actions .user-accounts-link { order: 2; } .header-actions .showOnDesktop { order: 3; } You should check the order in mobile is still the way you want it after you apply this as well, otherwise you may want to add @media (min-width) parameters as well.

Gosh, this template really doesn't give you much to work with in terms of targeting the right selector... Try this in your custom CSS: .header-nav .header-nav-folder-item:first-of-type { display: none; } Note, if you add new menu items or change the order at all, you may have to adjust the targeting to be more specific, for example: .header-nav .header-nav-item:nth-of-type(3) .header-nav-folder-item:first-of-type { display: none; } Which is targeting the desktop nav (not mobile) then the third menu item, then the first dropdown item. Hope this helps!