Getting Started

Theme Options & Style

General Guidelines

Plugins

FAQ

Extras

Colors & Typography

The theme offers built-in fonts and color customization controls. Typography elements can be customized separately.

Colors 

There are plenty of color options included in the theme to meet your brand needs. The theme offers two color scheme Light & Dark Mode. 

All site-wide colors. Highlight, accents, buttons, badges, and flags.

  • Go to the Newsy → Theme Options →  Colors panel
  • Use available color pickers to adjust color values

 

Typography 

The theme offers built-in fonts customization controls. Typography elements can be customized as like.

  1. Go to the Newsy → Theme Options →  Typography panel
  2. Use available font controls to adjust typography values

Font Control

This view represents font settings for a theme place. You can change:

  • Font – font family
  • Variant – font style, available choices depend on the chosen font
  • Subset – font subset
  • Size – text size
  • Line height – the height of a line
  • Letter Spacing – increases or decreases the space between characters in a text
  • Text Transform – controls the capitalization of text
  • Align – controls the text position
  • Color - text color

General Typography

In this section you will be able to set global fonts for site body, headings etc.

  1. Site Base Typography (Body)
    Base typography for body that will affect all elements that haven't specified typography style.
  2. General Heading Typography
    Base typography for heading tags.
  3. H1 Font Size
    Typography for heading 1.
  4. H2 Font Size
    Typography for heading 2.
  5. H3 Font Size
    Typography for heading 3.
  6. H4 Font Size
    Typography for heading 4.
  7. H5 Font Size
    Typography for heading 5.
  8. H6 Font Size
    Typography for heading 6.
     

In this section you will be able to set fonts for main menu.

  1. Main Menu Typography
  2. Main Menu Text Color
  3. Main Menu Hover Text Color
  4. Main Menu Hover Background Color
  5. Main Menu Active Text Color
  6. Main Menu Active Background Color
  7. Main Menu Icon Color
  8. Main Menu Hover Bottom Line Color
  9. Sub Menu Typography
     

Top Menu Typography

  1. Top Menu Typography
  2. Top Menu Hover Text Color 

Mobile Menu Typography

  1. Mobile Menu Typography
  2. Mobile Menu Hover Text Color 
  1. Footer Menu Typography
  2. Footer Menu Hover Text Color 
  3. Footer Menu Hover Background Color
  4. Footer Menu Active Text Color
  5. Footer Menu Active Background Color

Archive Typography

  1. Archive Name Typography 

Post Typography

  1. Post Title
    Typography of post title in single posts.
  2. Post Summary
    Typography for posts summary in single posts.
  3. Posts & Pages Content
    Typography for content of posts and static pages.

Block Typography

  1. Block Title
    Typography for content of block header titles.
  2. Block Tabs
    Typography for content of block header tabs. 

Module Typography

  1. Module: Post Title
    Typography of post title in block posts.
  2. Module: Post Title Hover Color
  3. Module: Post Summary
    Typography of posts summary in block posts.
  4. Module: Post Meta
    Typography of posts meta in block posts.
  5. Module: Post Meta (Author Name)
    Typography of posts author name in post meta. 

Custom Fonts

As soon as you add a custom font, it will add to font family list. The way to adding through Font Manager. In theme panel go to Newsy → Custom Fonts.

As you see in above image there are several tabs in Font Manager and we are going to describe them one by one.

Custom Fonts

This is exactly the same as Add New Custom Font in Typography described above.

  1. Click "Add More" button.
  2. Here Select a name for new font.
  3. Now upload and select font files in each field according to their format. Different browsers support different formats.
  4. Save Changes.

Font Stacks

Web safe fonts are fonts that are pre-installed by many operating systems. While not all systems have the same fonts installed, you can use a web safe font stack to choose several fonts that look similar, and are installed on the various systems that you want to support.

You can simply add new font stack as following steps.

  1. At the bottom of the page click on Add New Font Stack.
  2. New Font Stack will be added. Write main font name in Font Name, and write similar fonts name in Font Stack.
  3. If the name of a font family is more than one word, it must be in quotation marks, like: “Times New Roman”.
  4. It’s done and you can select new Font Stack as font-family in Typography.

 

 

Content