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

Leaderboard


Popular Content

Showing content with the highest reputation since 09/12/2020 in all areas

  1. 2 points
    (Updated: SS 7.1) Some custom code (CSS) to change color Navigation Link Navigation Hover Link Navigation Active Link >> 92 Templates Navigation Custom Font Notes Add code to Home > Design > Custom CSS The code is based on demo at squarespace.com/templates, so they may not work for some websites or navigation with dropdown If the code doesn't work, try adding !important to after, eg: color: #f1f2f3 !important; If you have any questions/found issues, just comment below or send me a private message. Thanks. Avenue Template /* Nav item color */ .main-nav ul li a { color: #ff0000 !important; } /* Nav item hover color */ .main-nav ul li a:hover { color: violet !important; } /* Nav item active color */ .main-nav ul li.active-link a { color: green !important; } Aviator /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Bedford Family: Anya, Bedford, Bryant, Hayden, Bedford /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Brine Family: Aria, Basil, Blend, Brine, Burke, Cacao, Clay, Custom Template, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West, Brine. /* Nav item color */ .Header-nav-item { color: #ff0000 !important; } /* Nav item hover color */ .Header-nav-item:hover { color: violet !important; } /* Nav item active color */ .Header-nav-item--active { color: green !important; } Farro: Farro, Haute Same as Brine Five /* Nav item color */ nav#main-navigation ul li a { color: #ff0000 !important; } /* Nav item hover color */ nav#main-navigation ul li a:hover { color: violet !important; } /* Nav item active color */ nav#main-navigation ul li.active-link a { color: green !important; } Flatiron /* Nav item color */ ul#nav li a { color: #ff0000 !important; } /* Nav item hover color */ ul#nav li a:hover { color: violet !important; } /* Nav item active color */ ul#nav li.active-link a { color: green !important; } Forte /* Nav item color */ #topNav ul li a span { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover span { color: violet; } /* Nav item active color */ #topNav ul li.active-link a span { color: green !important; } Ishimoto /* Nav item color */ #topNav #nav li a { color: #ff0000; } /* Nav item hover color */ #topNav #nav li a:hover { color: violet; } /* Nav item active color */ #topNav #nav li.active-link a { color: green !important; } Momentum /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } Montauk: Julia, Kent, Montauk, OM Same as Momentum Native /* Nav item color */ #navBlock ul li a { color: #ff0000 !important; } /* Nav item hover color */ #navBlock ul li a:hover { color: violet !important; } /* Nav item active color */ #navBlock ul li.active-link a { color: green !important; } Pacific: Bryler, Charlotte, Fulton, Horizon, Naomi, Pacific /* Nav item color */ #mainNavigation div a { color: #ff0000 !important; } /* Nav item hover color */ #mainNavigation div a:hover { color: violet !important; } /* Nav item active color */ #mainNavigation div.active a { color: green !important; } Skye: Foundry, Indigo, Ready, Skye, Tudor /* Nav item color */ .nav-blocks-wrapper div a span { color: #ff0000; } /* Nav item hover color */ .nav-blocks-wrapper div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.nav-link--active a { color: green !important; } Tremont: Camino, Carson, Henson, Tremont /* Nav item color */ #mainNavigation div a span { color: #ff0000; } /* Nav item hover color */ #mainNavigation div a:hover span { color: violet; } /* Nav item active color */ #mainNavigation div.active a span { color: green; } Wells /* Nav item color */ div#topNav ul li a { color: #ff0000 !important; } /* Nav item hover color */ div#topNav ul li a:hover { color: violet !important; } /* Nav item active color */ div#topNav ul li.active-link a { color: green !important; } Wexley /* Nav item color */ #topNav ul li a { color: #ff0000; } /* Nav item hover color */ #topNav ul li a:hover { color: violet; } /* Nav item active color */ #topNav ul li.active-link a { color: green; } York: Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori, Taylor, York /* Nav item color */ .site-navigation div a span { color: #ff0000; } /* Nav item hover color */ .site-navigation div a:hover span { color: violet; } /* Nav item active colo */ .site-navigation div.active a span { color: green; } Squarespace 7.1 /* Nav item color */ .header-nav-item a { color: #ff0000 !important; } /* Nav item hover color */ .header-nav-item>a:hover { color: red !important; } .header-nav-folder-item:hover a { color: red !important; } /* Nav item active color */ .header-nav-item--active a { color: green !important; } Created by Tuan Phan. Share to be shared more.
  2. 2 points
    Add to Home > Design > Custom CSS /* Variant dropdown size */ .ProductItem-details .variant-option select option { font-size: 20px; }
  3. 2 points
    Add to Home > Design > Custom CSS span.date { display: none; }
  4. 2 points
    tuanphan

    Carousel Scrolling Announcement Bar

    You can try this code. I tested on my demo site.
  5. 2 points
    Hi Lynne You can add HTML to Markdown Blocks, so instead of using the link button, you can simply add the HTML. For example: <a href="www.squarespace.com" target="_blank">Squarespace</a> Change the url and description to match your needs. Note that this will open a new “browsing context”. This usually means "new tab" instead of "new window", but it will depend on the visitor’s browser settings. You have no influence over that. -Paul
  6. 1 point
    Add to Page Settings > Advanced > Header <style> @media screen and (max-width:767px) { .gallery-fullscreen-slideshow { height: 40vh !important; } } </style> Can you share link to page in screenshot? We can check easier.
  7. 1 point
    The password you've provided for your site isn't correct, but you should be able to change the button colour on your Squarespace 7.1 site by adding the following to Design > Custom CSS: body .checkout button.CheckoutButton-checkoutButton-3yWY2 { background-color: #F4ED3; } If a post helps you, please click a "Like" option below ↘️
  8. 1 point
    Thank you for posting this! When I checked the site, I could only see the option to reply to existing comments. We’ve now enabled the anonymous posting option, so hopefully this lets you post without any issues (even through this doesn’t fix the underlying program).
  9. 1 point
    @jpeter that did the trick! thank you, thank you
  10. 1 point
    lesley.pocklington

    h1 overlay overwrite

    Thank you! Worked like a charm 😄
  11. 1 point
    Okayyyy,this is exactly what I was looking for. Spot on! I wonder how the first CSS code i've put won't work any more... But anyway. I was able to use an image url directly from squarespace host system, so I now have an HD Image on top of this. Neat! Thanks A LOT Creedon for your help!
  12. 1 point
    lincoln

    Selling multiple items as a pack offer

    yep, thought as much. Ah well, for now we're offering free shipping 🙂 Thanks so much for you help Paul - appreciated as always
  13. 1 point
    paul2009

    Stripe or Paypal in South Africa

    I agree the documentation is confusing. PayPal is not supported for payments in ZAR on Squarespace because, although PayPal supports South African accounts, they do not allow you to receive business payments in South African Rand (ZAR). With PayPal, you can be paid in Dollars and then transfer your USD balance into an FNB bank account as Rand at the prevailing rate. I hope that helps to explain. If a post helps you, please click a "Like" option below ↘️
  14. 1 point
    Site URL: http://www.millerbest.com/ Hey guys, I currently have a website made with Avenue template. The home page is an index page, which features a variety of different images that click through to other pages. I currently have the 'show caption on hover' setting, but I'd love to get an animated gif playing/looping when hovering/mouse over. Is this possible? I've searched through the forum and found a few leads, but I'm not sure I understand where to embed the custom CSS and where to upload the gif etc. Thanks!
  15. 1 point
    That's because 7.1 kind of is the master template. The examples you start with are all just various iterations of the same code base - they're not distinct templates - as opposed to 7.0 which featured a number of different ones (which made the template name/family so important). I agree that Squarespace should make this clearer. The template name is now redundant for two reasons. First, 7.1 allows you to achieve the layout and look of all of the starter websites, regardless of which one you start with. Blog layout, colours, fonts, everything. The second is that 7.1 doesn't allow you to switch templates - the master template base makes this an unnecessary feature.
  16. 1 point
    Hi Use this code in Design -> Custom CSS #collection-5f3b10cc86c1c22c839ef543 section:nth-child(n+2) img { border-radius: 50%; } Please use the like button if it helps you! Best, Leopold
  17. 1 point
    Hey, I would mix the code from @WillMyers for tabbed content and then use the accordion in one of those sections: https://www.will-myers.com/articles/how-to-add-tabs-in-squarespace-70-71 https://www.will-myers.com/products/p/accordion-dropdown-plugin-for-squarespace
  18. 1 point
    paul2009

    Selling multiple items as a pack offer

    If you are selling single products and family packs, you can either add them as separate products, where you have one "single mask" product and one "family pack". Each will have colour variant options (and potentially size variants too, such as medium or large). add them as a single products, and add another variant option for pack size. That way you'll have potentially three columns in the product editor, one for colour, one for mask size, and one for pack size (single or family pack. You'll then need one row for each possibility. Does that help? If a post helps you, please click a "Like" option below ↘️
  19. 1 point
    ChrisBartow

    Remove Underline from Links

    Try adding this to your custom css: a { background:none !important; }
  20. 1 point
    tuanphan

    Is my site okay?

    On Footer Mobile, I think "Made by.." should be on the bottom?? Me Page. The url contain "about-1", you can hover on Me in Navigation > click Gear Icon > Edit in Page URL. https://www.steveneveleigh.com/about-1 Contact page. You can insert links for phone, email, so every one can contact you easier. Home page. Under bacp logo on mobile, white space seems big???
  21. 1 point
    creedon

    Gallery block padding

    Got it! Thanks!
  22. 1 point
    Add to Home > Design > Custom CSS /* remove white right */ @media screen and (max-width:640px) { html, body { overflow-x: hidden; } }
  23. 1 point
    Add to Home > Design > Custom CSS /* Header cart icon color */ .header .header-actions-action--cart .icon { color: white; }
  24. 1 point
    Marzon

    Stop line break in title using markdown

    I'll provide links below <h2 style=" display: inline; font-weight: bold; "> Little Peek </h2> <h2 style=" display: inline; "> | </h2> <h2 style=" display: inline; font-size: 17px; line-height: 31px; vertical-align: bottom; color: grey; ">Washington DC </h2> Here was my solution. I also did a version with the paragraph style but the code block to the right was not lining up?? The weirdest part was that it does line up in the editor, just not in the live site (p version)... I did however get it to line up with the example above where I use (h2 version). To reiterate: I was able to get the grey "Washington DC" to line up with the main title. But the text on the right side, "Photography: Artist Name" was only lining up using the (h2 version) and not the (p version). I can live with this solution, but please, if you know something more elegant do tell! Thanks.
  25. 1 point
    tuanphan

    Making gallery blocks mobile friendly

    Add to Home > Design > Custom CSS /* resize mobile gallery */ @media screen and (max-width:767px) { .homepage .gallery-fullscreen-slideshow { height: 30vh !important; } }
  26. 1 point
    thehairshopsalon

    Blank Space in Mobile Menu

    Worked perfectly, thank you so much!!!
  27. 1 point
    christyprice

    Different logo on the home page

    Check your Help menu to see what version of Squarespace you are in. If you are in 7.1, Brine, or Bedford, I have a post that details how to do this. The code varies depending on your version/template: https://christyprice.com/squarespace-tips-tricks/how-to-invert-logo-single-page-squarespace
  28. 1 point
    tuanphan

    Full width logo in header

    Add to Home > Design > Custom CSS .header-title-nav-wrapper { flex: 0 0 100% !important; }
  29. 1 point
    You can also use the Accordion Plugin from sqspthemes. (affiliate link) With this plugin you can use the Text Block for Accordion Content, so you will insert the link with the customization that opens in a new window.
  30. 1 point
    Add to Home > Design > Custom CSS .item-pagination[data-collection-type^="portfolio"] { display: none !important; }
  31. 1 point
    Hi, You need to make the website password protected instead of private. Best, Leopold
  32. 1 point
    aasi

    hiding hamburger

    omg it worked thank you so much!!
  33. 1 point
    Add to Home > Design > Custom CSS /* Align right photo credit */ .staffcopyright { font-size: 10px; text-align: right; }
  34. 1 point
    Sorry! Try this code. In your Code Block <div class="container"> <div class="row"> <div class="col-md-4"> <h1><span class="counter">2,523</span></h1> <h3>Customers</h3> <i class="fa fa-users"></i> </div> <div class="col-md-4"> <h1><span class="counter">63,075</span></h1> <h3>Total Web Pages</h3> <i class="fa fa-desktop"></i> </div> <div class="col-md-4"> <h1><span class="counter">12,218</span></h1> <h3>Cups Of Coffee</h3> <i class="fa fa-coffee"></i> </div> </div> </div> Insert this code in Design -> Custom CSS .col-md-4 { text-align: center; padding-bottom: 50px; border-right: 1px dashed black; } .col-md-4:last-child { border-right: 0px solid black; } .counter { animation-duration: 1s; animation-delay: 0s; } i { font-size: 20px !Important; } @media (max-width: 991px) { .col-md-4 { border-right: 0px dashed black; border-bottom: 1px dashed black; width: 50%; margin: auto auto; } .col-md-4:last-child { border-bottom: 0px dashed black; } } Insert this code in your Footer Code Injection. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { $('.counter').counterUp({ delay: 10, time: 2000 }); $('.counter').addClass('animated fadeInDownBig'); $('h3').addClass('animated fadeIn'); }); </script> Please use the like button if it helps you! Best, Leopold
  35. 1 point
    Do you still need help on this? I will give the code
  36. 1 point
    tuanphan

    Styling author profiles in 7.1

    Add to Home > design > Custom CSS .blog-item-author-profile-wrapper * { text-align: center !important; justify-content: center !important; align-items: center !important; margin-left: auto !important; margin-right: auto !important; } span.author-name { font-weight: bold !important; }
  37. 1 point
    Site URL: https://emsah.world Hi, I’d like to add custom CSS to my site in order to achieve an endless scroll/loop on my home page, where content would begin again seamlessly from the beginning/top of page once you reach the bottom. I’m hoping this works the same in reverse, where you could scroll seamlessly in the opposite direction directly to the bottom of page from the content at top. I would also like to remove the footer once I achieve this loop. Here is an example of what I am trying to achieve: https://codepen.io/vincentorback/pen/zxRyzj I’d really appreciate if anyone can share the solution/code to this! Thanks!! website: emsah.world
  38. 1 point
    Hey all. if you have a gallery block in 7.1, I have managed to make the caption overlay the image quite successfully, whilst having hover effects applied aswell. The easiest way to do this is add HTML text to the caption itself. This allows you to have much more control over the text and font without the need to apply 100 lines of CSS. Images attached are of my new website. You can see the text overlay and on the second image, you can see the hover effect. This was all done using simple CSS. If you want text to appear and rise perhaps on hover, that once again is extremely simple by using simple CSS to place the text below the images & set opacity to 0. Then on image hover, you set opacity to 100 & have a transition timer to ensure it looks seamless with the rise time. If you need CSS help, id be happy to send across. Goodluck and hope this helps.
  39. 1 point
    scimj

    Social Sharing on 7.1

    I'm really super disappointed in Squarespace for not including share buttons. I'm a big fan of Squarespace, but seeing that the platform lacks such a basic need, make me doubtful.
  40. 1 point
    RoseanderMain

    Social Sharing on 7.1

    Wow! Come on Squarespace! I've been a big supporter, but it REALLY sucks to commit to the 7.1 platform and then find out that some of these basics are not supported. Please don't be such a growing disappointment.
  41. 1 point
    I would also love to be able to do this and haven't found anything just yet. I'm not sure why it's not built in, as a customer all you can do is go back to main page of shop? Should be: Shop>Category>Item
  42. 1 point
    bloggerH

    Social Sharing on 7.1

    I did the same this past month because it's utterly ridiculous that it's not included in the 'new' hype version, and was told the same. But someone on mgmt did reach out, though they didn't make any promises. It's a pain in the butt. I was also asking about recipe inserts - you know the easy inserts where people can print the recipe if they want? For blogs this is all fairly basic functionality and options. Not the kind of thing I want to be paying for and not have.
  43. 1 point
    tuanphan

    Blog page image hover with title

    Add to Home > Design > Custom CSS .blog-basic-grid--text { position: absolute; width: 100% !important; z-index: 999; top: 50%; left: 50%; transform: translate(-50%,-50%); text-align: center; opacity: 0; background: transparent !important; } .blog-basic-grid--text * { color: white !important; } .blog-item a:after { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: rgba(0,0,0,0.5); transition: all 0.25s; opacity: 0; } article.blog-item:hover a:after { opacity: 1; } article.blog-item:hover .blog-basic-grid--text { opacity: 1; }
  44. 1 point
    MN12

    Social Sharing on 7.1

    I can't believe you need to use code to create share buttons and also the fact that it's not included in the basic package. Is there a way to submit a request to squarespace for them to change this?? it's 2020, absolutely crazy for this to be considered "extra" and for it to have to be done through code....
  45. 1 point
    Another Up Vote! I'm also learning that it seems impossible to integrate a UPS issued API Key into squarespace to get real-time shipping calculations and billing directly connected to a UPS account? Is this true? Is it true that anything that may change the order summary screen is completely impossible to access? If not, someone please help me - otherwise it seems the only option is to pay for the ShipStation plug-in (which has compliance complications with my business) or pay for the Commerce Advanced Squarespace UPS API, but that does nothing but offer shipping quotes - i still have to process that info manually for each orders shipping processing/label-printing/etc on my UPS account. Anyone have a magic bullet here? @paul2009 maybe? Thanks all
  46. 1 point
    tuanphan

    How to remove the scrollbar

    Ah okay, remove above, and use this <style> /* Hide scrollbar for Chrome, Safari and Opera */ body::-webkit-scrollbar { display: none; } /* Hide scrollbar for IE and Edge */ body { -ms-overflow-style: none; } </style>
  47. 1 point
    dbenthal

    Flatiron gallery page

    @DylanJ Were you able to find a solution to this?
  48. 1 point
    Also, the search feature can only find blog posts... not text blocks in any section. Since my site is not a blog, it means pretty much ALL of my content does NOT show up in search result. Apparently this is a known bug (according to support), and they are "working on it"... and have been since the launch of 7.1 I find it pretty terrible that they broke the search feature in 7.1 and STILL haven't fixed, let alone that they have launched 7.1 with a broken search feature.
  49. 1 point
    Unfortunately, setting a minimum height (as suggested above) doesn't scale. It will only work above at fixed resolutions. See what happens when the code is applied: A better alternative is to use flexbox to create equal-sized containers. Add display: flex to the column container, and then for columns of equal height, add flex:1 to the columns themselves. Be careful about the specificity so that you don't inadvertently affect other elements on the same page. @romerodan to do this on your site, you'll want to put the three columns in their own section of your index page. This will enable you to target just these three columns. When flexbox is used on the page, the columns do this at different resolutions: @erin3 For specific advice for your site, please provide the URL of the page.
  50. 1 point
    Hey thanks for the response! I am very glad that you at least answered me. I may try doing this in developer mode. I do want to say, this is something very simple and Squarespace should make it easy to do. I will see if my client can part ways with their menu style. Either way, thanks for the link and the info.
This leaderboard is set to New York/GMT-04:00
×
×
  • Create New...