GavernWP allows to access a lot of additional typography elements created with Shortcodes use. The use is very simple thanks to an additional button in a posts editor. A typography description from a programistic side has been divided into two parts, namely: front-end and back-end.

Below, there are all elements available in theme’s typography. Typography elements can be divided into three main groups:

• typography elements,
• interactive elements,
• elements prepared especially for a particular theme.

Warnings / Infos / Notices / Errors

These elements are used for highlighting text fragments together with their importance / type of information by using appropriate colors.

Warning text example using Shortcodes

Info text example using Shortcodes

Notice text example using Shortcodes

Error text example using Shortcodes

Labels

Labels are useful for marking the importance of the text fragment or a word given. In the case of longer texts, we recommend to use elements from Warnings / Infos / Notices group.

This is a paragraph with the labeled text using the first style.

This is a paragraph with the labeled text using the second style.

This is a paragraph with the labeled text using the third style.

This is a paragraph with the labeled text using the fourth style.

This is a paragraph with the labeled text using the fifth style.

This is a paragraph with the labeled text using the sixth style.

Badges

Badges in their look are similar to Labels, however, you may use them mainly for highlighting shorter texts, e.g. numerical values.

This is a paragraph with the badge 12 using the first style.

This is a paragraph with the badge 12 using the second style.

This is a paragraph with the badge 12 using the third style.

This is a paragraph with the badge 12 using the fourth style.

This is a paragraph with the badge 12 using the fifth style.

This is a paragraph with the badge 12 using the sixth style.

Code listings

We recommend to use an element creating code listings in one out of three styles available for presenting source codes:

function helloWorld() {
alert('Hello World!');
}

function helloWorld() {
alert('Hello World!');
}

function helloWorld() {
alert('Hello World!');
}

Text blocks

Text blocks are useful for generating an element highlighting a particular part of an  entry:

01Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

02Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

03Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

04Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. 

Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. 

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam id dolor id nibh ultricies vehicula ut id elit. 

Quote and Citations

Quotes elements are useful for highlighting the author of a sentence given:

The content of the quote in style 1

Author

The content of the quote in style 2

Author

The content of the quote in style 3

Author

The content of the quote in style 4

Author

The content of the quote in style 5

Author

Dropcap

Elements creating the first letter highlighted:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo.

Lists

Ordered and unordered lists:

Buttons

Buttons in many different variations:

Your text Your text Your text Your text Your text Your text Your text

Legends

Elements with legend useful while creating text blocks in a frame provided with an appropriate title.

Raw text

An element useful for generating text without formatting:

Your text

Tooltips

Tooltips may occur in two forms: a link to a different website with a tooltip or a text connected with the text:

Other typography elements

Elements which could not be groupped to other categories.

Columns allow to place text in multicolumn layout:

Toggle text – elements useful for creating blocks with text to toggle:

Shortcode pageurl allows to place an address to a blog:

A link to a RSS channel:

A link to a PDF document:

A private note in an entry, visible for an author only:

Mail illegible for bots creating data bases for spammers:

Content visible for logged in users only:

Related posts:

1. Typography button
2. Widget rules
3. Custom Page Styles
4. Threaded comments
5. Theme CSS