Shortcodes

Custom Image Frame with Left Alignment

ImageUt tellus dolor, dapibus eget, elementum vel, cursus eleifend, elit. Aenean auctor wisi et urna. Aliquam erat volutpat. Duis ac turpis. Integer rutrum ante eu lacus.Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla. Donec porta diam eu massa.

Donec in velit vel ipsum auctor pulvinar. Vestibulum iaculis lacinia est. Proin dictum elementum velit. Fusce euismod consequat ante. Lorem ipsum dolor sit amet, consectetuer adipisMauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in,auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium.

<img src="your image src" alt="" class="wrap_me align_left" />

Custom Image Frame with Right Alignment

ImageUt tellus dolor, dapibus eget, elementum vel, cursus eleifend, elit. Aenean auctor wisi et urna. Aliquam erat volutpat. Duis ac turpis. Integer rutrum ante eu lacus.Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla. Donec porta diam eu massa.

Donec in velit vel ipsum auctor pulvinar. Vestibulum iaculis lacinia est. Proin dictum elementum velit. Fusce euismod consequat ante. Lorem ipsum dolor sit amet, consectetuer adipisMauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in,auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium

<img src="your image src" alt="" class="wrap_me align_right" />

Pullquote & Blockquote Styles

"Duis ac turpis. Integer rutrum ante eu lacus. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi."

Ut tellus dolor, dapibus eget, elementum vel, cursus eleifend, elit. Aenean auctor wisi et urna. Aliquam erat volutpat. Duis ac turpis. Integer rutrum ante eu lacus.Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi. Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla. Donec porta diam eu massa. Donec in velit vel ipsum auctor pulvinar. Vestibulum iaculis lacinia est. Proin dictum elementum velit. Fusce euismod consequat ante. Lorem ipsum dolor sit amet, consectetuer adipis. Mauris accumsan nulla vel diam. Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in,auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium.

"Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna, endrerit sit amet, tincidunt ac, viverra sed, nulla. Donec porta diam eu massa. Quisque diam lorem, interdum vitae,dapibus ac, scelerisque vitae, pede. Donec eget tellus non erat lacinia fermentum."
"Duis ac turpis. Integer rutrum ante eu lacus. Vestibulum libero nisl, porta vel, scelerisque eget, malesuada at, neque. Vivamus eget nibh. Etiam cursus leo vel metus. Nulla facilisi."

Sed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in,auctor ut, ligula. Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur,

<blockquote> your quote </blockquote>
<blockquote class="block align_left"> your block quote with align class </blockquote>

Buttons

Small button

Small button with arrow

Middle button

Middle button with arrow

Big button

Big button with arrow

<a href="#" class="button button_small">Small button</a>
<a href="#" class="button button_small button_arrow">Small button with arrow</a>
<a href="#" class="button button_middle">Middle button</a>
<a href="#" class="button button_middle button_arrow">Middle button with arrow</a>
<a href="#" class="button button_big">Big button</a>
<a href="#" class="button button_big button_arrow">Big button with arrow</a>

Message Box Styles

Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem.
<div class="message message_info">Message</div>
<div class="message message_notice">Message</div>
<div class="message message_success">Message</div>
<div class="message message_like">Message</div>
<div class="message message_added">Message</div>
<div class="message message_error">Message</div>

Tabs

<div class="tabs">
<ul>
<li><a href="#title_1">Title 1</a></li>
<li><a href="#title_2">Title 2</a></li>
</ul>
<div id="title_1" class="content"> Text 1 </div>
<div id="title_2" class="content"> Text 2 </div>
</div>

Accordion

Title 1

ImageSed in lacus ut enim adipiscing aliquet. Nulla venenatis. In pede mi, aliquet sit amet, euismod in,auctor ut.
Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet,nsectetur, adipisci velit, sed quia non

Title 2

Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet,nsectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut

Title 3

Duis ac turpis. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris fermentum dictum magna. Sed laoreet aliquam leo ut tellus dolor.

Title 4

ImageDuis ac turpis. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris fermentum dictum magna. Sed laoreet aliquam leo ut tellus dolor.

<div class="accordions">
<h4>Title 1</h4>
<div>
<p>Text 1</p>
</div>
<h4>Title 2</h4>
<div>
<p>Text 2</p>
</div>
</div>

Content Toggle

Etiam cursus leo vel metus

Duis ac turpis. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris fermentum dictum magna. Sed laoreet aliquam leo ut tellus dolor.

Nulla facilisi aenean nec eros

Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus.

Vestibulum ante ipsum primis in faucibus

Aliquam dapibus tincidunt metus. Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam,eaque ipsa quae ab illo inventore veritatis.

Suspendisse sollicitudin velit sed leo

Duis ac turpis. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris fermentum dictum magna. Sed laoreet aliquam leo ut tellus dolor.

Ut pharetra augue nec augue

Duis ac turpis. Donec sit amet eros. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Mauris fermentum dictum magna. Sed laoreet aliquam leo ut tellus dolor.

Nam elit agna, endrerit sit amet tincidunt

Aenean nec eros. Vestibulum ante ipsum primis in faucibus orci luctus.
<div class="toggle">
<h4 class="toggle_title">Title</h4>
<div class="toggle_content">Text</div>
</div>

List Styles & Dropcaps

  • List item one
  • List item two
  • List item three
  • List item four
<ul class="list_triangle">
<li>item 1</li>
<li>item 2</li>
</ul>

  • List item one
  • List item two
  • List item three
  • List item four
<ul class="list_plus">
<li>item 1</li>
<li>item 2</li>
</ul>

  • List item one
  • List item two
  • List item three
  • List item four
<ul class="list_check">
<li>item 1</li>
<li>item 2</li>
</ul>

 

Praesent justo dolor, lobortis quis, lobortis dignissim, pulvinar ac, lorem. Vestibulum sed ante. Donec sagittis euismod purus. Sed ut perspiciatis unde omnis iste natus error sit voluptatem.

Accusantium doloremque laudantium, totam rem aperiam,eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.

<p class="dropcaps">Text</p>

Table

Header 1 Header 2 Header 3 Header 4
Item 1 Aliquam erat volutpat. Duis ac turpis. Donec sit amet eros. Subtotal: $25.99
Item 2 Lorem ipsum dolor sit amet Discount: $12.45
Item 3 Consecvtetuer adipiscing elit. Mauris fermentum dictum magna. Shipping: $0.87
Item 4 Sed laoreet aliquam leo. Ut tellus dolor, dapibus eget. Total: $189.00
<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Item 2</td>
<td class="total">$189.00</td>
</tr>
</table>