Typography and colors

POFO provides an option to set the font typography and colors through out the site. You will find below mentioned sections in here.

  1. Font Family
  2. Font Size
  3. Font Color
  4. Comment
  5. Heading
  6. Base Color

1. Font Family

You can overwrite theme default body fonts with your desired Google fonts from this setting. Sections under this panel are as follows:

  • Main/Body Font
  • Additional Font

Font Family > Main/Body Font

You can get the settings to select default body font, font weight and font languages under this section.

Font Family > Main/Body Font > Main/Body Font

You will get drop down menu of google fonts under this setting to set default font of your theme.

Font Family > Main/Body Font > Font Weight

You can select more then one font weights for the above selected body font in this setting.

Font Family > Main/Body Font > Font Languages

You can select more then one font languages for the above selected body font in this setting.

Font Family > Main/Body Font > Additional Fonts

You can get the settings to select alternate body font, font weight and font languages under this section. Please refer above section “Main/Body Font” for more assistance.

2. Font Size

This section contains settings regarding size, line Height and spacing of body and content fonts.

Font Size > Body Font Size

You will be able to set the default font size for site from entering value into the provided text box followed by px.

Font Size > Body Font Line Height

You will be able to set the default line height of body font for site from entering value into the provided text box followed by px.

Font Size > Body Font Character Spacing

You will be able to set the default spacing between character of body font for site from entering value into the provided text box followed by px.

Font Size > Content Font Size

You will be able to set the default font size for content of page,post or portfolio from entering value into the provided text box followed by px.

Font Size > Content Font Line Height

You will be able to set the default line height of body content font for page, post or portfolio from entering value into the provided text box followed by px.

Font Size > Content Font Character Spacing

You will be able to set the default spacing between character of body content font for site from entering value into the provided text box followed by px.

3. Font Color

POFO gives setting for default background, text and link color for your site.

Font Color > Body Background

You can set the default background color for all pages across the site from here. Click on “Select Color” button under this and select color from color picker.

Font Color > Body Text

You can set the default text color for all pages across the site from here. Click on “Select Color” button under this and select color from color picker.

Font Color > Link

You can set the default link color for all pages across the site from here. Click on “Select Color” button under this and select color from color picker.

Font Color > Link Hover

You can set the default link hover color for all pages across the site from here. Click on “Select Color” button under this and select color from color picker.

4. Comment

Setting regarding comments will be covered in this section.

Comments > Border

You can display / hide the border on the comments section from selecting “On/Off” button respectively.

Comments > Comment Title Font Size

You will be able to set the font size of comment section title from entering value into the provided text box followed by px.

Comments > Comment Title Font Line Height

You will be able to set the line height of comment section title from entering value into the provided text box followed by px.

Comments > Comment Title Font Character Spacing

You will be able to set the spacing between character of comment title from entering value into the provided text box followed by px.

Comments > Comment Title

You can set the color for comment title from here. Click on “Select Color” button under this and select color from color picker.

Comments > Comment Border

You can set the color for comment border from here. Click on “Select Color” button under this and select color from color picker.

5. Heading

You can get settings regarding heading tags over here. You will be able to customize all heading tags. Sections under this are as follows:

  • H1 Logo
  • H1 Font and Color
  • H2 Font and Color
  • H3 Font and Color
  • H4 Font and Color
  • H5 Font and Color
  • H6 Font and Color

Heading > H1 Logo

Here you can add/remove H1 tag for logo in front / home page.

Heading > H1 Font and Color

You can customize the H1 tag on your site from this section.

Heading > H1 Font Size

You will be able to set the font size of default H1 tag from entering value into the provided text box followed by px.

Heading > H1 Font Line Height

You will be able to set the line height of default H1 tag from entering value into the provided text box followed by px.

Heading > H1 Font Character Spacing

You will be able to set the default spacing between character of H1 tag from entering value into the provided text box followed by px.

Note:  Please refer “H1 Font And Color” section for all remaining sections as they will perform same action on respected tags as mentioned above.

6. Base Color

You can set the default base color from this setting and that will overwrite theme default pink color with your selected color in almost places if that is not changed / setup as different color within any specific shortcode or customize settings. Click on “Select Color” button under this and select color from color picker.