Shortcodes

Introduction

Included in the WooFramework is a few custom shortcodes that you can use in all our themes. Shortcodes work in posts, pages and even widgets. For extensive overview on all available shortcodes and usage you can check out the WooCodex.

Buttons

These CSS3 buttons look amazing in all modern browsers, and although they won’t look as amazing, they will still work in older browsers.

Colored Buttons
3212
Button

Button Button Button Button Button Button Button Button

Small and Large Buttons

Button Button Button Button

Icons Buttons

Button Button Button Button Button

Custom Button

Button

Info Boxes

Info boxes are nice to use if you need to inform your site visitors of something in a more visual manner.

This is an info box
This is a note box
is is a tick box
This is an download box
This is an alert box

With this shortcode you can easily show related posts by tag. This only works on posts which have tags that exist on other posts.

Social Buttons

Social Icons

Horizontal Rule

You can easily break up your text on a page or post by adding either a horizontal rule or a divider (same as hr only no border).

Columns

Columns are an easy way to style your post or page with multiple columns, from two columns to six columns. You can make columns span more one column to mix column widths also.

Two columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Two columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Three columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Three columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Three columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Three columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Three columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Four columns
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

fivecol_two
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

fivcol_one
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

fivecol_two_last
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

sixcol_one
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

sixcol_two
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

sixcol_three_last
Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Quote

Add a styled quote to your page or post and float it left or right with or without box.

Pellentesque risus diam vestibulum phasellus, aliquam vivamus, tempus urna habitant tempus a et, aliquam maecenas molestie nullam.

Icon Link

Add a styled link with an icon

You can go ahead and Download

Custom Link

You can add custom styled lists using Fontawesome

  • Bulleted lists (like this one)
  • Buttons
  • Button groups
  • Navigation
  • Prepended form inputs
  • …and many more with custom CSS

Typography

This is an example of a WordPress page, you could edit this to put information about yourself or your site so readers know where you are coming from. You can create as many pages like this one or sub-pages as you like and manage all of your content inside of WordPress.

Tabbed Content

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Another Tab content goes here.

Last Tab content goes here.

Content Toggle

Show the Content

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.