Change Font Case Type when using Custom CSS for uploaded Fonts

Site URL: http://rust-coconut-kf7x.squarespace.com/what-is-nutritional-therapy

Hello - I recently used this guide to help me use specially purchased fonts for my site. 

It partially worked, but I have two questions for the pieces I can't figure out:

1) The Headings seem to be in all CAPS by default. How do I correct this (It doesn't look right with the font I'm using)? I'd like it to be as typed, meaning there would be some words starting with capitals, but the rest would be lowercase.

2) The coding didn't work for the body text. I replaced 'H1' with 'P1' (and P2, P3, etc.) respectively, double-checked the font title was spelled correctly, etc., but I cannot get it to appear as the font in the body. Any help?

PW is wr1234

I resolved question #1. I am still having issues with Question #2 (see original post).

I tried adding the file extension ('.otf') to the font name, which helped in the case of the headings (which is strange because that was not needed when I was using a different font family with the same extension, so I don't think that is the issue).

I've added new screenshots, can anyone help me to figure out why I can't seem to change my paragraph/body font family?  (Keep in mind, the screenshots only show 'p4' but I applied the same code to 'p1', 'p2', 'p3', and 'p4' respectively, only changing font size).

Hi,

heading has h1, h2, h3, h4, h5, h6

p has no p1, p2, p3...

p has only p, p.sqsrte-small, p.sqsrte-large

On 8/21/2021 at 11:45 PM, tuanphan said:

Hi,

heading has h1, h2, h3, h4, h5, h6

p has no p1, p2, p3...

p has only p, p.sqsrte-small, p.sqsrte-large

 

Thank you, that helped. The instructions I followed to change the font code said otherwise. All good now!

2 minutes ago, hilaryb said:

Thank you, that helped. The instructions I followed to change the font code said otherwise. All good now!

 

Can you also please help me to know how to change the font on the buttons and navigation links?

On 8/23/2021 at 11:23 PM, hilaryb said:

Can you also please help me to know how to change the font on the buttons and navigation links?

header buttons is header#header a.btn

block button is div.button-block a

navigation is div.header-nav-item a

mobile navigation is div.header-menu-nav-item a

@tuanphan - I have used the above formatting for paragraph text on our website but it doesn't change P2 or P3 - i have set all to the same size and font to show this in the attachment.  website is www.hastingscity.co.nz

Any help appreciated.

10 hours ago, emma_HCBA said:

@tuanphan - I have used the above formatting for paragraph text on our website but it doesn't change P2 or P3 - i have set all to the same size and font to show this in the attachment.  website is www.hastingscity.co.nz

Any help appreciated.

Hi,

No ' ' in the code

letter-spacing: 10px;

font-size: 20px;

@tuanphan T H A N K  Y O U!

Next question if you can help - on tablets and on mobile, the padding effect bleeds over the text on image blocks, as per attached image.

Do you know what code I would use to fix this please?  I have tried but can't figure it out.

On 7/6/2022 at 7:23 AM, emma_HCBA said:

@tuanphan T H A N K  Y O U!

Next question if you can help - on tablets and on mobile, the padding effect bleeds over the text on image blocks, as per attached image.

Do you know what code I would use to fix this please?  I have tried but can't figure it out.

Hi. Which page are you referring to?

HI @tuanphan

on the all of the following pages:

https://www.hastingscity.co.nz/eatdrink

https://www.hastingscity.co.nz/shop

https://www.hastingscity.co.nz/wellness-beauty

https://www.hastingscity.co.nz/artsentertainment

https://www.hastingscity.co.nz/services

11 hours ago, emma_HCBA said:

HI @tuanphan

on the all of the following pages:

https://www.hastingscity.co.nz/eatdrink

https://www.hastingscity.co.nz/shop

https://www.hastingscity.co.nz/wellness-beauty

https://www.hastingscity.co.nz/artsentertainment

https://www.hastingscity.co.nz/services

Did you solve? It checked first 3 links and all fine.

Hi @tuanphan no I haven't fixed it - if you look on mobile, on Eat & Drink, at Hastings Distillers, you can see the blue background on the font bleeding over the text.  same on the other pages with longer names.

19 hours ago, emma_HCBA said:

Hi @tuanphan no I haven't fixed it - if you look on mobile, on Eat & Drink, at Hastings Distillers, you can see the blue background on the font bleeding over the text.  same on the other pages with longer names.

It looks fine on my end

Try adding this code to Page Header

<style>
  @media screen and (max-width:767px) {
  figcaption.image-card-wrapper * {
    display: inline-block;
    text-align: center;
}
  }
</style>

Hi @hilaryb

I'm having the same issue #1 that you were (all of the headers being in all caps and wanting to be able to use upper OR lower case). Do you mind if I ask how you resolved that issue? 

@tuanphan - If you also happen to know I'd be very grateful for any help! 

Thank you both!

@hilaryb @tuanphan@robandsamphoto 

I am running into the same issue as the OP for issue #1.  How were you able to rectify the ALL CAPS issue?  I have uploaded a script type font and I plan to use it sparingly, but it looks TERRIBLE in all caps and it's too busy as a paragraph font.  Can any of you help?  Thanks!

On 10/25/2022 at 1:34 AM, NCforKatKole said:

@hilaryb @tuanphan@robandsamphoto 

 

I am running into the same issue as the OP for issue #1.  How were you able to rectify the ALL CAPS issue?  I have uploaded a script type font and I plan to use it sparingly, but it looks TERRIBLE in all caps and it's too busy as a paragraph font.  Can any of you help?  Thanks!

Can you share link to your site? We can take a look

I'm also having the same issue #1 as OP.

My text is showing as all CAPS.

I would like both upper and lowercase text.

It's happening with the two fonts that I've loaded into Squarespace.

Tried it on this brand-new test site with no pre-existing code just to be safe but still have the problem. 

https://opossum-fiddle-rr6p.squarespace.com/help

password:

Tango

The site is private. Can you setup an access password? We can check easier

Hi Taun, I gave the password : 

Tango

Did that not work? 

On 9/16/2023 at 12:13 PM, mames said:

Hi Taun, I gave the password : 

Tango

Did that not work? 

Your site is private, please check again & change it to password protected