Jump to content

JayVanDyke

Circle Member
  • Posts

    364
  • Joined

  • Last visited

Everything posted by JayVanDyke

  1. @daniellenoakes might have to tweak it a but but this should target it. Change your colors and things to match whatever you need! .header-menu { .header-menu-cta .btn { font-size: .9em !important; font-family: 'montserrat' !important; border: none !important; font-weight: 600 !important; letter-spacing: .2em !important; border-bottom: 1px solid #19191e !important; color:#19191e !important &:hover { background-color: transparent; color: #81919f !important; border-bottom: 1px solid #81919f !important } } }
  2. @mrpowerSee this thread, im pretty sure this solves your issue too.
  3. @FGFGFG try using this selector for the mobile one. replace your code with this to target both at the same time. .header-menu-cta, .header-actions-action { .btn { background-color: transparent !important; background-image: url(https://images.squarespace-cdn.com/content/655760ca5ce91354ff938b5a/71a5c7bc-6aac-454f-979c-b857c95f03f1/Discover+CLUB.png); background-size: contain !important; background-position: center; background-repeat: no-repeat !important } }
  4. It looks to me like it's a margin that is blowing up those links and making them so tall. You can try something like this. I just put some numbers in that I eyeballed using the browser but you might have better numbers that will look better. Also if you need adjustments at other screen sizes for the same things, smaller laptop, tablet, etc just copy and paste it again and change the numbers for the new one. @media only screen and (min-width: 641px) { //change to adjust for a different screen width .header-menu { .header-menu-nav-folder { &:before { left: -9vw; //adjust this for left to right spacing for the star } .header-menu-nav-item a { //adjust these for the vertical spacing. margin-top: 1vw; margin-bottom: 1vw; } } }
  5. @jdb99 you can try it without important and increase the specificity by adding a collection id. section id and then block id. You also need to put all that grid stuff inside the quotes with the "~" in front of it like this. Since it's a LESS preprocessor what you see on the front end is not always the way it works on the back end. ~"8 / 12 / 12 / 22" My assumption for your code would be something like this but without having the back end access I can't really test. grid-area: ~"2/4/4/13"; grid-row-start: ~"2"; grid-column-start: ~"4"; grid-row-end: ~"4"; grid-column-end: ~"13"; I'm not entirely sure you need the escape when you're doing the single numbers long handed but in the short hand version you definitely need it. If you want to share a link we can maybe help get you the right selectors to avoid the !important thing. I honestly find that I need that a lot with Squarespace considering all the crazy selectors they have setup in their own CSS.
  6. @MndP I'm not sure I totally follow what you mean but with the code I gave you it should remove the background in the navigation and put the whole slideshow under it in your current setup (or atleast the one you had the other day when I looked). You mentioned already knowing how to do the automated slideshow part but something like this would probably do the trick with what you had before. It also has code to remove the arrows under the additional tweaks area. https://www.will-myers.com/articles/auto-scroll-for-carousel-banner-slideshows-for-auto-layout-sections-in-squarespace-71
  7. @rangeee can you share the link?
  8. @Celeste_Woodside I find that I need to always have a separate browser open with that site in an incognito window because the editor never looks exactly like the live site.
  9. It's working just fine for me. Maybe try incognito or private browser?
  10. @MndPThere may be more to do but this can get you started for transparency. This will make it only happen on this page. Now you should be able to use whatever extra code you're using to advance the slideshow and hide the buttons. #collection-63caac95bc17ef45e7b44b10 { #page #sections .page-section:first-child { padding-top: 0px !important; } [data-header-style="theme"].header, [data-header-style="dynamic"].header { background-color: transparent !important; } }
  11. I don't believe you can do this in squarespace without maybe a 7.0 website that is in developer mode. I still am not entirely sure this is possible though since we don't quite have the same back end server access that another type of site does. Keep in mind though that dev mode adds a whole slew of new potential issues like not getting template updates anymore, extremely minimal SS support on custom code, the issue of handing it off to another dev who doesn't know how or doesn't want to work in dev mode. It's worth checking in with the SS support team maybe to ask or maybe someone else will chime in...
  12. @rangeee CSS tweaks would be like normal under the custom css area in SS. The trickiest part is finding the right selectors, it has been a while but I dont think they are published, I'm pretty sure I just had to inspect the browser to find them.
  13. @rangeee just looked. Basic installation is super simple. Add a code block and drop their code in there. CSS tweaks are obviously going to be different depending on your situation. There's also lots of back end settings to sort of customize the content you see.
  14. @rangeee javascript widget. It also renders everything in raw html so you can make things look the way you want with some CSS. https://www.ponyexpresstalent.com/live-jobs
  15. Yes it can be done with a plugin. The Squarespace accordion won't do this without some JS but there's a few plugins that make accordions out of anything. This one is pretty simple to implement and the support there is great! affiliate link - https://transactions.sendowl.com/stores/9484/193949
  16. change this .header--menu-open .header-menu { opacity: 1; visibility: visible; width: 50%; margin-left: 50%; box-shadow: 5px 5px 15px #000; } to this .header--menu-open .header-menu { opacity: 1; visibility: visible; width: 50%; margin-right: 50%; //this needs to be right for it to sit on the right side. box-shadow: 5px 5px 15px #000; }
  17. @rangeee Yes! I implemented this on a client's site before. I you need help send me a DM but it is usually pretty straightforward to install if I remember correctly (it's been a few years since I did it)
  18. It looks like thats linked to your "products" folder. Something tells me that at some point you had created a folder and didn't rename it right away. Then google indexed your site and grabbed that old name. Maybe resubmitting to Google Search Console would work OR making sure to add some really great schema might help make these results look better.
  19. @SaranyaDesigns I didn't even check, for some reason I just assumed that was the individual block id. That works too!
  20. If you want it for all the images in that section you could do it like this. This way you don't target individual images. section[data-section-id="652cdfe47161a10cf9d95eb2"] .sqs-block-image { img { filter: grayscale(100%); transition: all .3s; } &:hover { img { opacity: .75 !important; } } }
  21. Can you share a link to your client's site? If it's still in trial mode add a site password using this guide https://support.squarespace.com/hc/en-us/articles/205815528-Site-wide-passwords
  22. @rocketbase can you share a link to your page where you have the sale price live?
  23. @WR-Mike do you want every single form block on your site to have that color button? If so you might be able to just remove the #collection part before that .sqs-block-form to make it work on every page. Try that first and if not we can add more selectors to make it more specific.
×
×
  • 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.