Brizy comes with some features to allow you to work smartly and more efficiently. One of which is global typography, which allows you to change the typography settings of the elements from a single place. The settings include font family, font size, thickness, line height, and letter spacing. You can use the global typography feature on Brizy elements that have setting options to set typography such as Text, Button, Form, and so on.
How global typography works
Global typography — as well as global color — is the feature offered by Brizy to streamline your workflow. With this feature, you can change the typography settings of several elements at once, from a single place, as long as the elements use the same global typography. Take a look at the screencast below. Notice the heading sections on the two blocks.
As you can see on the screencast above, the typography settings (font size and font family) of the heading elements change in coincide. This can happen as those elements use the same global typography. If you use the same global typography on other elements — be it on the same page or on different pages — the change will also be applied to those elements where the associated global typography is applied.
How to use a global typography in Brizy
Global typography is available on both versions of Brizy (read: Brizy Free vs Pro.). So, whichever the Brizy version you use, you can use this feature.
Brizy itself comes with ten style packs. Each pack consists of global colors and global typographies. You can access the style packs by clicking the Styling menu (the brush icon) on the left panel on the Brizy editor.
After choosing a certain style pack, you can go to the global typography section to use a predefined global topography.
Brizy provides global typographies for the following elements:
- Above title
- Heading 1
- Heading 2
- Heading 3
- Heading 4
- Heading 5
- Heading 6
You can also define you a new global typography if you want it (will be covered later shortly).
To use a certain global typography, first, add an element whereby you want to use the global typography on, say the Text element. Or you can also edit an existing element on the page you are editing.
Replace the default text with your own text. Once done, click the text to show to the settings bar and click the Typography icon on the appearing settings bar.
On the appearing panel, select a global typography on the Typography section. All options here (except the Custom option) are global typographies.
Add (or edit) other elements and redo the steps above to use a global typography.
Editing a global typography
Say you have used a certain global typography on several elements on your website and you want to change the font family on those elements. Since you use a global typography, you only need to make the change once and the change will be applied to all elements where the global element is applied to.
To change a certain setting — say the font family — on a global typography, simply click the Styling menu on the left panel of the Brizy editor. Select a global typography you want to change font family of. On the appearing panel, select a new font family on the font family section. To change the font size, you can simply set the size on the right side of the appearing settings panel.
Adding a new global typography
Brizy allows you to define a new global typography, which is great if you want to use a global typography on a specific element type. To add a new global typography, click the Styling menu on the left panel of Brizy editor. Click the Add New button.
After clicking the Add New button above, you will see a new global typography on the bottom side. You can click the global typography name to replace the default name. To set the font family, font size, thickness, and so on, you can simply do so from the panel that appears after you click the global typography.
The bottom line
Typography is a vital element of web design. Often times, web designers change the typography settings (font family in particular) before they settle with a certain font family. It can be very time consuming to change the typography settings on elements on your website, especially if your website consists of many pages. To solve the issue, Brizy offers global typography to make your job get even easier. You can make use of this feature to make your job be more efficient.