Global font styles and colors are not displayed

  • Hello! I am using Elementor version 3.0.16.

    When creating a site, I ran into the problem of displaying global styles of fonts and colors on a mobile device. Instead of the global fonts and colors I specified, I see the base theme style. But if I put arbitrary styles with the same font and color as the global one (pencil opposite the globe in the “typography” section, example, example2), then everything is displayed as it should in the mobile.

    If I specify the font style in the theme, then everything works as it should, but it greatly constrains the design options. I have many pages and global settings help a lot.

    Everything is fine in the computer browser. I have an old mobile phone, about 6-7 years old, Chrome browser, version 39.0.2171.93. If I update my browser, then everything is fine. But there are people who can have the same phone and browser options like me …

    The whole paradox lies in the “global fonts and color”(–e-global-typography…and –e-global-color…), for some reason the phone’s browser processes them incorrectly, although if I make the font and color arbitrary (pencil opposite the globe icon), then everything is fine.

    I disabled all plugins, enabled basic themes, regenerated the CSS file … the effect is the same.

    Please, tell me how I can fix this moment? Updating Elementor to the latest version doesn’t help either.

    • This topic was modified 4 years, 1 month ago by bergaul.
    • This topic was modified 4 years, 1 month ago by bergaul.
    • This topic was modified 4 years, 1 month ago by bergaul.
Viewing 5 replies - 1 through 5 (of 5 total)

  • Hello,

    Please try to review and follow the below guides:

    https://elementor.com/help/how-to-change-font-size/
    https://elementor.com/help/global-fonts/

    Let us know if you have any questions.

    Regards,
    Said

    Thread Starter bergaul

    (@bergaul)

    @saidaboukhadra Hello, thanks for the links.

    My problem is that global fonts and global color are not showing on my mobile phone. The CSS for global fonts and colors is not recognized at all. Although, if I just choose the font and color I want (not through the global Elementor settings), then everything works as it should, the mobile phone displays the selected font style and color … this is very strange. Global fonts displays perfectly on the computer and through the developer’s device simulation.

    Where can there be conflict? How to be in this situation, since I did a great job on the site, and changing everything manually is hell. Please help.

    Hello,

    Thank you for replying.

    Custom CSS is actually out of our Support Scope. But you can use Custom CSS (Pro) tab (If you are a pro user) to enter your custom css and use the How To Use Selector In The Custom CSS Tab guide to use selector tag to add custom css to that specific image / bg image only. But you must check external guides of how to do this for different screen sizes –
    https://stackoverflow.com/questions/36062170/how-to-use-a-responsive-background-image-that-centers-differently-in-both-portra/36063178

    Unfortunately, this is not something we can help you directly with.

    Regards,
    Said

    Thread Starter bergaul

    (@bergaul)

    @saidaboukhadra
    Thank you for your answer! You misunderstood my question. I don’t use my own fonts, I use the full functionality of Elementor. I will explain everything again, step by step.

    1. If I select the pencil icon in the “typography” section and specify the style I need for the text (cormorant font), then everything is displayed as it should and correctly (in the computer and mobile phone browser). The same rule applies to the text color style.

    2. If I select the globe icon in the typography section, i.e. I select the global font (the same – cormorant), then everything is displayed well in the computer’s browser, but in the mobile phone’s browser the global font style and colors are replaced by some other style (apparently the standard theme style).

    Why do global fonts and colors stop displaying correctly in the mobile phone browser and how can this be fixed?

    • This reply was modified 4 years, 1 month ago by bergaul.
    Thread Starter bergaul

    (@bergaul)

    @saidaboukhadra
    do you have a solution? I spent several months to make the site. It will be very unpleasant if this error persists in the mobile version …

    Please see my previous post for a detailed explanation.

    • This reply was modified 4 years, 1 month ago by bergaul.
Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Global font styles and colors are not displayed’ is closed to new replies.