Jump to content


Photo
- - - - -

How to change font size?


  • Please log in to reply
3 replies to this topic

#1 overachiever

overachiever

    Newbie

  • Members
  • 2 posts
  • Country: Country Flag

Posted 26 December 2012 - 06:37 AM

I would like to know how to change the font size in the pagelines framework.  I was looking for the option in the typography tab to change the font size of the menu for instance, but I cannot find any options to change it on the different elements.  Please point me in the right direction.  


  • photomomwife likes this

#2 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 26 December 2012 - 08:00 AM

Font size is not controlled by a setting.  There are too many variables to permit this.  For example, fonts can be set for static sites in pixel height, but responsive sites want to use the em tag to ensure the site's have continuity in many browsers and devices.

 

So, the solution is to use a tool like Chrome's Inspection Tool or

Please Login or Register to see this Hidden Content

to identify the specific set of text you want to change, then apply CSS to your Custom Code / CSS Rules to change it, applying the change to the specific element containing that text. For more information about font styling, see

Please Login or Register to see this Hidden Content

 

I know that's confusing, so let me elaborate just a bit.  Each thing you do in PageLines falls into some styled element, like a paragraph or a list item.  (<p> or <li>, respectively)  and these usually have a class or ID applied to them.  Find the correct class or ID and you'll see something in the CSS like font-size: 12px;

 

Just change that 12px to 18px and you've increased the size.  Firebug and Chrome's Tool allow you to test first. If it's the way you like, copy the code from those tools and drop it at Dashboard > PageLines > Site Options > Custom Code > CSS Rules.



#3 overachiever

overachiever

    Newbie

  • Members
  • 2 posts
  • Country: Country Flag

Posted 27 December 2012 - 08:38 AM

Hello Rob,

 

Thank you for the detail explanation, it was very insightful.  I did have one more question now that I have looked into the tools you recommended.  For the styling I know now that I can just change what I want in the firebug or google developer tool and copy and paste it into the theme editor but how can I change other elements for instance the javascript or a theme function.  For instance with the styling I simply start at the .body and past but how is it possible to cut and paste other elements beside styling?  

 

Thanks!



#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 17015 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 27 December 2012 - 09:08 AM

I apologise but I am not quite sure you're referring to, can you go into greater detail.