Font Values Pagebuilder Pro and Helix - Forum | JoomShaper
Solved SP Page Builder

Font Values Pagebuilder Pro and Helix

Asked by Siegfried Strassner 4 years ago Last activity 4 years ago

Hi,
actually I am modifying the font size values for mobile view. I could set the diferent values for diferent media displays in Pagebuilder, e. g. in the Text Block addon. But choosing this way I have to modify seperately each existing text and page.
Now I had the idea to set general values in Typography of Helix, without setting specific font size values in Pagebuilder. So I set the font values in Helix for diferent media displays.
But handling this way, the font sizes in Pagebuilder pages do not change for mobile or tablet view. Is there no transfer of the diferent values in Helix to Pagebuilder? Or how can I manage this?
Thank you for answer.

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff
4 years ago · edited

Hi Siegfried,

On your case, I would set font-size for mobile/tablet using custom CSS & Media Queries.
For example (Mobile): 

@media (max-width: 640px) { 
body, p, li, span, strong, td {font-size: 16px;} 
h1 {font-size: 36px;}
h2 {font-size: 33px;}
}

and of course you can put there classes used by addons etc. and use @media for Tablet etc.

So all you would have in one file (place) = easy to manage. Many webmaster uses this method with success.

4 more replies

Oldest first Newest first Most helpful
Siegfried Strassner Asked this
4 years ago

If you think about it, the solution could be so easy ...
Thank you!

Paul Frankowski Senior Staff
4 years ago

It also allows you to remain consistent. So text and headers would have this same font size on every single subpage.

Siegfried Strassner Asked this
4 years ago

Hi again,
thank you for the code, I tried it. But unfortunately it dit not work, there is no effect on the font sizes used in pagebuilder, especially in the addon "text block". Neither if I clear the cache.

Then I tried to put diferent PB classed, but only I reached to chance the title-tag for media view with this code:

@media (max-width: 580px) {
.sppb-section h2{
font-size: 26px;
line-height: 35px;
}
}

Trying the same with p, body (and so on) failed, also there is no effect when I put different pagebuilder classes.

So, which class I have to put there, which code I need to change the size of the text in the text block?

Log in to reply.