This theme uses tags to get the content just the way you want it. Use it to spice up your website! Below are a couple of examples with instructions on how to use it.

Lines

Shortcode:
[line]

Shortcode:
[linetop]

Columns

Column 2 x 1

Shortcode:
[column size="2x1" title="Column 2 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 2 x 1

Shortcode:
[column size="2x1" last="true" title="Column 2 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 3 x 1

Shortcode:
[column size="3x1" title="Column 3 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 3 x 1

Shortcode:
[column size="3x1" title="Column 3 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 3 x 1

Shortcode:
[column size="3x1" last="true" title="Column 3 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 3 x 2

Shortcode:
[column size="3x2" title="Column 3 x 2"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 3 x 1

Shortcode:
[column size="3x1" last="true" title="Column 3 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique, turpis tortor varius sem, ac porta ipsum est non tortor. Cras tristique, sapien in accumsan tempor.

Column 4 x 1

Shortcode:
[column size="4x1" title="Column 4 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Column 4 x 1

Shortcode:
[column size="4x1" title="Column 4 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Column 4 x 1

Shortcode:
[column size="4x1" title="Column 4 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Column 4 x 1

Shortcode:
[column size="4x1" last="true" title="Column 4 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Column 4 x 3

Shortcode:
[column size="4x3" title="Column 4 x 3"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Column 4 x 1

Shortcode:
[column size="4x1" last="true" title="Column 4 x 1"]
Your content here
[/column]

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Parameters

  • size: 2×1 (half width), 3×1 (one third width), 4×1 (one quarter width)
  • last: true, false (default) – Use this if it’s the last box on a row (to the far right)
  • title: the title of the box (optional)

Text selections

Proin velit nibh, facilisis vel sollicitudin nec, accumsan at elit. Maecenas vulputate mollis erat, quis pulvinar elit suscipit sit amet. Etiam semper mi vitae lectus interdum ultricies. Nulla non faucibus enim. Aliquam erat dolor, lobortis nec vestibulum vitae, feugiat id justo. Ut lacus dolor, commodo et suscipit eu, aliquam vel nisi. Phasellus posuere scelerisque dolor, at dapibus nulla lacinia id. Proin sapien diam, sagittis quis eleifend et, posuere nec dui. Nam tempor tincidunt nibh non mollis. Duis quis rutrum urna. Nullam sit amet sem a nibh sagittis convallis tincidunt nec velit. Pellentesque tristique suscipit lacinia. Praesent a nibh non sem tincidunt ultrices. Nunc tempor purus sit amet lorem accumsan imperdiet. Pellentesque diam urna, dapibus quis dictum at, varius eu felis. Morbi id neque sit amet nulla sodales semper ac sed tellus. Aliquam placerat lectus ut purus tincidunt sit amet consequat mi iaculis. Sed ut velit ac ipsum pharetra elementum.

Shortcode:
[selection] Your content here [/selection]

Buttons

Create a button of any color you want. Simply choose one of the presets, or specify your own.

Magenta Cyan Yellow Black Red Blue Green Purple Orange
Shortcode:
[button title="Magenta" url="#" color="magenta" float="none" top="0" right="0" bottom="0" left="0"]

Parameters

  • url: the link of the button
  • title: the button box title
  • color: the button color. Use hex codes (example: ff0000) or one of the presets: magenta, cyan, yellow, black, red, blue, green, purple, orange
  • float: none (default), left, right. Force the button to the left or right, or leave it where it is.
  • top: amount of space at the top of the button in pixels. Default is ‘0’ (zero).
  • right: amount of space on the right of the button in pixels. Default is ‘0’ (zero).
  • bottom: amount of space at the bottom of the button in pixels. Default is ‘0’ (zero).
  • left: amount of space on the left of the button in pixels. Default is ‘0’ (zero).

Toggle content

Click to show/hide this content

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Click to show/hide this content

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem. Morbi suscipit augue id risus egestas a imperdiet augue mattis. Suspendisse potenti. Donec varius, turpis sit amet interdum tristique.

Shortcode:
[toggle title="Click to show/hide this content" fold="false"]
Your content here
[/toggle]

Parameters

  • title: the title of the toggled content
  • fold: true (default), false – Hide or show the toggled content

Message box

Communicate different important messages to the reader with the styled boxes below.

Info

Info message:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem.
Shortcode:
[message type="info" title="Info message:"]
Your content here
[/message]

Notice

Notice message:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem.
Shortcode:
[message type="notice" title="Notice message:"]
Your content here
[/message]

Succes

Succes message:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem.
Shortcode:
[message type="succes" title="Succes message:"]
Your content here
[/message]

Error

Error message:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec justo sem.
Shortcode:
[message type="error" title="Error message:"]
Your content here
[/message]

Parameters

  • type: info (default), notice, succes or error
  • title: the message box title (optional)

Google maps

Place a google map on your page. There is also a google maps widget available, but for whenever you need it, this shortcode is there for you 🙂



Shortcode:
[maps location="5185 18th Street, Bettendorf, IA" zoom="12" popup="no" width="100%" height="400px"]

Parameters

  • location: the place you want on the map
  • zoom: the zoom level of the map (1-22)
  • popup: yes, no (default)display the adres in a popup
  • width: use either pixels or percentages. Default: 100%
  • height: use either pixels or percentages. Default: 400px