Jump to content

FreakyStylie

Member
  • Posts

    6
  • Joined

  • Last visited

Everything posted by FreakyStylie

  1. Thanks @tuanphan for the solution! Here's what worked: Removed all the CSS above. Edited site footer and added the following in a code block: <link rel="preconnect" href="https://fonts.gstatic.com"> <link href="https://fonts.googleapis.com/css2?family=Barlow:wght@100&display=swap" rel="stylesheet"> 3. Went to Design>Custom CSS and added the following: p { font-family: 'Barlow', sans-serif; }
  2. Site URL: https://robin-khaki-7l6n.squarespace.com/test-styles-page I've been trying to add a Google font (that is not available on the list of available SquareSpace fonts) using the following CSS: @import url('https://fonts.googleapis.com/css?family=Barlow:wght@100&display=swap'); @font-face {font-family: 'Barlow', sans-serif;} p {font-family:'Barlow'; font-weight: 100;} While I'm in the midst of editing the custom CSS, the fonts on the page display properly. However, after I save the CSS and navigate to a different page, all the fonts change to a random font (and not even a sans-serif font!). Furthermore, when I inspect the code, it says that the font displayed is Barlow (see screen shot) Then the weirdest thing: when I navigate back to the Custom CSS area, the fonts change back to the "Barlow" font specified in the CSS. Without me making any changes! Just by navigating to that screen. Can anyone help?
  3. A final update: dumped my cache for Chrome MacOS, and now things seem to be working!
  4. Update: I've discovered that this seems to be a browser issue, not something with the CSS. After banging my head on this for too long, I finally tested on other browsers (I wish I had done this hours ago). The problem seems to be isolated to Chrome on MacOS (I'm on version Version 89.0.4389.90). I've now successfully tested on the following (didn't check versions): Chrome Windows Microsoft Edge Safari Firefox (MacOS) Safari (iOS) Chrom (iOS)
  5. Site URL: https://hyperboloid-potato-aefg.squarespace.com/ I'm using a markdown block so I can create a border around content on my site. I've achieved the border by creating a custom CSS class .boxinfo Inside my markdown block, I created a div and put my content inside it. This worked well for creating the border, but I noticed that links just appear as regular text. So I added CSS for the links. The CSS for a:link works CSS for a:visited does not work most of the time I've noticed that sometime, the CSS for a:visited DOES work. In the screenshot below, it works for one link, and not for the other. Very strange Here's my CSS: .boxinfo { border: .25em solid #1779B5; border-radius: 1em; padding: 10px; } .boxinfo a:link { text-decoration: underline; color: #0a4564; } .boxinfo a:visited { text-decoration: underline; color: green !important; } And here's a sample of the markdown: <div class="boxinfo"> <H3>Example header</H3> [General Information][1]<br> [new link][2] </div> [1]: /site-search [2]: /for-patients For some reason, the styling is working for the first link, but not the second link (in "Preview mode"). See screenshot 1. However, when viewing the site on an icognito window without being logged in, the styling does not work at all. See screenshot 2. Does anyone have any tips for me?
×
×
  • 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.