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

Markdown font change in smartphone

Question

I have a disturbing problem. When using markdowns with the code:

<div style="text-align:center"><span style="font-family:AVAYX; font-size:1.8em; color:black">**SOME OF OUR LATEST PROJECTS**</span> 

The font appear on my computer, but when I visit my site on my iphone the font in the markdown is changed to another.. looks like times new roman or something similar, but not the font that I'm using in the markdown.. 

What is wrong? Why isn't the markdown show the correct font in responsive view? 

 

 

Share this post


Link to post

14 answers to this question

Recommended Posts

  • 0

How am I doing that? Maybe you need my username and password? https://cuboid-caper-carz.squarespace.com/csr

Here are another code I've installed in a markdown:

<div style="text-align:RIGHT"><span style="font-family:broadcastmatter; font-size:2.2em; color:hsla(43, 36%, 90%, 1)">Our Vision</span><div style="text-align:RIGHT"><span style="font-family:avayx; font-size:1em; color:hsla(43, 36%, 90%, 1)">TO COMBINE FASHION WITH SUSTAINABLE MANUFACTURING TO CONTRIBUTE A BETTER HEALTH AND FUTURE FOR OUR LIVING PLANET</span>

None of the above fonts (broadcastmatter and avayx) appear on mobile view... only visible on computer view.

 

Share this post


Link to post
  • 0
30 minutes ago, TobiasRL said:

How am I doing that? Maybe you need my username and password? https://cuboid-caper-carz.squarespace.com/csr

Here are another code I've installed in a markdown:

<div style="text-align:RIGHT"><span style="font-family:broadcastmatter; font-size:2.2em; color:hsla(43, 36%, 90%, 1)">Our Vision</span><div style="text-align:RIGHT"><span style="font-family:avayx; font-size:1em; color:hsla(43, 36%, 90%, 1)">TO COMBINE FASHION WITH SUSTAINABLE MANUFACTURING TO CONTRIBUTE A BETTER HEALTH AND FUTURE FOR OUR LIVING PLANET</span>

None of the above fonts (broadcastmatter and avayx) appear on mobile view... only visible on computer view.

 

Where is markdown in link you sent? I can't find them...


Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


Link to post
  • 0

Thanks for taking time but I don't know how to share a specific markdown (frist time here in this forum).

The domain site is https://inotex.se/csr if you scroll down to the sewing machine you see a vision text. This vision text is inside a markdown with the code I sent before.

See my attached picture to see how it should look like and how its look on my computer but not in responsive view...

Skärmklipp 2019-12-17 00.41.26.png

Share this post


Link to post
  • 0

@TobiasRL Did you use font which provided by Squarespace or Custom font (you uploaded to your site)?

The font not showing here, both Computer/Mobile/Tablet.

If you use custom font, you need to declare with some code to use.


Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


Link to post
  • 0

Okey, I used a font installed on my computer. But I have tried other fonts aswell, fonts that I can source in Squarespace site styles. But it don't work either. Do I need to inject custom code somewhere else or do something more than just a markdown to get this work?

Share this post


Link to post
  • 0
3 minutes ago, TobiasRL said:

Okey, I used a font installed on my computer. But I have tried other fonts aswell, fonts that I can source in Squarespace site styles. But it don't work either. Do I need to inject custom code somewhere else or do something more than just a markdown to get this work?

If you use a font not provided by Squarespace. You need to add this code to Home > Design> Custom CSS

@font-face {
	font-family: broadcastmatter;
	src: url( paste font url here);
}

Then markdown font will work.

Edited by tuanphan

Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


Link to post
  • 0

Ok. Im a newbie. But I found info about the font-face for avayx. 

@font-face {
font-family: 'Avayx Regular Regular';
font-style: normal;
font-weight: normal;
src: local('Avayx Regular Regular'), url('Avayx.woff') format('woff');
}

So I did like this but it still dont work...? 

@font-face {
	font-family: Avayx Regular Regular;
	src: url(Avayx.woff);
}

Share this post


Link to post
  • 0
12 minutes ago, TobiasRL said:

Ok. Im a newbie. But I found info about the font-face for avayx. 


@font-face {
font-family: 'Avayx Regular Regular';
font-style: normal;
font-weight: normal;
src: local('Avayx Regular Regular'), url('Avayx.woff') format('woff');
}

So I did like this but it still dont work...? 


@font-face {
	font-family: Avayx Regular Regular;
	src: url(Avayx.woff);
}

src: url( here is font url NOT font name);

Are you sure "Avayx.woff" is valid URL?

 


Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


Link to post
  • 0

So right now my Custom CSS looking like: 

@font-face {
	font-family: Avayx Regular Regular;
	src: url(Avayx.woff);
}

And my Markdown looking like:

<span style="font-family:Avayx Regular Regular; font-size:0.7em; color:hsla(43, 36%, 90%, 1)">OUR VISION IS TO COMBINE FASHION WITH SUSTAINABLE MANUFACTURING TO CONTRIBUTE A BETTER HEALTH AND FUTURE FOR OUR LIVING PLANET</span>

 

And it still dont work, what do I need to change?

Share this post


Link to post
  • 0
5 minutes ago, TobiasRL said:

Not sure. Found it here: https://www.cufonfonts.com/font/avayx

@font-face {
	font-family: Avayx Regular Regular;
	src: url(you need to paste font file URL Here, NOT font name, eg: example.com/resources/avayx.ttf, download font to your pc, then upload to ss, and get url);
}

Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...