Boxes + Callouts

Supreme Shortcodes WordPress Plugin Boxes

Boxes Callouts



 Boxes

Boxes and Callouts are a great way to grab your visitor’s eye and direct them to important content within the post. The Supreme Shortcode Plugin pack comes with 4 box variations (Info, Warning, Success, and Alert), all of which stem from the [st_ box ] shortcode and are adjustable using the type=”” parameter. These boxes and callouts have a fluid width that automatically adjusts the the size of its parent element.

 

  • Easy to use with Perfect Design
  • Supreme Boxes with 4 Types (InfoWarningSuccess, and Alert)
  • 12 Different Boxes Sizes
  • Flat Colours + Cool Icons

 

Info

Heads up!

This alert needs your attention, but it’s not super important.

[st_box title=”Info Title” type=”info”]Info Text[/st_box]

Success

Well done!

You successfully read this important alert message.

[st_box title=”Well done!” type=”success”]You successfully read this important alert message.[/st_box]

Warning

Warning!

Best check yo self, you’re not looking too good.

[st_box title=”Warning title” type=”warning”]Warning Text[/st_box]

Alert

Oh snap!

Change a few things up and try submitting again.

[st_box title=”Alert Title” type=”error”]Alert Text[/st_box]

 

 Customization Options

  



 

 Callouts – Call To Action


Awsome Teasers & Callouts

Perfect Flat Design, Easy to use, Use Nested Shortcodes, Aswell as Icons…


[st_callout title=”Title” button_text=”Button text” link=”Button link”]Text[/st_callout]

 Customization Options




Custom Call To Action Examples



Come Visit Us!

Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero.
Proin vitae feugiat ante. In semper dignissim rutrum. Vestibulum ante ipsum primis
in faucibus orci luctus et ultrices posuere cubilia Curae Ut vitae nulla in dui ullamcorper.

Find Out More

 

[st_section_color color=’#999′ padding=’50’]
[st_text_color color=’#ffffff’]Come Visit Us![/st_text_color]
[st_text_color color=’#ffffff’]Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero.
Proin vitae feugiat ante. In semper dignissim rutrum. Vestibulum ante ipsum primis
in faucibus orci luctus et ultrices posuere cubilia Curae Ut vitae nulla in dui ullamcorper.[/st_
text_color]
[st_clear]
[st_break_line]
[st_modal modal_link=”Find Out More” primary_text=”Even More Info” primary_link=”#” modal_title=”More About”]Your Modal Box text goes here..[/st_modal]
[/st_section_color]

 


Another Flat Styled Box!

Play with it a little bit, and add some cool buttons with icons.

 

  Cool Button

 

 

[st_section_color color=’#E74C3C’ padding=’80px’]
[st_break_line]
[st_icon name=’star-half-o’ size=’icon-4′ color=’#ffffff’]
Another Flat Styled Box!
Play with it a little bit, and add some cool buttons with icons.
[st_button text_color=”#ffffff” link=”#” background=”#333333″ size=”large” target=”_self” icon=’rocket’]Cool Button[/st_button]
[/st_section_color]

 


 

Why Use Custom Image Box?

Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero.
Proin vitae feugiat ante. In semper dignissim rutrum. Praesent mi risus,
fringilla et congue a, adipiscing a justo.


 

[st_section_image image_id=’1367′ bg_color=’#ffffff’ type=’scroll’ bg_position=’center center’ repeat=’repeat’ padding=’20’]
[st_icon name=’camera’ size=’icon-4′ color=’#333333′]
[st_break_line]
Why Use Custom Image Box?
Praesent mi risus, fringilla et congue a, adipiscing a justo. Etiam non nulla libero.
Proin vitae feugiat ante. In semper dignissim rutrum. Praesent mi risus,
fringilla et congue a, adipiscing a justo.

[st_break_line]
[st_hover_fill_button text_color=”#333333″ link=”” background=”#ffffff” hover_background=”#333333″ size=”large” target=”_self” icon=”mobile-phone” border_radius=”” hover_direction=”ss-expand-c”] Call To Action[/st_hover_fill_button]
[/st_section_image]