Custom police on mobile version

Hello everyone,
I changed the police of our website to a customised one. It looks great on the screen of my computer. On mobile the police is back to default which is quite annoying Is there anything I could do? If so, could you please assist me?
Thank you very much in advance for your help.

Hi there

Hope you are having a good day and thank you for your question :slight_smile:
In order to check your question i need to see your live website, please provide url and i will take a look

Hi Noda,
Here you are :
Thank you!


hm… why i cant see it? even on smallest screen devices footer credit remains hidden for me, i see css code is added and it works great for desktop and for smaller screen devices, could you share a screenshot?

I know! It’s so frustrating! It works on my screen but not on my phone.
Please find some screens from my phone below.

Wait, wait… i thought we were talking about privacy policy text in the footer, but you sharing a screenshot of the different section of the page,… now my question is “I changed the police of our website to a customised one” what you mean in this?? can you tell me little bit more on this?

I am so sorry, I meant “font” (which is police in French). Should have confirmed the word before sending.
Apologies Noda.

:smiley: no problem buddy

please add this css in appearance> customize > additional css:

h3 {
line-height: 53px;

Hello Noda,
Sorry for my late reply. I tried the added css this morning. No result unfortunately.
The default font still appears on the mobile version of the website.

Hi @plngida

Please clear cache and check again :wink: i see its applied and i can see the difference

Hi Noda,
Thank you for your help again.
I did actually but no change on my phone screen :’(

Please check attached screenshot :slight_smile:

Sorry Noda, I cannot see them. Thank you for the spacing, it really improved the rendering.
I am not sure I have been really clear in my explanations. My problem is the font in itself. I uploaded and integrated a new one (font-family GIDA). It shows on computer screen but not on phones.

Ouch, sorry about image, :slight_smile:
Please check it again here

Hi Noda,
Thank you but this is not the font I applied.
Should appear like shown in SS.
I guess I would need some extra css addressing the style of the responsiveness.

Thats strange thought, i can see you are using custom font GIDA but this font is not loaded anywhere, can you tell me how you implemented this font on the website?

and regarding on your photos, what is the problem with them? I really can’t see anything unusual

No pb with the photo. Just the font :slight_smile:
So I sent the .tiff via FTP to our host.
And added:
@font-face { font-family: ‘GIDA’; src: url(‘GIDA_normal.ttf’); }
@font-face { font-family: ‘GIDA’; src: url(‘GIDA_thin.ttf’); }
@font-face { font-family: ‘GIDA’; src: url(‘GIDA_bold.ttf’); }

Hi there

That will not work, can you tell me where they are located in the server? i need a direct link to the fonts or font folder

Hi Noda,
Sorry for the delay.
I stored it in the font file of WP folders : /srv/users/serverpilot/apps/gida/public/wp-content/themes/shapely/assets/fonts
Thank you!

Hi there

Send me your admin details please, something is not working and can fix it from dashboard
Colorlib Support Team