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="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="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="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="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="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="http://imageurl" height="300px" animation="flipInX"]

<h1>ABOUT US</h1>
[share] [/ux_banner]

Banner Grid

[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]

3-column Banner Row

Welcome To SapoMiami.com

SapooMiami.com is the official Sapo Game retailer.distributor,manufacturer and patent holder of the juego de Sapo Game in the USA. Established in October 2001, we strive each day to provide the best service, product and quality.  Our Sapo Game products are authentic and original so that you and your family can enjoy this legendary Sapo game.

Our SapoMiami sales team are happy to introduce this game and welcome your comments about our website, products, services or just to say hello. Thank you in advance for your business and hope to hear from you soon.

[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">ABOUT US </h2>
[/ux_banner] [/col] [/row]

Video 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]

Banner with snow effect

[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]

Banner with glass effect

[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]

Banner with sparkle effect

[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]

Banner with confetti effect

[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]