Shortcodes & Typography

[lead]This is a sample of the typographic styles used in our theme. This introductory text is emphasized using the [lead] shortcode tag. In the journalism industry, particularly in the United States the term “lead” is spelled “lede”. Journalistic ledes emphasize grabbing the attention of the reader. In journalism, the failure to mention the most important, interesting or attention-grabbing elements of a story in the first paragraph is sometimes called burying the lede, which is discouraged with the catch phrase “Don’t bury the lede”.[/lead]

Heading 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem.Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit.Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum.  Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada.[blockquote size=”half” align=”right” byline=”- Blockquote Shortcode”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. [/blockquote]Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit.

Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem.Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem.Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis.

Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit.Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum.  Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit.

Heading 3

[highlight]Use the [highlight] shortcode tag to highlight text like this[/highlight]. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.

Heading 4

This is a link. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.

Heading 5

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.

Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.

[hr style=”dots”]

 

[columns]

[column size=”third” last=”no”]

Unordered list

  • Unordered item
  • Unordered item
    • Unordered item
    • Unordered item
      • Unordered item
      • Unordered item
  • Unordered item
  • Unordered item

[/column]

[column size=”third” last=”no”]

Ordered list

  1. Ordered item
  2. Ordered item
    1. Ordered item
    2. Ordered item
      1. Ordered item
      2. Ordered item
  3. Ordered item
  4. Ordered item

[/column]

[column size=”third” last=”yes”]

Message boxes

[message type=”success”]Succes message[/message]

[message type=”error”]Error message[/message]

[message type=”info”]Info message[/message]

[message type=”notice”]Notice message[/message]

[/column]

[/columns]

 

[hr style=”dots”]

 

Column  examples

[columns]

[column size=”half” last=”no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.[/column]
[column size=”half” last=”yes”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.[/column]

[/columns]

 

[columns]

[column size=”third” last=”no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. [/column]
[column size=”third” last=”no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. [/column]
[column size=”third” last=”yes”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus.[/column]

[/columns]

 

[columns]

[column size=”fourth” last=”no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu.[/column]
[column size=”three-fourths” last=”yes”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien. Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.Nullam vitae dui eu nisi luctus malesuada. Phasellus semper venenatis odio, quis ultricies erat accumsan sit amet. Vestibulum dictum iaculis accumsan.[/column]

[/columns]

 

[hr style=”dots”]

Code styling using <PRE> tag

	.wp-caption {
		margin: 0;
		border: none;
		max-width: 100%;
	}

[hr style=”dots”]

Toggles & Buttons

[columns]

[column size=”third” last=”no”]

[toggles]

[toggle title=”Toggle Button 1″ active=”yes”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/toggle]
[toggle title=”Toggle Button 2″ active=”yes|no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/toggle]
[toggle title=”Toggle Button 3″ active=”yes|no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/toggle]

[/toggles]

 

[/column]
[column size=”third” last=”no”]

[accordions]

[accordion title=”Accordion Button 1″ active=”yes”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/accordion]
[accordion title=”Accordion Button 2″ active=”yes|no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/accordion]
[accordion title=”Accordion Button 3″ active=”yes|no”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue. Praesent ut placerat sem. Maecenas ac lacus arcu. Vestibulum varius feugiat lectus, ut tincidunt quam placerat quis. Morbi sit amet urna a sapien commodo dictum. Nunc congue magna quis eleifend suscipit. Praesent efficitur placerat lacus. Nam quis quam id ex commodo dictum. Maecenas vitae eros a diam tincidunt varius a vel sapien.[/accordion]

[/accordions]

[/column]

[column size=”third” last=”yes”]

[button url=”url” size=”xsmall”]XSMALL[/button]

[button url=”url” size=”small”]SMALL[/button]

[button url=”url” size=”normal”]NORMAL[/button]

[button url=”url” size=”large”]LARGE[/button]

[button url=”url” size=”xlarge”]XLARGE[/button]

[/column]

[/columns]

[hr style=”dots”]

[quote_slider]
[quote_slide byline=”Someone Famous”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam suscipit est et risus vulputate suscipit.[/quote_slide]
[quote_slide byline=”Someone Else”]Nam suscipit est et risus vulputate suscipit. Pellentesque vel lacus sit amet felis placerat laoreet ac quis augue.[/quote_slide]

[/quote_slider]

[hr style=”dots”]

Graphs

[graphs]

[graph percentage=”30″ color=”#edd55a”]Style[/graph]

[graph percentage=”50″ color=”#edd55a”]Colour[/graph]

[graph percentage=”70″ color=”#edd55a”]Trend[/graph]

[/graphs]

No Comment

Leave a Reply