-
Posts
-
Dear Team,
I have changed the fonts of the titles a 1000 times, but I never achieve finding a form that remains stable over time: they always change to bigger or smaller, ans this happens on PC, on tablet and on smartphone. Is it possible to establish the fonts of all kind of headings and paragraphs texts (special headings, bloc texts, icons heading), including their responsive behaviour, so that they remain unchanged ? I spend my time going through every single heading in all pages, they keep changing from one day to the following, and it never ends.
Thank you very much for helping in this issue, it is driving me crazy.
Best,
NatachaHey HulaSlim,
Thank you for the inquiry.
You can globally set the body and heading font in the Enfold > General Styling > Fonts panel. Which font are you trying to use? The heading is currently set to Open Sans when we checked.
Best regards,
IsmaelHi Ismael,
Sorry I wasn’t clear enough. What is not stable is the dimension of the font. In responsive mood it is very difficult to find a dimension that is good for all screens. For example:
1. the font of the title “En pratique” looks too big on smartphones, compared to the bigger H2 title, but it turns ok on tablets and PC. It is set on 8 though, so difficult to make it smaller…
2. Then there is another strange phenomenon in the first paragraph right after “Notre parcours”: in each single page, on PC it’s ok, while on smartphones and tablets one or two letters of the first line are systematically “brocken”.
3. A third problem is the dimension of each H2 title: on PC and tablets ok, on smartphone it looks too big compared to the H1 contained in the slide-show; but if I increase the H1, then it covers the entire picture on smartphone, so here again, difficult to solve the problem.
Thank you for checking these cases.
Best regards,
NatachaHi,
Thank you for the info.
We can’t really reproduce the issue on our end. Please temporarily disable the Enfold > Performance > File Compression settings while editing the site so that you can see any style changes immediately.
Would you mind providing a screenshot of the heading on desktop, tablet, and mobile view? You can use imgur, savvyify or dropbox for the screenshot. We will check the site again once the screenshots are available. Thanks.
Best regards,
IsmaelHi,
Problems n. 1 and 3 are solved.Shot probem 2 (brocken letters always in the center of the title of the first double column text-image):
https://savvyify.com/img/images/2022/09/14/Shot-2-Brocken-letters.th.jpgShot problem n. 4:
https://savvyify.com/img/images/2022/09/14/Shot-1-Title-too-small.th.jpg.
Thanks for checking.
Regards,
NatachaHi,
We cannot reproduce #4. For the iconbox title, try to adjust the style of the H4 heading tag in the Enfold > Advanced Styling panel or use this css code.
h4 { font-size: 30px; line-height: 1.1em; margin-bottom: 4px; }To adjust the font size on mobile view or on smaller screens, add this css media query.
@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ h4 { font-size: 20px; line-height: 1.1em; margin-bottom: 4px; } }Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the changes.
Best regards,
IsmaelHi,
Thank you for the advice concerning Enfold/advanced style.
Where do I have to put the css code ?
I need those brocken letters to disappear, it makes a bad impression to users of the website. Can you please maybe transfer the issue to someone else ? Since we all see things differently, maybe another person will have an idea.
Thanks
Best
NatachaAnother question: as I often write a title and a subtitle, is it possible to have a field modifying the subtitles as well ? In Enfold/advanced styles there are only parameters settings for titles, not for subtitles. Is it possible to modify the menus in Enfold/advanced styles so one can modify things from there ?
Hi,
Unfortunately, you would not be able to modify the advanced styles options, it would not be an easy thing.
It would be much easier to add some css into the Enfold Theme Options ▸ General Styling ▸ Quick CSS field which is what it is designed for.Best regards,
MikeHi,
This is because your first color section after the slider is using the Scroll Down Arrow:
and on mobile it’s background is a diamond shape that is over the words: LE VITRAIL: UNE FENÊTRE SUR L’AU-DELÀ making it look broken:
you should disable this because it is nearly half way down the page and doesn’t make sense to use it there.Best regards,
MikeHi,
I checked the two pages that you linked to and the source code says it’s an arrow:
Please include an admin login in the Private Content area so we can be of more assistance in removing these.Best regards,
MikeHi,
Thanks for the link to your site in the first color section in Layout ▸ Borders ▸ Section Bottom Border Styling you have the option set: Display a small arrow that points down to the next section
I disabled this for you on the two pages that you linked to, please clear your browser cache and check.Best regards,
MikeHi Mike,
Oh yes, the arrow phantoms disappeared. Thank you very much for your help.
However, I don’t understand why the setting of the preceding color box affects these paragraphs, since they are in the following color box. Do you have an idea ?
Thanks
NatachaHi,
Glad this helped, it’s because the arrows hang below the color sections over the text on mobile.
Unless there is anything else we can help with on this issue, shall we close this then?Best regards,
MikeHi Mike,
I understand. Now that you say it, it look so logic.
Thank you for helping. I’ve noted this in case for the future. You can surely close the subject.
Best regards,
NatachaHi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike
- The topic ‘Titles font instable’ is closed to new replies.