Jump to content

Custom paragraph style not applying to mobile

Go to solution Solved by nick_sh,

Recommended Posts

Hi there!
I applied a different font and style to paragraph 3 on my website.
It looks fine on desktop, but it shows a random font when viewed on mobile. To make it even more confusing, there are some places on mobile where the right font is displayed but others not.
Can anyone help me figure this out?
Thank you in advance!
 

random font on mobile.PNG

Right font on desktop.png

Link to comment
  • Replies 8
  • Views 1.1k
  • Created
  • Last Reply

Top Posters In This Topic

Hi, how did you apply this font to your h3? Please share your custom css code so it's easier for the community to help you.

Note, to use a font that is not the 2 set in Site Styles, you will need to use CSS to upload the font file then apply.

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Website Developer
e: melody@melodylee.tech


💻 Can't figure something out and want to learn? 💁‍♀️ 1-2-1 Squarespace session 
👩‍💻 Need some customisation for a design? 💁‍♀️ Custom Code help
 Did I help? 💁‍♀️ I like coffee (Thank you)

Link to comment

Thank you @melody495!
This is the code I used. The font used is included inside Squarespace so I didn't upload it.

 

p.sqsrte-small {
  font-family: 'Halyard Display' !important;
  font-weight: 300 ;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  line-height: 1.09rem;
}

 

Link to comment
6 minutes ago, mart22 said:

Thank you @melody495!
This is the code I used. The font used is included inside Squarespace so I didn't upload it.

The code look ok.

If the font isn't one of the 2 you have set for Heading or Paragraph, then you will need to upload the font file and treat it was a custom font. As Squarespace doesn't upload all font files available to load your website, that would be a lot of potentially unnecessary data to load that could slow down your website otherwise!

-------- > 👆 <---------- Please quote or @ me when replying, or I won't get a notification 

Melody | Squarespace Website Developer
e: melody@melodylee.tech


💻 Can't figure something out and want to learn? 💁‍♀️ 1-2-1 Squarespace session 
👩‍💻 Need some customisation for a design? 💁‍♀️ Custom Code help
 Did I help? 💁‍♀️ I like coffee (Thank you)

Link to comment

This font is not my heading or paragraph but my miscellaneous one.
The thing is that it shows in some parts on mobile, so it is working just not displaying.
For example, the right custom paragraph 3 font is used in Portfolio titles but not in single portfolio pages or footer. 

I tried uploading the font as you suggested, but I keep having the same issue: it applies it in some places, but not on others.

my website:

www.martabocos.com

 

Edited by mart22
Link to comment

thank you for looking into this  @tuanphan 
The thing is that I am not uploading any font, I am using my Miscellaneous font for paragraph 3. 
I don't understand why it displays on desktop and navigation on mobile, but not on mobile projects, for example.

 

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.