Typography

Block Quotes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eleifend rhoncus fermentum. Phasellus pretium massa dolor. [blockquote align=”left”] Donec arcu nunc, consectetur nec fringilla vitae, placerat in libero. Curabitur a justo ligula. Mauris vel massa nunc. Aenean quis elit tellus, a suscipit quam.[/blockquote] Vestibulum ut tellus ut velit malesuada consequat vitae in libero. Donec ac quam ultrices nunc sollicitudin laoreet vel eu tellus. Proin suscipit velit tristique orci vestibulum ac commodo neque tincidunt. Nullam nec sem sapien. Nunc ac sapien eros. Vivamus blandit mauris eu massa mattis eu scelerisque massa porta. Nullam pellentesque ipsum non libero hendrerit vitae dapibus est iaculis. Pellentesque habitant morbi tristique senectus

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eleifend rhoncus fermentum. Phasellus pretium massa dolor. [blockquote align=”right”]Donec arcu nunc, consectetur nec fringilla vitae, placerat in libero. Curabitur a justo ligula. Mauris vel massa nunc. Aenean quis elit tellus, a suscipit quam.[/blockquote]Vestibulum ut tellus ut velit malesuada consequat vitae in libero. Donec ac quam ultrices nunc sollicitudin laoreet vel eu tellus. Proin suscipit velit tristique orci vestibulum ac commodo neque tincidunt. Nullam nec sem sapien. Nunc ac sapien eros. Vivamus blandit mauris eu massa mattis eu scelerisque massa porta. Nullam pellentesque ipsum non libero hendrerit vitae dapibus est iaculis. Pellentesque habitant morbi tristique senectus

Nullam pellentesque ipsum non libero hendrerit vitae dapibus est iaculis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque volutpat metus nec libero sagittis commodo eu sit amet magna.

[blockquote cite=”John Deo”]Integer sed dolor tortor. Aenean pretium fringilla tellus sit amet dapibus. Vestibulum mattis adipiscing velit, nec ultrices lacus pulvinar eu. Lorem ipsum dolor sit amet, consectetur adipiscing elit.[/blockquote]

Aenean at consectetur nibh. Morbi mi ligula, condimentum nec hendrerit a, dapibus sed ipsum. Nullam interdum tempor orci vel congue. Nam nec urna nec quam volutpat cursus. Suspendisse volutpat facilisis vehicula.

// cite - Enter author name or company name
// align - Assign blogquote to right or left
[blockquote cite="John Deo" align="right"] Insert your blog quotes text here...
[blockquote]

[divider_top]

Drop Caps Style

[one_half]
Drop Cap Style #1
[dropcap1]A[/dropcap1]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis leo non felis adipiscing cursus. Sed eu accumsan nisl. Nunc vel erat eget augue condimentum vehicula non nec tellus. Maecenas in turpis sit amet erat dictum rutrum. Nulla accumsan, lorem sit amet condimentum dictum, mi eros eleifend dui, ac venenatis magna ipsum tincidunt ligula.
[/one_half] [one_half_last]
Drop Cap Style #2
[dropcap2]A[/dropcap2]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis leo non felis adipiscing cursus. Sed eu accumsan nisl. Nunc vel erat eget augue condimentum vehicula non nec tellus. Maecenas in turpis sit amet erat dictum rutrum. Nulla accumsan, lorem sit amet condimentum dictum, mi eros eleifend dui, ac venenatis magna ipsum tincidunt ligula.
[/one_half_last] [one_half]
Drop Cap Style #3
[dropcap3]A[/dropcap3]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis leo non felis adipiscing cursus. Sed eu accumsan nisl. Nunc vel erat eget augue condimentum vehicula non nec tellus. Maecenas in turpis sit amet erat dictum rutrum. Nulla accumsan, lorem sit amet condimentum dictum, mi eros eleifend dui, ac venenatis magna ipsum tincidunt ligula.
[/one_half] [one_half_last] [/one_half_last]

// Just replace "A" with the letter/number
[dropcap1]A[/dropcap1] [dropcap2]A[/dropcap2] [dropcap3 textcolor="#cb34a4"]A[/dropcap3]

[divider_top]

Highlighting Text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. fermentum. Phasellus pretium massa dolor. [highlight bgcolor=”#ff0000″ textcolor=”#ffffff”]Donec arcu nunc consectetur[/highlight] nec fringilla vitae, placerat in libero. Curabitur a justo ligula. Mauris vel massa nunc. Aenean quis elit tellus a suscipit quam. Vestibulum ut tellus ut velit malesuada consequat vitae in libero. Donec ac quam ultrices nunc sollicitudin laoreet vel eu tellus. Proin suscipit velit tristique orci vestibulum ac commodo neque tincidunt. Nullam nec sem sapien. Nunc ac sapien eros. Vivamus blandit mauris eu massa mattis eu scelerisque massa porta. Nullam pellentesque ipsum non libero hendrerit vitae dapibus est iaculis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Pellentesque volutpat metus nec libero sagittis commodo eu sit amet magna.

// bgcolor - Enter Background Color Code With Using '#' Key
// textcolor - Enter Text Color Code With Using '#' Key
[highlight bgcolor="#ff0000" textcolor="#ffffff"] Insert Your Highlight Text Here
[/highlight]

[divider_top]

Pre and Code

<ul>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
</ul>

<ul>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
<li>Sample HTML Text</li>
</ul>

[divider_top]

List Styled

[one_fourth] [list style=”disc” color=”black”]
  • style = disc
  • style = disc
  • style = disc
[/list] [/one_fourth] [one_fourth] [list style=”circle” color=”red”]
  • style = circle
  • style = circle
  • style = circle
[/list] [/one_fourth] [one_fourth] [list style=”square” color=”green”]
  • style = square
  • style = square
  • style = square
[/list] [/one_fourth] [one_fourth_last] [list style=”arrow1″ color=”blue”]
  • style = arrow1
  • style = arrow1
  • style = arrow1
[/list] [/one_fourth_last] [divider_space] [one_fourth] [list style=”arrow2″ color=”cyan”]
  • style = arrow2
  • style = arrow2
  • style = arrow2
[/list] [/one_fourth] [one_fourth] [list style=”arrow3″ color=”navy”]
  • style = arrow3
  • style = arrow3
  • style = arrow3
[/list] [/one_fourth] [one_fourth] [list style=”arrow4″ color=”pink”]
  • style = arrow4
  • style = arrow4
  • style = arrow4
[/list] [/one_fourth] [one_fourth_last] [list style=”arrow5″ color=”yellow”]
  • style = arrow5
  • style = arrow5
  • style = arrow5
[/list] [/one_fourth_last] [divider_space] [one_fourth] [list style=”bullet1″ color=”orange”]
  • style = bullet1
  • style = bullet1
  • style = bullet1
[/list] [/one_fourth] [one_fourth] [list style=”bullet2″ color=”magenta”]
  • style = bullet2
  • style = bullet2
  • style = bullet2
[/list] [/one_fourth] [one_fourth] [list style=”bullet3″ color=”black”]
  • style = bullet3
  • style = bullet3
  • style = bullet3
[/list] [/one_fourth] [one_fourth_last] [list style=”bullet4″ color=”red”]
  • style = bullet4
  • style = bullet4
  • style = bullet4
[/list] [/one_fourth_last] [divider_space] [one_fourth] [list style=”bullet5″ color=”green”]
  • style = bullet5
  • style = bullet5
  • style = bullet5
[/list] [/one_fourth] [one_fourth] [list style=”star1″ color=”blue”]
  • style = star1
  • style = star1
  • style = star1
[/list] [/one_fourth] [one_fourth] [list style=”star2″ color=”cyan”]
  • style = star2
  • style = star2
  • style = star2
[/list] [/one_fourth] [one_fourth_last] [list style=”star3″ color=”navy”]
  • style = star3
  • style = star3
  • style = star3
[/list] [/one_fourth_last] [divider_space] [one_fourth] [list style=”plus” color=”yellow”]
  • style = plus
  • style = plus
  • style = plus
[/list] [/one_fourth] [one_fourth] [list style=”minus” color=”pink”]
  • style = minus
  • style = minus
  • style = minus
[/list] [/one_fourth] [one_fourth] [list style=”pointer” color=”orange”]
  • style = pointer
  • style = pointer
  • style = pointer
[/list] [/one_fourth] [one_fourth_last] [list style=”style1″ color=”magenta”]
  • style = style1
  • style = style1
  • style = style1
[/list] [/one_fourth_last] [divider_space] [one_fourth] [list style=”check” color=”black”]
  • style = check
  • style = check
  • style = check
[/list] [/one_fourth] [one_fourth] [/one_fourth] [one_fourth] [/one_fourth] [one_fourth_last] [/one_fourth_last]// style - Select the style as display above
// color - Select the color as display above
[list style="star" color="blue"] <ul>
<li>style = star</li>
<li>style = star</li>
<li>style = star</li>
</ul>
[/list]

[divider_top]

Tables

[fancytable align=”left” width=”90%”]
Header 1 Header 2 Header 3 Header 4 Header 5
The foot text for this table
Division Division Division Division Division
Division Division Division Division Division
Division Division Division Division Division
Division Division Division Division Division
Division Division Division Division Division
[/fancytable] [clear]
[fancytable align="left" width="90%"] <table>
<thead>
<tr>
<th scope="col">Header 1</th>
<th scope="col">Header 2</th>
<th scope="col">Header 3</th>
<th scope="col">Header 4</th>
<th scope="col">Header 5</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="5"><em>The foot text for this table</em></td>
</tr> </tfoot> <tr> <td>Division</td>
<td>Division</td> <td>Division</td>
<td>Division</td> <td>Division</td>
</tr>
<tr>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
</tr>
<tr>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
</tr>
<tr>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
</tr>
<tr>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
<td>Division</td>
</tr>
<tfoot>
</table>
[/fancytable]