Shortcode – UX Banners

UX Banners are responsive and animated banners.
These banners can be inserted into a UX Slider or into a banner grid.

[ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“500px“ animation=“flipInX“]

DEFAULT BANNER

This is a simple banner with centered text

___

[/ux_banner]



[ux_banner bg=“http://imageurl“ height=“500px“ animation=“flipInX“] <h1>DEFAULT BANNER</h1> <h3>This is a simple banner with centered text. Change text and background easely… </h3> ____ [/ux_banner] [ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“right center“ text_color=“light“ text_width=“40%“]


This Weekend Only


____


FREE SHIPPING


 


ON ALL ORDERS!


____ [button text=“Browse products“ link=“http://“] [/ux_banner]




[ux_banner bg=“http://imageurl“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“right center“ text_color=“dark“ text_width=“40%“]


<h3>This Weekend Only</h3>

____

<h1>FREE SHIPPING</h1>

<h2>ON ALL ORDERS!</h2>

____


[button text=“Browse products“ link=“http://“]


[/ux_banner]


[ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“left center“ text_color=“dark“ text_width=“40%“]


This Weekend Only


____


FREE SHIPPING


ON ALL ORDERS!


____


[button text=“Browse products“ link=“http://“]


[/ux_banner]




[ux_banner bg=“http://imageurl“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“right center“ text_color=“dark“ text_width=“40%“] <h3>This Weekend Only</h3> ____ <h1>FREE SHIPPING</h1> <h2>ON ALL ORDERS!</h2> ____ [button text=“Browse products“ link=“http://“] [/ux_banner] [ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“560px“ link=““ animation=“flipInX“ text_align=“center“ text_pos=“center“ text_color=“light“ text_width=“80%“]


It has Finaly started…


____


HUGE SALE


 


UP TO 70% OFF


____ [button style=“alt-button white“ text=“Shop men“ link=“http://“] [button style=“alt-button white“ text=“Shop women“ link=“http://“] [button style=“alt-button white“ text=“Shop kids“ link=“http://“] [/ux_banner]




[ux_banner bg=“http://imageurl“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“right center“ text_color=“dark“ text_width=“40%“]


<h3 class=“alt-font“>It has Finaly started…</h3>

____

<h1 class=“h-large“>HUGE SALE</h1>

<h1>UP TO 70% OFF</h1>

____


[button style=“alt-button white“ text=“Shop men“ link=“http://“]


[button style=“alt-button white“ text=“Shop women“ link=“http://“]


[button style=“alt-button white“ text=“Shop kids“ link=“http://“]


[/ux_banner]


[ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“560px“ link=““ animation=“flipInX“ text_align=“center“ text_pos=“center“ text_color=“light“ text_width=“80%“ parallax=“3″]


Just An Awesome


____


PARALLAX


BANNER


____


[button style=“alt-button white“ text=“Shop men“ link=“http://“]


[button style=“alt-button white“ text=“Shop women“ link=“http://“]


[button style=“alt-button white“ text=“Shop kids“ link=“http://“]


[/ux_banner]




[ux_banner bg=“http://imageurl“ height=“560px“ link=““ animation=“fadeInLeft“ text_align=“center“ text_pos=“right center“ text_color=“dark“ text_width=“40%“ parallax=“2″] <h3 class=“alt-font“>It has Finaly started…</h3> ____ <h1 class=“h-large“>PARALLAX</h1> <h1>UP TO 70% OFF</h1> ____ [button style=“alt-button white“ text=“Shop men“ link=“http://“] [button style=“alt-button white“ text=“Shop women“ link=“http://“] [button style=“alt-button white“ text=“Shop kids“ link=“http://“] [/ux_banner] [ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“300px“ animation=“flipInX“]


ÜBER UNS


___[share] [/ux_banner]




[ux_banner bg=“http://imageurl“ height=“300px“ animation=“flipInX“]


<h1>ÜBER UNS</h1>

___[share]


[/ux_banner]


[title text=“Banner Grid“]


[block id=“banner-grid-style“]




[ux_banner_grid] [col span=“6″] [ux_banner height=“600px“ bg=““] [/ux_banner] [/col] [col span=“3″] [ux_banner height=“600px“ bg=““] [/ux_banner] [/col] [col span=“3″] [ux_banner height=“292px“ bg=““] [/ux_banner] [/col] [col span=“3″] [ux_banner height=“292px“ bg=““] [/ux_banner] [/col] [/ux_banner_grid] [title text=“3-column Banner Row“] [block id=“banner-row-3-column-zoom-effect“]




[row]


[col span=1/3]


[ux_banner link=“http://localhost:8888/test/blog/“ bg=“http://imageurl“ hover=“zoom“ height=“160px“]


<h2 class=“uppercase“>Weekly Giveaway</h2>

___


[/ux_banner]


[/col]


[col span=1/3]


[ux_banner link=“http://localhost:8888/test/blog/“ bg=“http://imageurl“ hover=“zoom“ height=“160px“]


<h2 class=“uppercase“>Join our competition</h2>

___


[/ux_banner]


[/col]


[col span=1/3]


[ux_banner link=“http://localhost:8888/test/pages/about-us/“ bg=“http://imageurl“ hover=“zoom“ height=“160px“]


<h2 class=“uppercase“>ÜBER UNS </h2>

___


[/ux_banner]


[/col]


[/row]


[title text=“Video banner“]


[ux_banner bg=“#000″ video_mp4=“http://localhost:8888/test/wp-content/uploads/sites/2/2013/12/My-Movie-Medium.mov“ height=“600px“ link=““ animation=“fadeInRight“ text_align=“left“ text_pos=“left center“ text_color=“light“ text_width=“40%“]


Summer coming…


____


THIS IS AN AWESOME VIDEO BANNER


____

[button text=“Shop men“ link=“http://localhost:8888/test/product-category/men/“]


[button text=“Shop women“ link=“http://localhost:8888/test/product-category/women/“]


[/ux_banner]




[ux_banner bg=“#000″ video_mp4=“http://videourl.mp4″ video_ogg=““ height=“600px“ link=““ animation=“fadeInRight“ text_align=“left“ text_pos=“left center“ text_color=“light“ text_width=“40%“] <h3 class=“alt-font“>Summer coming…</h3> ____ <h1>THIS IS AN AWESOME VIDEO BANNER</h1> ____ [button text=“Shop men“ link=“http://localhost:8888/test/product-category/men/“] [button text=“Shop women“ link=“http://localhost:8888/test/product-category/women/“] [/ux_banner] [title text=“Banner with snow effect“] [ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“500px“ animation=“flipInX“ effect=“snow“]


DEFAULT BANNER


 


This is a simple banner with centered text


___ [/ux_banner]




[ux_banner bg=“http://imageurl“ height=“500px“ animation=“flipInX“ effect=“snow“]


<h1>DEFAULT BANNER</h1>

<h3>This is a simple banner with centered text. Change text and background easely… </h3>

____


[/ux_banner]


[title text=“Banner with glass effect“]


[ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“500px“ animation=“flipInX“ effect=“sliding-glass“]


DEFAULT BANNER


This is a simple banner with centered text


___


[/ux_banner]




[ux_banner bg=“http://imageurl“ height=“500px“ animation=“flipInX“ effect=“sliding-glass“] <h1>DEFAULT BANNER</h1> <h3>This is a simple banner with centered text. Change text and background easely… </h3> ____ [/ux_banner] [title text=“Banner with sparkle effect“] [ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“500px“ animation=“flipInX“ effect=“sparkle“]


DEFAULT BANNER


 


This is a simple banner with centered text


___ [/ux_banner]




[ux_banner bg=“http://imageurl“ height=“500px“ animation=“flipInX“ effect=“sparkle“]


<h1>DEFAULT BANNER</h1>

<h3>This is a simple banner with centered text. Change text and background easely… </h3>

____


[/ux_banner]


[title text=“Banner with confetti effect“]


[ux_banner bg=“https://tinkelbell.de/wp-content/uploads/2013/08/dummy.gif“ height=“500px“ animation=“flipInX“ effect=“confetti“]


DEFAULT BANNER


This is a simple banner with centered text


___


[/ux_banner]




[ux_banner bg=“http://imageurl“ height=“500px“ animation=“flipInX“ effect=“confetti“]


<h1>DEFAULT BANNER</h1>

<h3>This is a simple banner with centered text. Change text and background easely… </h3>

____


[/ux_banner]