It is possible with templates which have a typography page to show you how you can use e.g. headline tags in order to structure your content in a better way. Below, we present rebuilt and refreshed typographical aspects of Gavern Framework. In order to use it, you have to use a plug in which is delivered in a package with a template or use HTML code.
Heading Styles
This is Heading 1
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper egestas nunc in volutpat. Fusce adipiscing velit ac eros tempor iaculis. Phasellus venenatis mollis augue, non posuere odio placerat in. Etiam volutpat ultrices lectus
This is Heading 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper egestas nunc in volutpat. Fusce adipiscing velit ac eros tempor iaculis. Phasellus venenatis mollis augue, non posuere odio placerat in. Etiam volutpat ultrices lectus
This is Heading 3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper egestas nunc in volutpat. Fusce adipiscing velit ac eros tempor iaculis. Phasellus venenatis mollis augue, non posuere odio placerat in. Etiam volutpat ultrices lectus
This is Heading 4
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper egestas nunc in volutpat. Fusce adipiscing velit ac eros tempor iaculis. Phasellus venenatis mollis augue, non posuere odio placerat in. Etiam volutpat ultrices lectus
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This is a highlight phrase.
Use <span class="highlight">Your highlight phrase goes here!</span>.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This is a highlight phrase.
Use <span class="highlight1">Your highlight phrase goes here!</span>.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This is a highlight phrase.
Use <span class="highlight2">Your highlight phrase goes here!</span>.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
This is a highlight phrase.
Use <span class="highlight3">Your highlight phrase goes here!</span>.
Icon set 1
This is a sample icon1 documentsUse <p class="icon1">Your message goes here!</p>.
This is a sample icon2 documentsUse <p class="icon2">Your message goes here!</p>.
This is a sample icon3 documentsUse <p class="icon3">Your message goes here!</p>.
This is a sample icon4 documentsUse <p class="icon4">Your message goes here!</p>.
This is a sample icon5 documentsUse <p class="icon5">Your message goes here!</p>.
This is a sample icon6 documentsUse <p class="icon6">Your message goes here!</p>.
This is a sample icon7 documentsUse <p class="icon7">Your message goes here!</p>.
This is a sample icon8 documentsUse <p class="icon8">Your message goes here!</p>.
This is a sample icon9 documentsUse <p class="icon9">Your message goes here!</p>.
This is a sample icon10 documentsUse <p class="icon10">Your message goes here!</p>.
This is a sample icon11 documentsUse <p class="icon11">Your message goes here!</p>.
This is a sample icon12 documentsUse <p class="icon12">Your message goes here!</p>.
This is a sample icon13 documentsUse <p class="icon13">Your message goes here!</p>.
This is a sample icon14 documentsUse <p class="icon14">Your message goes here!</p>.
This is a sample icon15 documentsUse <p class="icon15">Your message goes here!</p>.
This is a sample icon16 documentsUse <p class="icon16">Your message goes here!</p>.
This is a sample icon17 documentsUse <p class="icon17">Your message goes here!</p>.
This is a sample icon18 documentsUse <p class="icon18">Your message goes here!</p>.
This is a sample icon19 documentsUse <p class="icon19">Your message goes here!</p>.
This is a sample icon20 documentsUse <p class="icon20">Your message goes here!</p>.
This is a sample icon21 documentsUse <p class="icon21">Your message goes here!</p>.
This is a sample icon22 documentsUse <p class="icon22">Your message goes here!</p>.
This is a sample icon23 documentsUse <p class="icon23">Your message goes here!</p>.
This is a sample icon24 documentsUse <p class="icon24">Your message goes here!</p>.
This is a sample icon25 documentsUse <p class="icon25">Your message goes here!</p>.
This is a sample icon26 documentsUse <p class="icon26">Your message goes here!</p>.
This is a sample icon27 documentsUse <p class="icon27">Your message goes here!</p>.
This is a sample icon28 documentsUse <p class="icon28">Your message goes here!</p>.
This is a sample icon29 documentsUse <p class="icon29">Your message goes here!</p>.
This is a sample icon30 documentsUse <p class="icon30">Your message goes here!</p>.
Unordered lists
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Lorem ipsum dolor sit amet.
Warnings
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer semper egestas nunc in volutpat. Fusce adipiscing velit ac eros tempor iaculis. Phasellus venenatis mollis augue, non posuere odio placerat in. Etiam volutpat ultrices lectus.
This is a sample clip note. Use <p class="box-info">Your clip note goes here!</p> to form a clip note!
This is a sample clip note. Use <p class="box-warning">Your clip note goes here!</p> to form a clip note!
This is a sample clip note. Use <p class="box-stickynote">Your clip note goes here!</p> to form a clip note!
This is a sample clip note. Use <p class="box-upload">Your clip note goes here!</p> to form a clip note!
This is a sample clip note. Use <p class="box-download">Your clip note goes here!</p> to form a clip note!