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. Normally, yes. When you upload a font to a web-project you'd have access to the file system which typically has a fonts folder. However, in Squarespace you won't be able to import the font in the way that you are -- "webfonts/...". -- Instead, you'll want to get the complete URL link and place it in your "@font-face" source. @font-face { font-family: "your-font-name-here"; src: url('complete-url-fills-in-here'); } @font-face { font-family: "your-font-name-here"; src: url('complete-url-fills-in-here'); } @font-face { font-family: "your-font-name-here"; src: url('complete-url-fills-in-here'); } section[data-section-id="your-ID-#"] { h1,h2,h3,p { font-family: "your-font-name-here"; } } Following this format should get you up and running.
  2. You'll want to start by tracking down the exact year you created the email and the website. It will help to know which service it was originally registered on. I forget what system was used before Google but Google G-suite was used in 2019, which is now Google Workplace. If you know that it was created using G-Suite, you should start with contacting Squarespace support. You can do this in a live chat Monday-Friday. Squarespace technically provides these emails in partnership with Google so they may have options for you to access the email. Hope this all gets resolved! Sorry to hear this.
  3. Hi! Could you please share a link to one of your blog posts? Would be easier to see what we're working with here 🙂
  4. For me, only the blue collection thumbnail is fuzzy. I do see what you mean though and it is likely an issue with the thumbnail resolution that us being used to display the product. You could try exporting new thumbnails. Squarespace and images have always been very weird for me, It's never going to be super-crisp or super-sharp without fine tuning the dimensions or export settings before uploading the images. It's likely because Squarespace sets limits on the file-size or compresses images by default.
  5. Likely, something got weird in your Custom CSS menu. Try the following code and see if it fixes your problem. .image-block:hover .image-card-wrapper { background-color: none; }
  6. It's hard to say what could be causing the issue because we can't see the CSS applied to the image. Chances are there is a border that has been applied to the block and because the image inside of the block is being positioned at the top of said block, it is appearing flush with the border. Depending on how the image is inserted, you could try to pull the "crop/height" handle down while holding the shift key to move the handle in increments until it is centered. Alternatively, you can try repositioning the image inside of the block using custom CSS or by adding padding-top to it.
  7. Hello there, You're probably right in not making images because scaling will certainly cause problems although, the alternative might cause just as many smaller problems... What I would do is write the titles twice, once in the regular font but the second one (the one you want to have the handwritten font) should be in Italics or Bold. 1) Install your handwritten font to your website. 2) Identify the block-ID for each block with the two titles. 3) Target the "em"(italic) or "strong"(bold) and set the font family for it to your custom handwritten font -- adjust the font-size, line-height, weight, and maybe width/height -- You might have to do this for the regular font too. This should help you create two different fonts on one block but you might have word or line wrap problems. You'll have to play around with these but you can also create a pseudo layer to help. Hope this helps, Dan
  8. Hello, Your best option here is to use a media query to change the orientation of the tabs on smaller screens. Since editing code in Codepen won't always work the way it should in Squarespace, a good starting point is this: Add this to your Custom CSS for the block and tweak the settings: @media only screen and (max-width: 640px) { .main-box { flex-direction: column; flex-wrap: nowrap; max-width: 100%; height: 100%; } .box.active { width: 90% !important; } } Best, Dan
  9. Hey, Were you able to fix the issue? You should try again and see if the link description has changed. For me, I see the following. I did like the logo image from before though. Best, Dan
  10. This will require some Custom CSS to achieve this layout. To do this, start by defining the point when you want the layout to switch for mobile devices. For the purpose of this, I'll be using the Squarespace default "640px". #mederi9 { @media only screen and (max-width:640px) { .sqs-col-6 { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: auto; padding-right: 0 !important; } .sqs-row { display: flex; flex-direction: row; width: 100% !important; flex-wrap: nowrap; align-items: unset; justify-content: center; margin: auto; padding: 0 !important; } .sqs-block-image { display: block; width: 100px !important; } .sqs-block { padding-right: 0 !important; } } } Hope that this helps, Dan
  11. You can use Custom CSS to change the color of the header. To do this, navigate from "Home" > Design > Custom CSS. Insert the code and adjust the background property by inserting the hex color or name of your desired color, if applicable. .Header { background: #000; } Hope this helps, Dan
  12. Hello, With the layout that you currently have, you could simply add the following: .page-section { margin: 5px; } To add some spacing between the sections. -- You might also be able to replicate this layout using the Portfolio page layout and using the settings "hover: overlay", adjusting for one single column, and style within that menu as needed.
  13. Everything seems to be working for me on all: iMac 27" - OS - Big Sur; Chrome, Mozilla, Safari iPhone - Latest iOS (14); Safari, Google Windows 12 - Mozilla, Chrome Samsung Galaxy - Chrome I may be overlooking something but nothing stood out to me on these devices, so if there's a particular example please share a screenshot. Is it just the image appearing out of position for you or other things causing issues on your website?
  14. My results had your website well above the 90% score on gtmetrix. I take it that you were able to optimize your website?
  15. Hello, This pen uses two different "preprocessors" that probably prevent you from getting a working version of it on your website. The two being used here are Haml and CSS Sass. Codepen is great for building pens that work within the online environment but requires a high learning curve for transitioning them to other websites, especially to Squarespace. You can try converting these two formats to standard HTML and CSS using online tools but you may find that the animations no longer work. Also, embedded within this Pen is a plugin script called "modernizr", be sure to include plugin that after you've converted the pen. In the Custom CSS menu for Squarespace, you cannot use "<style>" tags in the manner that you mentioned. You don't need style tags when writing CSS in the Custom CSS tab. Instead, use the Block Identifier extension for Mozilla or Chrome to target the elements you want to apply custom CSS to.
  16. 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; } }
  17. Hello, Try this: section[data-section-id="60ac2acc4bc21d6a986068b1"] { min-height: clamp(0px, 56.25vw, 100vh); } Hope this helps! -Dan
  18. 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
  19. 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
  20. 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.
  21. 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
  22. Hello, Try: .header-menu-nav-item a { font-family: "YOUR-FONT-HERE"; } Hope this helps! -Dan
  23. 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
  24. 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
  25. 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
  • Create New...