{"id":458,"date":"2013-08-11T15:29:21","date_gmt":"2013-08-11T15:29:21","guid":{"rendered":"http:\/\/localhost:8888\/test\/?page_id=458"},"modified":"2013-08-11T15:29:21","modified_gmt":"2013-08-11T15:29:21","slug":"shortcode-banners","status":"publish","type":"page","link":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/","title":{"rendered":"Shortcode &#8211; UX Banners"},"content":{"rendered":"<p class=\"lead text-center\">\nUX Banners are responsive and animated banners.<br \/>\nThese banners can be inserted into a <a href=\"#\">UX Slider<\/a> or into a <a href=\"#\">banner grid<\/a>.<\/p>\n   <div id=\"banner_883632048\" class=\"ux_banner dark     \"  style=\"height:500px; background-color:#333\" data-height=\"500px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>DEFAULT BANNER<\/h1>\n<h3>This is a simple banner with centered text<\/h3>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\"]\n\n&lt;h1>DEFAULT BANNER&lt;\/h1>\n&lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3>\n____\n&#091;\/ux_banner]<\/pre>\n   <div id=\"banner_495966655\" class=\"ux_banner dark     \"  style=\"height:560px; background-color:#333\" data-height=\"560px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner right center text-center \"  style=\"width:40%;\">\n            <div class=\"inner-wrap animated fadeInLeft\" style=\" \">\n              <h3>This Weekend Only<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1>FREE SHIPPING<\/h1>\n<h2>ON ALL ORDERS!<\/h2>\n<div class=\"tx-div medium\"><\/div>\n<a href=\"http:\/\/\" class=\"button  \" >Browse products<\/a>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner  bg=\"http:\/\/imageurl\" height=\"560px\" link=\"\" animation=\"fadeInLeft\" text_align=\"center\" text_pos=\"right center\" text_color=\"dark\" text_width=\"40%\"]\n\n&lt;h3>This Weekend Only&lt;\/h3>\n____\n&lt;h1>FREE SHIPPING&lt;\/h1>\n&lt;h2>ON ALL ORDERS!&lt;\/h2>\n____\n\n&#091;button text='Browse products' link='http:\/\/']\n\n&#091;\/ux_banner]<\/pre>\n   <div id=\"banner_358708056\" class=\"ux_banner light     \"  style=\"height:560px; background-color:#333\" data-height=\"560px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner left center text-center \"  style=\"width:40%;\">\n            <div class=\"inner-wrap animated fadeInLeft\" style=\" \">\n              <h3>This Weekend Only<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1>FREE SHIPPING<\/h1>\n<h2>ON ALL ORDERS!<\/h2>\n<div class=\"tx-div medium\"><\/div>\n<a href=\"http:\/\/\" class=\"button  \" >Browse products<\/a>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner  bg=\"http:\/\/imageurl\" height=\"560px\" link=\"\" animation=\"fadeInLeft\" text_align=\"center\" text_pos=\"right center\" text_color=\"dark\" text_width=\"40%\"]\n\n&lt;h3>This Weekend Only&lt;\/h3>\n____\n&lt;h1>FREE SHIPPING&lt;\/h1>\n&lt;h2>ON ALL ORDERS!&lt;\/h2>\n____\n\n&#091;button text='Browse products' link='http:\/\/']\n\n&#091;\/ux_banner]<\/pre>\n   <div id=\"banner_1172319674\" class=\"ux_banner dark     \"  style=\"height:560px; background-color:#333\" data-height=\"560px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:80%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h3 class=\"alt-font\">It has Finaly started&#8230;<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1 class=\"h-large\">HUGE SALE<\/h1>\n<h1>UP TO 70% OFF<\/h1>\n<div class=\"tx-div medium\"><\/div>\n<p><a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop men<\/a><br \/>\n<a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop women<\/a><br \/>\n<a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop kids<\/a><\/p>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner  bg=\"http:\/\/imageurl\" height=\"560px\" link=\"\" animation=\"fadeInLeft\" text_align=\"center\" text_pos=\"right center\" text_color=\"dark\" text_width=\"40%\"]\n\n&lt;h3 class=\"alt-font\">It has Finaly started...&lt;\/h3>\n____\n&lt;h1 class=\"h-large\">HUGE SALE&lt;\/h1>\n&lt;h1>UP TO 70% OFF&lt;\/h1>\n____\n\n&#091;button style=\"alt-button white\" text=\"Shop men\" link=\"http:\/\/\"]\n&#091;button style=\"alt-button white\" text=\"Shop women\" link=\"http:\/\/\"]\n&#091;button style=\"alt-button white\" text=\"Shop kids\" link=\"http:\/\/\"]\n\n&#091;\/ux_banner]<\/pre>\n   <div id=\"banner_1947563242\" class=\"ux_banner dark has-parallax    \"  style=\"height:560px; background-color:#333\" data-height=\"560px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg ux_parallax \" data-velocity=\"0.3\" style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg ux_parallax \" data-velocity=\"0.3\" style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:80%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h3 class=\"alt-font\">Just An Awesome<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1 class=\"h-large\">PARALLAX<\/h1>\n<h1>BANNER<\/h1>\n<div class=\"tx-div medium\"><\/div>\n<p><a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop men<\/a><br \/>\n<a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop women<\/a><br \/>\n<a href=\"http:\/\/\" class=\"button  alt-button white\" >Shop kids<\/a><\/p>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner  bg=\"http:\/\/imageurl\" height=\"560px\" link=\"\" animation=\"fadeInLeft\" text_align=\"center\" text_pos=\"right center\" text_color=\"dark\" text_width=\"40%\" <b>parallax=\"2\"<\/b>]\n\n&lt;h3 class=\"alt-font\">It has Finaly started...&lt;\/h3>\n____\n&lt;h1 class=\"h-large\">PARALLAX&lt;\/h1>\n&lt;h1>UP TO 70% OFF&lt;\/h1>\n____\n\n&#091;button style=\"alt-button white\" text=\"Shop men\" link=\"http:\/\/\"]\n&#091;button style=\"alt-button white\" text=\"Shop women\" link=\"http:\/\/\"]\n&#091;button style=\"alt-button white\" text=\"Shop kids\" link=\"http:\/\/\"]\n\n&#091;\/ux_banner]<\/pre>\n   <div id=\"banner_759363735\" class=\"ux_banner dark     \"  style=\"height:300px; background-color:#333\" data-height=\"300px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>ABOUT US<\/h1>\n<div class=\"tx-div small\"><\/div>\n\n\t\t<div class=\"social-icons share-row\">\n\t\t\t\t            <a href=\"mailto:enteryour@addresshere.com?subject=Shortcode%20%26%238211%3B%20UX%20Banners&amp;body=Check%20this%20out:%20https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" rel=\"nofollow\" class=\"icon icon_email tip-top\" title=\"Email to a Friend\"><span class=\"icon-envelop\"><\/span><\/a>\n\t\t\t\t\t\t\t\t\t<a href=\"whatsapp:\/\/send?text='Shortcode%20%26%238211%3B%20UX%20Banners' - https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" data-action=\"share\/whatsapp\/share\" class=\"icon icon_whatsapp tip-top\" rel=\"nofollow\" title=\"Share on WhatsApp\"><span class=\"icon-phone\" \/><\/a>\t\t            <a href=\"https:\/\/twitter.com\/share?url=https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" onclick=\"window.open(this.href,this.title,'width=500,height=500,top=300px,left=300px');  return false;\"  rel=\"nofollow\" target=\"_blank\" class=\"icon icon_twitter tip-top\" title=\"Share on Twitter\"><span class=\"icon-twitter\"><\/span><\/a>\n\t\t\t\t            <a href=\"\/\/pinterest.com\/pin\/create\/button\/?url=https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/&amp;media=&amp;description=Shortcode%20%26%238211%3B%20UX%20Banners\" onclick=\"window.open(this.href,this.title,'width=500,height=500,top=300px,left=300px');  return false;\"  rel=\"nofollow\" target=\"_blank\" class=\"icon icon_pintrest tip-top\" title=\"Pin on Pinterest\"><span class=\"icon-pinterest\"><\/span><\/a>\n\t\t\t\t            <a href=\"\/\/plus.google.com\/share?url=https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" target=\"_blank\" class=\"icon icon_googleplus tip-top\" onclick=\"window.open(this.href,this.title,'width=500,height=500,top=300px,left=300px');  return false;\"  rel=\"nofollow\" title=\"Share on Google+\"><span class=\"icon-google-plus\"><\/span><\/a>\n\t\t\t\t\t            <a href=\"\/\/tumblr.com\/widgets\/share\/tool?canonicalUrl=https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" target=\"_blank\" class=\"icon icon_tumblr tip-top\" onclick=\"window.open(this.href,this.title,'width=500,height=500,top=300px,left=300px');  return false;\"  rel=\"nofollow\" title=\"Share on Tumblr\"><span class=\"icon-tumblr\"><\/span><\/a>\n\t\t\t\t    <\/div>\n\n    \n    \n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner  bg=\"http:\/\/imageurl\" height=\"300px\" animation=\"flipInX\"]\n\n&lt;h1>ABOUT US&lt;\/h1>\n___\n&#091;share]\n&#091;\/ux_banner]<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Banner Grid<\/span> <\/h3><!-- end section_title -->\n    <div id=\"banner_grid_1003057242\">\n    <div class=\"row\">\n      <div class=\"large-12 columns\">\n        <div class=\"row collapse ux_banner-grid ux_banner-grid-new\">\n             \n\n<div class=\"small-12    large-6  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_2130016983\" class=\"ux_banner light     \"  style=\"height:600px; background-color:#333\" data-height=\"600px\" role=\"banner\">\n      <a href=\"#\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner left bottom text-left \"  style=\"width:40%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h3 class=\"alt-font\">Women Tank Tops<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1 class=\"animated fadeInLeft uppercase\">HOT Summer Singlet<\/h1>\n<h3 class=\"animated fadeInRight\">Now 19$<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<a href=\"http:\/\/\" class=\"button  alt-button primary\" >Shop now<\/a>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<div class=\"small-12    large-3  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_1789294591\" class=\"ux_banner dark    hover_fade \"  style=\"height:600px; background-color:#333\" data-height=\"600px\" role=\"banner\">\n      <a href=\"#\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h2 class=\"alt-font\">Summer<\/h2>\n<div class=\"tx-div medium\"><\/div>\n<h1 class=\"animated fadeInRight\">SALE STARTS TODAY<\/h1>\n<div class=\"tx-div medium\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<div class=\"small-12    large-3  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_589221096\" class=\"ux_banner dark    hover_fade \"  style=\"height:292px; background-color:#333\" data-height=\"292px\" role=\"banner\">\n      <a href=\"#\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h1 class=\"animated fadeInLeft uppercase\">NEW JEANS IN STOCK<\/h1>\n<div class=\"tx-div medium\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<div class=\"small-12    large-3  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_1393063229\" class=\"ux_banner dark    hover_fade \"  style=\"height:292px; background-color:#333\" data-height=\"292px\" role=\"banner\">\n      <a href=\"#\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h1 class=\"animated fadeInLeft uppercase\">SHOP MEN SALE<\/h1>\n<div class=\"tx-div medium\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n        <\/div>\n      <\/div>\n    <\/div>\n    <script>\n  jQuery(document).ready(function ($) {\n      var $container = $(\"#banner_grid_1003057242 .ux_banner-grid\");\n      $container.packery({\n        itemSelector: \".columns\",\n        gutter: 0\n      });\n   });\n  <\/script>\n  <\/div><!-- #banner-grid -->\n  \n  \n<pre>\n&#091;ux_banner_grid]\n\n&#091;col span=\"6\"]\n&#091;ux_banner height=\"600px\" bg=\"\"] &#091;\/ux_banner]\n&#091;\/col]\n\n&#091;col span=\"3\" ]\n&#091;ux_banner height=\"600px\" bg=\"\"] &#091;\/ux_banner]\n&#091;\/col]\n\n&#091;col span=\"3\" ]\n&#091;ux_banner height=\"292px\" bg=\"\"] &#091;\/ux_banner]\n&#091;\/col]\n\n&#091;col span=\"3\"]\n&#091;ux_banner height=\"292px\" bg=\"\"] &#091;\/ux_banner]\n&#091;\/col]\n\n&#091;\/ux_banner_grid]<\/pre>\n<p><h3 class=\"section-title clearfix  \"> <span>3-column Banner Row<\/span> <\/h3><!-- end section_title --><br \/>\n\t<div  class=\"row container \">\n\n<div class=\"small-12    large-4  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_1865053474\" class=\"ux_banner dark    hover_zoom \"  style=\"height:160px; background-color:#333\" data-height=\"160px\" role=\"banner\">\n      <a href=\"http:\/\/localhost:8888\/test\/blog\/\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h2 class=\"uppercase\">Weekly Giveaway<\/h2>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<div class=\"small-12    large-4  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_1203272329\" class=\"ux_banner dark    hover_zoom \"  style=\"height:160px; background-color:#333\" data-height=\"160px\" role=\"banner\">\n      <a href=\"http:\/\/localhost:8888\/test\/blog\/\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h2 class=\"uppercase\">Join our  competition<\/h2>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<div class=\"small-12    large-4  columns   \"  ><div class=\"column-inner\"  >\n   <div id=\"banner_2072673691\" class=\"ux_banner dark    hover_zoom \"  style=\"height:160px; background-color:#333\" data-height=\"160px\" role=\"banner\">\n      <a href=\"http:\/\/localhost:8888\/test\/pages\/about-us\/\" >                            <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                             <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated fadeIn\" style=\" \">\n              <h2 class=\"uppercase\">ABOUT US<\/h2>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n       <\/a>              <\/div><!-- end .ux_banner -->\n\n<\/div><\/div>\n\n<\/div>\n  <\/p>\n<pre>\n&#091;row]\n\n&#091;col span=1\/3]\n&#091;ux_banner link=\"http:\/\/localhost:8888\/test\/blog\/\" bg=\"http:\/\/imageurl\" hover=\"zoom\" height=\"160px\"]\n&lt;h2 class=\"uppercase\">Weekly Giveaway&lt;\/h2>\n___\n&#091;\/ux_banner]\n&#091;\/col]\n\n&#091;col  span=1\/3]\n&#091;ux_banner link=\"http:\/\/localhost:8888\/test\/blog\/\" bg=\"http:\/\/imageurl\" hover=\"zoom\" height=\"160px\"]\n&lt;h2 class=\"uppercase\">Join our  competition&lt;\/h2>\n___\n&#091;\/ux_banner]\n&#091;\/col]\n\n&#091;col span=1\/3]\n&#091;ux_banner link=\"http:\/\/localhost:8888\/test\/pages\/about-us\/\" bg=\"http:\/\/imageurl\" hover=\"zoom\" height=\"160px\"]\n&lt;h2 class=\"uppercase\">ABOUT US &lt;\/h2>\n___\n&#091;\/ux_banner]\n&#091;\/col]\n\n&#091;\/row]<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Video banner<\/span> <\/h3><!-- end section_title -->\n   <div id=\"banner_2110842244\" class=\"ux_banner dark     \"  style=\"height:600px; background-color:#333\" data-height=\"600px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                     <video id=\"banner_video\" class=\"ux-banner-video hide-for-small\"  poster=\"\" preload=\"auto\" autoplay=\"\" loop=\"loop\" muted='muted'>\n            <source src=\"http:\/\/localhost:8888\/test\/wp-content\/uploads\/sites\/2\/2013\/12\/My-Movie-Medium.mov\" type=\"video\/mp4\">\n            <source src=\"\" type=\"video\/webm\">\n            <source src=\"\" type=\"video\/ogg\">\n        <\/video>\n                     <div class=\"row\" >\n          <div class=\"inner left center text-left \"  style=\"width:40%;\">\n            <div class=\"inner-wrap animated fadeInRight\" style=\" \">\n              <h3 class=\"alt-font\">Summer coming&#8230;<\/h3>\n<div class=\"tx-div medium\"><\/div>\n<h1>THIS IS AN AWESOME VIDEO BANNER<\/h1>\n<div class=\"tx-div medium\"><\/div>\n<p><a href=\"http:\/\/localhost:8888\/test\/product-category\/men\/\" class=\"button  \" >Shop men<\/a><br \/>\n<a href=\"http:\/\/localhost:8888\/test\/product-category\/women\/\" class=\"button  \" >Shop women<\/a><\/p>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;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%\"]\n&lt;h3 class=\"alt-font\">Summer coming...&lt;\/h3>\n____\n&lt;h1>THIS IS AN AWESOME VIDEO BANNER&lt;\/h1>\n____\n&#091;button  text=\"Shop men\" link=\"http:\/\/localhost:8888\/test\/product-category\/men\/\"]\n&#091;button  text=\"Shop women\" link=\"http:\/\/localhost:8888\/test\/product-category\/women\/\"]\n\n&#091;\/ux_banner]\n<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Banner with snow effect<\/span> <\/h3><!-- end section_title -->\n   <div id=\"banner_1590310992\" class=\"ux_banner dark     \"  style=\"height:500px; background-color:#333\" data-height=\"500px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                               <div class=\"banner-effect effect-snow\"><\/div>\n               <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>DEFAULT BANNER<\/h1>\n<h3>This is a simple banner with centered text<\/h3>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\" <b>effect=\"snow\"<\/b>]\n\n&lt;h1>DEFAULT BANNER&lt;\/h1>\n&lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3>\n____\n&#091;\/ux_banner]<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Banner with glass effect<\/span> <\/h3><!-- end section_title -->\n   <div id=\"banner_868364930\" class=\"ux_banner dark     \"  style=\"height:500px; background-color:#333\" data-height=\"500px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                               <div class=\"banner-effect effect-sliding-glass\"><\/div>\n               <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>DEFAULT BANNER<\/h1>\n<h3>This is a simple banner with centered text<\/h3>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\" <b>effect=\"sliding-glass\"<\/b>]\n\n&lt;h1>DEFAULT BANNER&lt;\/h1>\n&lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3>\n____\n&#091;\/ux_banner]<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Banner with sparkle effect<\/span> <\/h3><!-- end section_title -->\n   <div id=\"banner_1815543022\" class=\"ux_banner dark     \"  style=\"height:500px; background-color:#333\" data-height=\"500px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                               <div class=\"banner-effect effect-sparkle\"><\/div>\n               <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>DEFAULT BANNER<\/h1>\n<h3>This is a simple banner with centered text<\/h3>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\" <b>effect=\"sparkle\"<\/b>]\n\n&lt;h1>DEFAULT BANNER&lt;\/h1>\n&lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3>\n____\n&#091;\/ux_banner]<\/pre>\n<h3 class=\"section-title clearfix  \"> <span>Banner with confetti effect<\/span> <\/h3><!-- end section_title -->\n   <div id=\"banner_961410751\" class=\"ux_banner dark     \"  style=\"height:500px; background-color:#333\" data-height=\"500px\" role=\"banner\">\n                                  <div class=\"hide-for-small-only banner-bg \"  style=\"background-image:url('https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif'); background-color:#333\"><img decoding=\"async\" src=\"https:\/\/www.thann.co.th\/wp-content\/uploads\/2013\/08\/dummy.gif\"  alt=\"\" style=\"visibility:hidden;\" \/><\/div>\n       <div class=\"show-for-small-only banner-bg \"  style=\"background-image:url(''); background-color:#333\"><\/div>\n                               <div class=\"banner-effect effect-confetti\"><\/div>\n               <div class=\"row\" >\n          <div class=\"inner center text-center \"  style=\"width:60%;\">\n            <div class=\"inner-wrap animated flipInX\" style=\" \">\n              <h1>DEFAULT BANNER<\/h1>\n<h3>This is a simple banner with centered text<\/h3>\n<div class=\"tx-div small\"><\/div>\n            <\/div>\n          <\/div>  \n        <\/div>\n                     <\/div><!-- end .ux_banner -->\n\n<pre>\n&#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\" <b>effect=\"confetti\"<\/b>]\n\n&lt;h1>DEFAULT BANNER&lt;\/h1>\n&lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3>\n____\n&#091;\/ux_banner]<\/pre>\n","protected":false},"excerpt":{"rendered":"<p>UX Banners are responsive and animated banners. These banners can be inserted into a UX Slider or into a banner grid. &#091;ux_banner bg=&#8221;http:\/\/imageurl&#8221; height=&#8221;500px&#8221; animation=&#8221;flipInX&#8221;] &lt;h1>DEFAULT BANNER&lt;\/h1> &lt;h3>This is a simple banner with centered text. Change text and background easely&#8230; &lt;\/h3> ____ &#091;\/ux_banner] &#091;ux_banner bg=&#8221;http:\/\/imageurl&#8221; height=&#8221;560px&#8221; link=&#8221;&#8221; animation=&#8221;fadeInLeft&#8221; text_align=&#8221;center&#8221; text_pos=&#8221;right center&#8221; text_color=&#8221;dark&#8221; text_width=&#8221;40%&#8221;] &lt;h3>This Weekend [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":288,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-blank-title-center.php","meta":{"_acf_changed":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"footnotes":""},"acf":[],"aioseo_notices":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.9.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Shortcode - UX Banners - Thann<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Shortcode - UX Banners - Thann\" \/>\n<meta property=\"og:description\" content=\"UX Banners are responsive and animated banners. These banners can be inserted into a UX Slider or into a banner grid. &#091;ux_banner bg=&quot;http:\/\/imageurl&quot; height=&quot;500px&quot; animation=&quot;flipInX&quot;] &lt;h1&gt;DEFAULT BANNER&lt;\/h1&gt; &lt;h3&gt;This is a simple banner with centered text. Change text and background easely... &lt;\/h3&gt; ____ &#091;\/ux_banner] &#091;ux_banner bg=&quot;http:\/\/imageurl&quot; height=&quot;560px&quot; link=&quot;&quot; animation=&quot;fadeInLeft&quot; text_align=&quot;center&quot; text_pos=&quot;right center&quot; text_color=&quot;dark&quot; text_width=&quot;40%&quot;] &lt;h3&gt;This Weekend [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\" \/>\n<meta property=\"og:site_name\" content=\"Thann\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\",\"url\":\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\",\"name\":\"Shortcode - UX Banners - Thann\",\"isPartOf\":{\"@id\":\"https:\/\/www.thann.co.th\/en\/#website\"},\"datePublished\":\"2013-08-11T15:29:21+00:00\",\"dateModified\":\"2013-08-11T15:29:21+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.thann.co.th\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Shortcodes\",\"item\":\"https:\/\/www.thann.co.th\/en\/shortcodes\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Shortcode &#8211; UX Banners\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.thann.co.th\/en\/#website\",\"url\":\"https:\/\/www.thann.co.th\/en\/\",\"name\":\"Thann\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.thann.co.th\/en\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Shortcode - UX Banners - Thann","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/","og_locale":"en_US","og_type":"article","og_title":"Shortcode - UX Banners - Thann","og_description":"UX Banners are responsive and animated banners. These banners can be inserted into a UX Slider or into a banner grid. &#091;ux_banner bg=\"http:\/\/imageurl\" height=\"500px\" animation=\"flipInX\"] &lt;h1>DEFAULT BANNER&lt;\/h1> &lt;h3>This is a simple banner with centered text. Change text and background easely... &lt;\/h3> ____ &#091;\/ux_banner] &#091;ux_banner bg=\"http:\/\/imageurl\" height=\"560px\" link=\"\" animation=\"fadeInLeft\" text_align=\"center\" text_pos=\"right center\" text_color=\"dark\" text_width=\"40%\"] &lt;h3>This Weekend [&hellip;]","og_url":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/","og_site_name":"Thann","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/","url":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/","name":"Shortcode - UX Banners - Thann","isPartOf":{"@id":"https:\/\/www.thann.co.th\/en\/#website"},"datePublished":"2013-08-11T15:29:21+00:00","dateModified":"2013-08-11T15:29:21+00:00","breadcrumb":{"@id":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.thann.co.th\/en\/shortcodes\/shortcode-banners\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.thann.co.th\/en\/"},{"@type":"ListItem","position":2,"name":"Shortcodes","item":"https:\/\/www.thann.co.th\/en\/shortcodes\/"},{"@type":"ListItem","position":3,"name":"Shortcode &#8211; UX Banners"}]},{"@type":"WebSite","@id":"https:\/\/www.thann.co.th\/en\/#website","url":"https:\/\/www.thann.co.th\/en\/","name":"Thann","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.thann.co.th\/en\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/pages\/458"}],"collection":[{"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/comments?post=458"}],"version-history":[{"count":0,"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/pages\/458\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/pages\/288"}],"wp:attachment":[{"href":"https:\/\/www.thann.co.th\/en\/wp-json\/wp\/v2\/media?parent=458"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}