Jomsocial issue and overall font size issue

Please see attached file showing the Jomsocial frontpage is not correctly displayed.

Also, there seems to be a font size issue throughout the template compare to your demo site, e.g. see the menu font which is the most obvious and then see the headings on the various modules are also very large, the template looks nothing like your demo website. How can this be easily fixed please?

Jomsocial Front.png

btw....I did add the extra headers but still not working correctly.

Untitled.png

I have the same problem. Posted onto the forums a while back but I have been ignored since then. Please let me know how you get on with your one, or if you have solved it, please help. This is the link to my post, just in-case someone helps me on that post. 134-joomla-17/91122-jomsocial-theme-soon-available.html?limit=40&start=80

Both of you are using Arial font where this template comes with Bebasneue font therefore font sizes in styles has been adjusted for Bebasneue font. Simply your font sizes are to big when you are using Arial Font.

If you want to use Arial font simply change font sizes to suit your website. Follow below.

For Text "Get Connected!" make following changes.

Find File: components/com_community/templates/gk_style/css/style.css
Find Line: 1000 which is below

Code: Select all

body #community-wrap div.greybox div div div h1 {
    color: #444444;
    font-size: 52px;
    height: 60px;
    margin: 0;
}


Replace it with below, made the text uppercase if you dont want it delete last line.

Code: Select all

body #community-wrap div.greybox div div div h1 {
    color: #444444;
    font-size: 30px;
    height: 50px;
    margin: 0;
    text-transform: uppercase;
}


For text "JOIN US NOW, IT'S FREE!"
Find Line: 1019 which is below

Code: Select all

body #community-wrap div.greybox a#joinButton {
    -moz-text-blink: none;
    -moz-text-decoration-color: -moz-use-text-color;
    -moz-text-decoration-line: none;
    -moz-text-decoration-style: solid;
    color: #FFFFFF;
    display: block;
    font-size: 29px;
    font-weight: bold;
    height: 33px;
    text-align: center;
    text-shadow: 0 1px 0 #921F0C;
}


Change font-size to 20px..

See you around...

Thanks a million normanUK. I replaced the the code and now everything looks good. I looked for the Bebasneue font on google webfonts and on spiral, and they didn't seem to have it. Would have just changed my global font for the whole template as that would have reduced the stress of messing around with the code during upgrades.

Bebasneue font should be included in the template and it is selectable from font panel.

To choose Bebasneue font where it says "Standard" select Squirrel then on right you should see Bebasneue font. You might have to select another font in the list then again Bebasneue font for the changes to take effect.

Hi norman,
I have the same issue with jomsocial 2.4 layout described in this topic.

I installed and enabled jomsocial 2.4 theme but layout it is a little messy.
I successfully paste the headers selectors for this theme into the template config (BebasNeue font selected for headers) .. it seems that template is not picking the right font.

Untitled-1.jpg

If i enable BebasNeue font for Body jomsocial template it's displaying fine but twn2 template gets messed up (wrong font for main menu and so on)


How can i fix it?

If you can send a private message with an admin access i can check this for you or if your website is not online take a screenshot in your localhost so we can see the problem.

See you around...