Boxes

[heading]Box Style 1[/heading]

[column size=”1/2″]

[box style=”1″ background=”true”]

Heading element

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

[button link=”#”]Button[/button]

[/box]

[pre][[box style=”1″]
CONTENT GOES HERE
[/box]][/pre]

[/column]

[column size=”1/2″ last=”true”]

[box style=”1″ border=”false” background=”orange” color=”white”]

Heading element

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

[button link=”#” color=”transparent”]Button[/button]

[/box]

[pre][[box style=”1″ border=”false” background=”orange” color=”white”]
CONTENT GOES HERE
[/box]][/pre]

[/column]

[heading]Box Style 2[/heading]

[column size=”1/2″]

[box style=”2″ border=”true” background=”true” color=”black”]

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

[/box]

[pre][[box style=”2″]
CONTENT GOES HERE
[/box]][/pre]

[/column]

[column size=”1/2″ last=”true”]

[box style=”2″ border=”true” background=”blue” color=”white”]

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

[/box]

[pre][[box style=”2″ background=”blue” color=”white”]
CONTENT GOES HERE
[/box]][/pre]

[/column]

[spacer /]

[heading]Box with image[/heading]

[column size=”1/3″]

[box border=”true” style=”2″ image=”http://withemes.net/sonata/wp-content/uploads/2014/03/cart.png”]

1. Online Purchase

Suspendisse porttitor faucibus nunc, quis accumsan arcu posuere vel.

[/box]

[/column]

[column size=”1/3″]

[box border=”true” style=”2″ image=”http://withemes.net/sonata/wp-content/uploads/2014/03/paypal.png”]

2. Check out and Pay

Suspendisse porttitor faucibus nunc, quis accumsan arcu posuere vel.

[/box]

[/column]

[column size=”1/3″ last=”true”]

[box style=”2″ background=”primary” color=”white” image=”http://withemes.net/sonata/wp-content/uploads/2014/03/check.png”]

3. Complete

Suspendisse porttitor faucibus nunc, quis accumsan arcu posuere vel.

[/box]

[/column]

[spacer /]

[pre][[column size=”1/3″]
[box border=”true” style=”2″ image=”http://withemes.net/sonata/wp-content/uploads/2014/03/cart.png”]
CONTENT HERE
[/box]
[/column]]
[[column size=”1/3″]
[box border=”true” style=”2″ image=”http://withemes.net/sonata/wp-content/uploads/2014/03/paypal.png”]
CONTENT HERE
[/box]
[/column]]
[[column size=”1/3″ last=”true”]
[box style=”2″ background=”primary” color=”white” image=”http://withemes.net/sonata/wp-content/uploads/2014/03/check.png”]
CONTENT HERE
[/box]
[/column]][/pre]

[hr /]

Usage

Here’re parameters of this shortcode:

[list type=”plus”]

  • style: 1 or 2. Default is 1.
  • border: true or false. Default is true.
  • background: the background color, it can be red, blue, color or a color code such as #12dada. Default: none.
  • color: text color, it can be black, white or some color you wish.
  • image: image url of the image you want to use.

[/list]

Leave a Reply

Your email address will not be published. Required fields are marked *