Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

A few newbie problems with fonts and browsers

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Hi!

I'm trying to change the default font size for my articles on www.visartist.se since it's a bit small when using this template (zenbase selected) for my needs.

I thought Design -> Fonts -> Font sizes -> Base Font Size (default 12px) would be a good candidate but I cannot see any effect of changing this number. I tried to use private/incognito browsing to make sure no cached info were loaded.

When testing this is also opened the test site for the first time in Firefox (only Chrome before), and found to my supprise that there was a massive difference in the look. I know there can be differences but most of the time both these browser have presented similar results with sites I did. Also I barely did any changes to the default template setting yet. Is this normal for this template or did I mess things up already? :-P

And finally if you, for instance, go to the "Bilder" menu option and then scroll down a bit you can see the main menu and the logo moved a bit? How can a stop this from happening?

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
Last Edit: 7 years 11 months ago by Ulf Cederholm.
The administrator has disabled public write access.
Hi Ulf,

What should the font size be? currently its

html {
font-size: 12px;
}

With the look being different - what do you see that is different?
As it looks ok for me
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Regarding the scroll issue

This is called a Sticky Nav

You can turn this off in the effects tab of the template settings

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Well this is strange. I tried yesterday to change the default font size to 24px and even 48px without any visual change at the front-end. However toady when I once again changed to 48px it showed.

I now tried to change H1 size from 3em to 1em but didn't see any difference. I also tried to change the menu size by changing the Main Menu Fonts -> Navigation Font Weight from 300 to 100. No visible difference there either. So maybe I just need to wait longer for the change to show? Even if using using private/incognito mode or SHIFT+F5 to avoid loading content from the cache?

In short I'm quite happy with the default H1 size and defaul Menu size in the template but would like a bigger font for just the text within the <p></p> tags.

Regarding the sticky menu I would like to keep it if possible, but I would just want to get rid of the slight shift of the menu to the left (and logo to the right) that takes place when scrolling (at least it happens in all my browsers).

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Hi Ulf,

Are you using a host like siteground that has caching enabled by default?

Its supercacher I think on siteground
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Have the changes you made 8 hours ago displayed?
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
With the sticky - I can see you have made a few changes - I might need to suggest css linked to the tags used

Is the logo area staying the same?

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Yes just recently joined Siteground and forgot that they have a cache function. I will try and inactivate that function during the developmen of the new site. Thanks for pointing it out.

I wasn't aware I had made any changes to the sticky settings; other than trying to turn it off and then on again. Right now the problem remains, but since neither the logo nor the main menu is final I suppose I can get back to when they are if the problem still persist.

Firefox and Chrome looks pretty close now as well. I guess that is once again the supercacher that was causing the differences.

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Hi Ulf,

Sorry I wasn't clear regarding the sticky - I thought you'd made changes to the content of it so were changing that part of the site

I will check with the developers regarding your question on this

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Regarding changes if you still see issues with the site after you've turned the caching feature off please get back to us on it

It could be something more vital

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
But one question remains that I don't fully understand. Is it correct that the only way to just change the size of text within <p></p> tags is to do a custon css? Or is there a way to do this in the template interface settings? Changing the Base Font Size affects not only normal text but also the headlines and menu so this option is not working out so great for me.

But the code you mentioned would it not also affect all the text sizes?

html {
font-size: 24px;
}

Would something like below be what I'm looking for?

p {
font-size: 24px;
}

Thanks again!

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
I can get the look I want by changing the Base Font Size and then change all the Hx em values to scale them up or down to match the change.

However if I change it in the future I would have to find new values for all headers again. If there in addition to the Base Font Size field were a Paragraph Font Size field (and perhaps even a Menu Font Size field?) it would be possible to have a base font size to base the headlines on while still easily be able to adjust article font sizes and menu text size without any adverse effect.

Perhaps this would not be possible to implement, or it is implemented in a way I'm not aware of?

Finally when reducing the width of the Logo it stopped moving to the right when scrolling down in an article. Unfortunately I haven't had the same luck with the menu moving slightly to the left by reducing the number of menu options to reduce its width.

Status update complete. :-D

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Hi Ulf,

I'll pass on your feedback to the developers regarding the font sizing - I'm not quite sure how complex this or if it affects performance.

Yes my suggestion would have increased all font sizing regarding your suggestion I'd add an extra tag infront of the p

html {
font-size: 48px;
}

is the current style

so to make the style a little more specific I'd add

html p {font-size:34px} but your style should do the trick
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
Last Edit: 7 years 11 months ago by manh.
The administrator has disabled public write access.
For moving to the left does adding this work

@media screen and (min-width: 787px) {
.zen-nav-fixed .zen-spotlight {padding: 0 2%;}
}

to the custom css file

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Just a quick note. I have not tested the code you mentioned yet, but I noticed that it is the same issue on your Build.r template demo when choosing the ZenBase option so it is either a problem with the template or a deliberate effect. Will try the code as soon as I figure out how to apply it. :-P

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Hi Ulf,

This was a deliberate design decision by the developer :)

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Just tried the code and it worked! However the selected menu option text still turns from white to cyan, essential make it invisible and just leaving a big block of light blue. Any suggestion for keeping the text white?

Sorry for bothering you with details. :blush:

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Hi Ulf,

No problem

Open up the template settings and look at the style tab on the right

Scroll down till you see sticky menu and change the
"Sticky active link" color to a new colour

and then save

cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Thanks again!

One final thought I wanted to mention and then I will consider this post closed. :whistle:

I asked about the possibility to add a Paragraph Font Size field and a Menu Font Size field to the themes settings. I thought of one final field I would have thought some would find useful, and that is a Base Paragraph Height field to complement the Base Line Height.

I know it's a lot just about text I'm going on about here, but to me at least the text is just as important as the graphics of the site. Again this might already be available (not counting the custom.css file) or simply not possible to implement. But at least it's worth a try asking.

/Ulf
  • Ulf Cederholm's Avatar
  • Ulf Cederholm
  • LIfetime Developer - Big Bamboo
  • 11 posts
  • Karma: 0
The administrator has disabled public write access.
Thanks Ulf,

I'll definitely pass on your feedback to Anthony the owner / lead developer of joomla Bamboo

He is currently on holiday at the moment but I will pass on your feedback as soon as he is back

Cheers and thanks again
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers