Blot – Full Content Display

Shortcodes makes your pages unique!

This page provides instructions for setting up shortcodes and using them to give pages and posts a special look and feel.

1. Flat Buttons


Button sizes
Small ButtonMedium
Large

Button styles
Inline Inline
Block

Basic usage

Inserting this shortcode into a post or page will generate this button:
[tw_button url="http://www.tripwiremagazine.com"]Button Text[/tw_button]

Advanced usage

The shortcode also offers more features as shown below.
[tw_button color="blue" url="http://www.tripwiremagazine.com" title="themes" icon_left="twitter" target="_blank" size="large" display="block"]Button Text[/tw_button]
Button Text

Attributes:

color, url, title, target, rel, class, icon_left, icon_right, size, display
Available colors:

black, green, blue, red, yellow, pink, purple

Available sizes:

small, medium, large

Available displays:

inline, block

Available icon_left and icon_right:

standard, aside, image, gallery, video, status, quote, link, chat, audio, github, dribble, twitter, facebook, facebook-alt, wordpress, googleplus, linkedin, linkedin-alt, pinterest, pinterest-alt, flickr, vimeo, youtube, tumblr, instagram, codepen, polldaddy, comment, category, tag, time, user, day, week, month, pinned, search, unzoom, zoom, show, hide, close, close-alt, trash, star, home, mail, edit, reply, feed, warning, share, attachment, location, checkmark, menu, top, minimize, maximize, 404, spam, summary, cloud, key, dot, next, previous, expand, collapse, dropdown, dropdown-left, top, draggable, phone, send-to-phone, plugin, cloud-download, cloud-upload, external, document, book, cog, unapprove, cart, pause, stop, skip-back, skip-ahead, play, tablet, send-to-tablet, info, notice, help, fastforward, rewind, portfolio, uparrow, rightarrow, downarrow, leftarrow

Available rel:

self, blank, target

2. Boxes

Alert Box Text
Alert Box Text
Alert Box Text
Alert Box Text
Alert Box Text
Alert Box Text
Alert Box Text

Basic Usage:

Inserting this shortcode into a post or page will generate this alert box.

[tw_box]Alert Box Text[/tw_box]

Alert Box Text

Advanced Usage:

[tw_box color="green" width="50%" text_align="left" margin_bottom="5px" margin_top="5px"]Lorem ipsum dolor sit amet…[/tw_box]

Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

Attributes:

color, width, text_align, margin_bottom, margin_top, class

Available colors:

black, green, blue, red, yellow, pink, purple

Text align:

left, right, center

3. Icons

shortcode-flat-icons-genericons

 

Icons courtesy of Genericons.

Usage:

[tw_icon type="checkmark"]

Generates:
Availabe Icon Types:

standard, aside, image, gallery, video, status, quote, link, chat, audio, github, dribble, twitter, facebook, facebook-alt, wordpress, googleplus, linkedin, linkedin-alt, pinterest, pinterest-alt, flickr, vimeo, youtube, tumblr, instagram, codepen, polldaddy, comment, category, tag, time, user, day, week, month, pinned, search, unzoom, zoom, show, hide, close, close-alt, trash, star, home, mail, edit, reply, feed, warning, share, attachment, location, checkmark, menu, top, minimize, maximize, 404, spam, summary, cloud, key, dot, next, previous, expand, collapse, dropdown, dropdown-left, top, draggable, phone, send-to-phone, plugin, cloud-download, cloud-upload, external, document, book, cog, unapprove, cart, pause, stop, skip-back, skip-ahead, play, tablet, send-to-tablet, info, notice, help, fastforward, rewind, portfolio, uparrow, rightarrow, downarrow, leftarrow

4. Highlights

Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

Usage:

[tw_highlight]text to highlight[/tw_highlight]

Generates

text to highlight
Attributes:

color

Available colors:

grey, black, green, blue, red, yellow, pink, purple

Advanced Usage:

[tw_highlight color="green"]text to highlight[/tw_highlight]

text to highlight

5. Dividers

divider

Usage:

[tw_divider]
Generates:


Attributes:

type, color

Available types:

solid, dashed, dotted, double

Available colors:

grey, black, green, blue, red, yellow, pink, purple

Advanced Usage:

[tw_divider type="dashed" color="green"]


6. Grids
Basic Usage:

With grids it is simple to set up pages with special layouts. There is one important point to remember however to make it work… When you are adding your grid shortcodes in the WordPress editor, WordPress will transform all RETURNS into linebreaks and add a
br-tag. This means that if you are not careful all your grids may display in a stair like layout. To fix this, do not RETURN when adding your grid shortcodes to the WordPress editor. For example, this is correct:

[one_half_first]
This is the first column
[/one_half_first][one_half_last]
This is the first column
[/one_half_last]

This is incorrect:

[one_half_first]
This is the first column
[/one_half_first]
[one_half_last]
This is the first column
[/one_half_last]

Notice that there is a RETURN after the [[/one_half_first]]? Simply make sure that your ending and beginning grid shortcodes but directly up against each other, like this:
[/one_half_first][one_half_last]….[/one_half_last]

Six Columns

Usage:

[one_sixth_first]
This is the first column
[/one_sixth_first][one_sixth]
This is the second column
[/one_sixth][one_sixth]
This is the third column
[/one_sixth][one_sixth]
This is the fourth column
[/one_sixth][one_sixth]
This is the fifth column
[/one_sixth][one_sixth_last]
This is the sixth and last column
[/one_sixth_last]

Generates:


This is the first column

This is the second column

This is the third column

This is the fourth column

This is the fifth column

This is the sixth and last column

Four Columns

[one_fourth_first]
This is the first column
[/one_fourth_first][one_fourth]
This is the second column
[/one_fourth][one_fourth]
This is the third column
[/one_fourth][one_fourth_last]
This is the fourth and last column
[/one_fourth_last]

Generates:


This is the first column

This is the second column

This is the third column

This is the fourth and last column

Three Columns

Usage:

[one_third_first]
This is the first column
[/one_third_first][one_third]
This is the second column
[/one_third][one_third_last]
This is the third and last column
[/one_third_last]

Generates:


This is the first column. Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei.Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut.

This is the second column. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

This is the third and last column. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec.

Two Columns

Usage:

[one_half_first]
This is the first column
[/one_half_first][one_half_last]
This is the second and last column
[/one_half_last]

Generates:


This is the first column. Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

This is the second and last column. Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

No sidebar post

city


Option commodo et vel, iriure vivendo no his. Ad officiis conceptam sea. Primis epicuri fierent ut eos, pro causae adipisci quaestio no, ex vide moderatius eum. Usu te summo persequeris, wisi possim adolescens nam ut. Cibo putent conclusionemque vix no, omnes putant vel ei, suavitate evertitur ex mei.

Te duo esse ludus consulatu, duo omnium menandri at. Gubergren definitiones eam an. Accusam fastidii no quo, sit indoctum percipitur id, etiam utroque incorrupte eu est. Prompta gubergren sea ei, ex mei tantas suscipit atomorum, ea qui dissentias neglegentur. Simul verterem vix ea. Paulo molestie pertinax pri ut, albucius placerat mediocrem sea ad.

Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

no-sidebar

One column post

Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

green


Option commodo et vel, iriure vivendo no his. Ad officiis conceptam sea. Primis epicuri fierent ut eos, pro causae adipisci quaestio no, ex vide moderatius eum. Usu te summo persequeris, wisi possim adolescens nam ut. Cibo putent conclusionemque vix no, omnes putant vel ei, suavitate evertitur ex mei.

Te duo esse ludus consulatu, duo omnium menandri at. Gubergren definitiones eam an. Accusam fastidii no quo, sit indoctum percipitur id, etiam utroque incorrupte eu est. Prompta gubergren sea ei, ex mei tantas suscipit atomorum, ea qui dissentias neglegentur. Simul verterem vix ea. Paulo molestie pertinax pri ut, albucius placerat mediocrem sea ad.

Left sidebar post

grass

Lorem ipsum dolor sit amet, illud tritani maiestatis ex nec, nihil epicurei no eos. Sea appetere petentium et, habemus platonem inciderint his ei. Modus vivendum intellegat per cu, ad vivendo petentium aliquando ius, an verterem volutpat nec. Id dicit prompta vis, euismod voluptatum vim at, mel blandit albucius ponderum ut. Ne dolorum offendit necessitatibus eos, no sed eirmod impedit delectus. Per ne tale apeirian, at sea utinam molestie reformidans.

Te duo esse ludus consulatu, duo omnium menandri at. Gubergren definitiones eam an. Accusam fastidii no quo, sit indoctum percipitur id, etiam utroque incorrupte eu est. Prompta gubergren sea ei, ex mei tantas suscipit atomorum, ea qui dissentias neglegentur. Simul verterem vix ea. Paulo molestie pertinax pri ut, albucius placerat mediocrem sea ad.

Colors the way you like it!

Most aspects of the theme can be adjusted when it comes to colors.

color

You find the setup for colors here:

Appearance –> Customise –>Blogify Main Options.

  • Blogify Header Area (Logo color, menu etx.)
  • Blogify Element Color (Buttons on the site)
  • Blogify Typography Color (links)

Appearance –> Customise –>Colors (for background color)

element-color

Full width post

boat

Te duo esse ludus consulatu, duo omnium menandri at. Gubergren definitiones eam an. Accusam fastidii no quo, sit indoctum percipitur id, etiam utroque incorrupte eu est. Prompta gubergren sea ei, ex mei tantas suscipit atomorum, ea qui dissentias neglegentur. Simul verterem vix ea. Paulo molestie pertinax pri ut, albucius placerat mediocrem sea ad.

Option commodo et vel, iriure vivendo no his. Ad officiis conceptam sea. Primis epicuri fierent ut eos, pro causae adipisci quaestio no, ex vide moderatius eum. Usu te summo persequeris, wisi possim adolescens nam ut. Cibo putent conclusionemque vix no, omnes putant vel ei, suavitate evertitur ex mei.

Great looking featured slider

sliderThe Featured post slider pulls out your important contant and expose it on the front page. The slider is simple to set up and it scales perfecly to fit mobile devices.

The slider is set up using post or page ids and use the Featured Images, the Title and the content for each slide. Configure the slider here:

Appearance –> Customise –> Blogify Featured Slider –> Featured Post/Page Slider Options.

slider-setup