Jump to content

Wolfsilon

Circle Member
 View Profile  See their activity

  • Posts

    410

  • Joined

  • Last visited

  • Days Won

    1

 Content Type 

Everything posted by Wolfsilon

  1. Wolfsilon
    I think if you move it the point up and over in the direction you want, you can get slightly more precise increments.
  2. Wolfsilon
    For the bottom section you could try using this code in your Custom CSS tab: section[data-section-id="616f1efca9f40869aa59365a"] { min-height: clamp(0px, 56.25vw, 100vh) !important; }
  3. Wolfsilon
    Are you trying to add a background image to just one section? Adding an image using the Advanced > Code Injection isn't normally how you do this unless you have direct control on the "#outerWrapper". Meaning, the outerWrapper doesn't exist without your code. But, in my experience, I believe it's built in. I'd consider just using Custom CSS and applying the background through that menu only. If you're saying that the code above is currently in your Custom CSS menu, you're likely running into the Syntax error because you cannot have "<style>" tags in this menu and you might just need to remove both of them and leave the innermost CSS.
  4. Wolfsilon
    So, theoretically. This can be done because Squarespace's form system has the built-in option to return a redirect URL "on-success." Meaning that once a form has been submitted it is processed through the handler scripts and you could potentially add new arguments. However, there's not a whole lot of details on locating where these exact scripts are stored on the template assets and there's no guarantee that it would work even if they could be tracked down. I guess it would take more man power to allow users to submit the form and reply to those who didn't make the cut with the link shared above but that might be the best option, otherwise maybe removing the "Less than $10,000" option entirely.
  5. Wolfsilon
    Could you share full code for the selector you're trying to edit the background for? Not the entire CSS but just the first - opening "{" - and closing "}" It would help to have context rather than looking at the url of the photo in question.
  6. Wolfsilon
    This was fun to code and I hope that this helps you. You'll need a business plan or higher to use the Javascript. Start by inserting the code into your Custom CSS: Home > Design > Custom CSS .megan-R { font-family: "YOU_FONT_HERE"; color: dodgerblue; /* for display purposes to see it's working */ } Insert the following script into your footer code injection: Home > Settings > Advanced > Code Injection/Footer: <script> const meganR = document.querySelectorAll("h1, h2, h3, h4, h5, h6"); for (const heading of meganR) { heading.innerHTML = heading.innerHTML .replace(/R/g, '<span class="megan-R">R</span>'); } </script> Save and you should see your pages update to your new font and in the color blue, though, you can change this to whatever you like. Best, Dan
  7. Wolfsilon
    Yes, you'll need to add the accordion to all products individually because each accordion is its' own block with a different set of properties and... I'd assume, would have a different description for each product. As for your initial request, because the accordion is not in the same section as "add to cart" section, moving it upwards and nestled between the two items is not possible using custom CSS and you should add the accordion to the section above first.
  8. Wolfsilon
    Hello! 😄 I'd start with the following code and then adjust accordingly. #collection-61575f739b5e216704ea6c84 .page-section:first-child { padding: 0 !important; } /* This is kinda to deal with the white header text blending in with the lighter themed images but might not work for all pages .header:not(.shrink):not(.transparent-header-theme--override) { background: linear-gradient(black 0%, rgba(0,0,0,0.3) 85%, transparent 100%) !important; } */ Hope that this helps you solve the issue for your first page only. Best, Dan
  9. Wolfsilon
    Could you please share the URL to the page with the code in question so that we may see the context of how it is functioning.
  10. Wolfsilon
    Of course! I'm glad that we could at least troubleshoot what is causing the issue.
  11. Wolfsilon
    Hello, You can add the horizontal scroll bar by removing the overflow property on the inner container and with the code that you already have on the Block-ID. Now you should see the horizontal scroll bar. #block-yui_3_17_2_1_1635200644389_9550{ .sqs-gallery-design-carousel .sqs-gallery-container { overflow: visible !important; } }
  12. Wolfsilon
    Hi, This is usually a problem with embeds/iframes when your site has AJAX loading enabled. In 7.0 templates normally have AJAX enabled by default and can be switched off in the "Site Styles" menu for most templates. If this solves your problem, you can leave it disabled. If you're still encountering issues, or do not have the option to disable AJAX loading for your template. You'll want to reach out to Hubspot and ask if they can help you find a solution that deals with Squarespaces AJAX loading conflicting with rendering/displaying of the forms. If they can provide no solution, you'll want to try and find someone who is familiar with Squarespace & Javascript and have them help you create a customized code solution for your website. Someone here will likely know something about triggering loading so report back if you need additional help. Best, Dan
  13. Wolfsilon
    Hello, How strange, I'm not sure if this is a new issue or has always been the case when using the same "grid:simple" or template grids on the website for different portfolio pages. I would bring it to the attention of a support representative if you feel so compelled. To make matters more strange, Squarespace's grid system is finicky and will reject standard grid CSS. Here's the code I use, just target the section that you want to have 2 columns. Be careful setting any other dimensions like spacing after inserting the code or remember to disable it when editing and adjust accordingly. [data-section-id="YOUR_SECTION_ID_HERE_"] { @media only screen and (min-width:640px){ .portfolio-grid-basic{ display: grid !important; grid-template-columns: repeat(2,minmax(~"250px, 1fr")) !important; } } }
  14. Wolfsilon
    Could be a couple of things, to use embeds and custom scripts you’ll need to have a Squarespace business plan or higher. Otherwise, it’s possible the code isn’t formatted correctly. You can try to generate the code for the feed again on: publish by Twitter
  15. Wolfsilon
    <a class="twitter-timeline" data-width="500" data-height="800" data-dnt="true" data-theme="dark" href="https://twitter.com/IMAC2?ref_src=twsrc%5Etfw">Tweets by IMAC2</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> Use the Codeblock and paste the code into the codeblock. Substitute the "href" URL for the twitter feed you'd like to display. You can also adjust the dimensions and theme as well.
  16. Wolfsilon
    #HeaderNav nav .subnav { background-color: #_YOUR_COLOR_; } I think you should be able to change the background of the folder drop-down with the code above.
  17. Wolfsilon
    To change your site’s availability: In the Home menu, click Settings. Click Site Availability. Select Public, Password Protected, or Private. Click Save.
  18. Wolfsilon
    Since all "li" elements in the accordion are siblings of the parent element- "ul" - and do not have separate classes, you'll want to use the :nth-child selector for each "li" that you want to have a logo. The next item would be "... li:nth-child(2)" and so forth. ul li:nth-child(1)::before { background: black; *(can be color,image,url)* } A more specific targeting would be to identify the block-ID of the accordion so that you do not change all of the lists on your website: #block-yui_3_17_2_1_1634667846525_4563 { ul li:nth-child(1)::before { background: black; } ul li:nth-child(2)::before { background: cyan; } ul li:nth-child(3)::before { background: dodgerblue; } ul li:nth-child(4)::before { background: violet; } } Also, when I was attempting to find this accordion on your website, I noticed that some of the pages are not working properly on smaller screen sizes. I've attached a screenshot below. Best, Dan
  19. Wolfsilon
    I can confirm that the english version of the website is working for me as well. "Contact" does not seem to be switching languages.
  20. Wolfsilon
    Could you please set your site visibility to password protected and share the URL along with the password so that we can view your website? It is much too difficult to shoot CSS codes out blindly 🙂
  21. Wolfsilon
    You have an extra colon at the end of your code above: .header-nav-folder-content a:nth-child(3) { color: red !important; } You could also get more specific with your targeting: .header-nav-folder-content .header-nav-folder-item:nth-child(3) /* a:nth-child(3) */ { color: red !important; } I've added the slashy's just in case you need to use a combination.
  22. Wolfsilon
    Yeah. In your Custom CSS tab.
  23. Wolfsilon
    You'll have several options to achieve the effect you want: 1) Use Custom CSS + Javascript to build your own slideshow 2) Purchase a slideshow plugin - SQSMODS, Will Myers, and Ghost Plugins is where I'd start to look, the latter two used to have free plugins but I'm not sure anymore. 3) Edit existing tools to meet your needs - you could use any of the auto-section banner/slideshow sections and have them auto scroll.
  24. Wolfsilon
    I'm so confused.
  25. Wolfsilon
    Hi, I think you could target test 3 by using the third child selector - "a" of ".header-nav-folder-content". Although, without a link to view your website I can't provide a very accurate answer. Best, Dan
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources