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


Circle Member
  • Posts

  • Joined

  • Last visited

Everything posted by Wolfsilon

  1. Try: section[data-section-id="60ac2acc4bc21d6a986068b1"]{ min-height: clamp(0px, 56.25vw, 100vh) !important; } or section[data-section-id="60ac2acc4bc21d6a986068b1"] { .page-section { min-height: clamp(0px, 56.25vw, 100vh) !important; } }
  2. Hello, Try this: section[data-section-id="60ac2acc4bc21d6a986068b1"] { min-height: clamp(0px, 56.25vw, 100vh); } Hope this helps! -Dan
  3. Hello, I couldn't see where the button is supposed to be, is it on the home page? I don't see a payment plan section either. Also, this message commonly shows when you have installed it incorrectly or do not have custom javascript enabled on your website. Be sure that you have a Business plan with Squarespace. Custom scripts are only supported in Business or higher plans. If you have a Business plan.... How are you installing the code? Are you using a code block? Sometimes these scripts require that you add portions of it via Settings > Advanced > Code Injection > Header/Footer injection menus. To me, this looks like it could go in the Header Code Injection field. Let us know! Thanks, -Dan
  4. Hello, If you have already downloaded and uploaded the font then you can use the following code to apply the font to the header navigation. @font-face { font-family: "Helvetica-Bold"; src: url(YOUR_FONT_URL_HERE); } .header .header-nav a { font-family: "Helvetica-Bold" !important; } Hope this helps, -Dan
  5. We'll need to take more complex steps because I misunderstood your problem. Start by removing the first half of the code I sent. You still need to independently set the header to be transparent. Worry about the buttons and text later. Using the method below for each page you want a header background to be applied to. Navigate to pages > settings (gear icon) > advanced > Page Header Code Injection. <style> .header{background:"YOUR_COLOR_HERE" !important;} </style> This should update the background color of the header on a specific page. You'll want to tweak the text and button CSS in the Custom CSS menu for each page or add these CSS changes before the closing "</style>" tags.
  6. Hello, I'm sorry to hear about your issue, If I remember correctly, Constant Contact was effected by the SolarWinds hacking attack that took place earlier this year. Apparently (according to your post), still taking place, which is crazy to me. Your site or CC account was most likely accessed because of a leak stemming from Constant Contact. That seems to be the known common denominator here. If your sites server was accessed and not your actual Squarespace account, there's not much you can do and the damage is done, whatever that may be. I would recommend changing your password and enabling two factor verification for your SS account. You should use a trusted authorization app to generate your passkeys. If you have clients hosted or signed up on your site, or use your website, you should notify them. A general rule of thumb for the future -- The more lines of code and injections from third party sources, the higher the risk of being attacked. You didn't do anything wrong here though, as this wasn't in your control. Embedding content is usually safe, unless the source of the embedded app is compromised. In this case, you also should've been notified by Constant Contact about the scope of the attack, when it happened, and what you should do. If not directly notified, there are usually briefs that are made available to users. Hope this helps, and good luck, -Dan
  7. Hello, Try: .header-menu-nav-item a { font-family: "YOUR-FONT-HERE"; } Hope this helps! -Dan
  8. Hello, I'm assuming that you've enabled the transparent header option. This is an easy but unreliable way to do this because it will adjust the header/navigation colors to inherit the primary background color of the section immediately following it. This means that it will switch colors depending on the page you are on, which isn't a consistent way to have a transparent header. The work around that worked for me is to change the header to a color scheme and switching OFF the transparent header option. You can then apply some Custom CSS to the header to change it. If you have a button to the right of the social links, it will require further styling but I've tried to cover everything in the examples you shared. .header-title-text a, .header-nav-item a, .header-actions .icon--fill svg, .header-actions a{ background: transparent !important; fill: #fff !important; color: #fff !important; } .header { background: rgba(0,0,0,0.0) !important; } Hope this helps! -Dan
  9. Hello, In order to best help you or provide an accurate code, please share the URL to your public website or if your site isn't live yet, enable a password under your websites visibility menu and share both. Thanks, -Dan
  10. Hello, Several issues with your font importing may be causing this problem. 1) You need to make sure that the @font-face - "font family" names match on the elements you're trying to apply the font to. (I see variations of Agrandir Grand Heavy vs. Agrandir-GRANDHEAVY vs. agrandir). 2) ".header-nav *" & "p" selectors, use a font family that isn't installed on your website or installed correctly. 3) On the following lines -- You do not need to use "src:local". In-fact, if that works for you, you may be the only one able to view it because it's calling for a locally stored item on your computer. 4) Once you've made the changes or uploaded a font to your website you can check if the fonts are installed correctly by "inspecting" the text and viewing the "Fonts Used" tab within the inspection window. For me, you're defaulting to "Poppins" and "Times New Roman" fonts. 5) A minor issue that might not effect anything at the moment would be having extra comma following "h1,h2,h3,h4..." Hope this helps. Let me know if you have any more questions. -Dan
  11. Unfortunately, this issue would probably be best resolved through Flodesk support. The equivalent of "have you tried turning it off and back on again" would be; you could try removing all of the original newsletter code that you installed and adding it back to your website. It's also possible Flodesk updated their code, so maybe try replacing the old code with newly generated code from their website. -Dan
  12. This is the code I use to make my header dropdown menus transparent. .header .header-nav .header-nav-item--folder .header-nav-folder-content { background: rgba(0,0,0,0.5); } Hope this helps! -Dan
  13. .sqs-block-image .design-layout-poster .image-card { display:flex; background: rgba(0,0,0,0.5); align-items: center; justify-content: center; min-height: 250px; } Hello, Try the following code and let me know if this works and is the right aesthetic. You can adjust the transparency using different values for the background color. You may need to insert the data ID or collection ID if you don't want to target all of the other poster blocks outside of that page. Hope this helps! -Dan
  14. There are certainly ways to do this, but not without some customized code/Javascript. You can also use a plugin like this one to create a timer and redirect function. Just install it on the page the viewer is redirected to after they signup for your newsletter and set the timer to redirect back to whatever page you want. The issue you'll have with a solution like this, especially if it's a monetary tool for you, is that there isn't really anything stopping a viewer from returning to the page after the timer has expired. You would need to automatically scramble the URLs or create an access token that expires per user/per session. This type of system isn't really possible on Squarespace, if it is. It would need to be done by a professional developer. Realistically though, I don't think someone would really take advantage of that workaround but it's just a thought perhaps something to consider in the future. Hope this help! -Dan
  15. This is incredibly late but I thought I'd add that Scrollify allows you to set the mobile initialization without having to customize the window size functions. Read the docs on Github or Scrollify!
  16. Hello, We can't view your website. If you could you set a site-wide password and share it, we can provide a more accurate code for you. The best way to insert this type of graphic is to find a arrow image that resembles your desired look in PNG or SVG format and upload it to your website. You'll use a code block with "absolute" positioning to overlap the transparent image between the two sections.
  17. @bangank36 This is awesome! Learned something new today! How could you use something like this on a page with other sections that don't need to be placed next to each other? Say, if I wanted to add a section underneath the slideshow and text? Because adding a section with this code would place the next section to the right of the text.
  18. Hello, On 7.1, adding a slideshow in the way that you are talking about and shown in the example above is not possible. The slideshow options are limited to specific pages instead of blocks unfortunately. However, 7.0 templates support these Gallery/Slideshow blocks. If you are using 7.1, you'll need to use custom code. You can build a slideshow using a Javascript library or it is also possible to build a simple slideshow using CSS.
  19. Hello, To switch the order of these buttons you can use Custom CSS. The following code should solve your problem. .header-actions--right { flex-direction: row-reverse; } Hope that this helps! -Dan
  20. Hello, You should be able to use the following code to get the full-bleed effect. You may need to adjust the top or bottom padding/margins if you want the images or row for it to sit flush with the banner above. section[data-section-id="60de0bfa33d7aa1e05234f69"]{ .page-section.content-width--wide .content, .page-section.content-width--narrow.content-collection .content, .page-section.content-width--medium.content-collection .content { max-width: 100%; } .page-section:not(.full-bleed-section) > .content-wrapper { padding: 0 !important; max-width: 100%; } } Hope that this helps! -Dan
  21. Hi, Could you please specify where this code is inserted on the website so that we can see the issue as it occurs. Where are these roll-over effects supposed to happen? On the about page? Alternatively, you could also share a screenshot of the problem, that might help too. Thanks, Dan
  22. Hello, Weird, I don't think I've seen this issue be caused by it's own class but perhaps there is a setting that is mark by default to "float: right" for items. The following code may solve your problem. .sqs-block.float-right { margin: 0; } Hope this helps! -Dan
  23. Hello there, Could you please set your website availability to Private and share the viewing password with us so that we can see the problem on your page. Also, are you using the Header/Footer code injection fields for this button? If so, could you also share with us what you're using to generate the button and the code you're using to insert it. Thanks! -Dan
  24. Hello, You're incredibly close with the code you shared to having a working solution. The reason it isn't working is because there are no opening and closing "{}" following the code for your @media screen query, so the fix is simple. @media screen and (max-width:1024px) and (min-width:768px) { [data-section-id="60b93ddcc8f89f0d0d45b26e"] .section-background {background-color: #DFCCBE;}} Hope this helps! -Dan
  25. Hello, If you're using a 7.1 Template. You can do this by navigating to any page, click "Edit", and select "Edit Site Header". The menu will allow you to change the toggle switch for "Fixed Header" on or off. If you're on version 7.0 using a compatible template family, you should be able to add the following code using the Custom CSS tool. Navigate from Home > Design > Custom CSS and paste the code below: // Fixed Header // .Header { position: fixed; z-index: 9999; width: 100%; } -- Courtesy of Ghost Plugins. Hope this helps! -Dan
  • Create New...