Webbu Shortcode Editor

You can use webbu shortcode editor and create shortcodes easy. Go to Pages > Edit Page you Selected and you will see WEBBU SHORTCODE BUTTON photo below; You will fine more details on shortcode popups. All sections on this section have own description while adding item. So we not give you more detail on here. As you seen on second photo.

We will tell you all tiles code instruction but you don't need to know that things. Because our shortcode editor will help you create this codes. But if you want to learn please have a check codes below.

Tile Color Code; ( Just for information)

          /*Colors*/
.TLightRed{background-color:#E51400}
.TLightOrange{background-color:#FE8300}
.TOrange{background-color:#FD5C04}
.TRed{background-color:#BD0000}
.TBrown{background-color:#7D6058}
.TLightPurple{background-color:#E86EB2}
.TDarkPurple{background-color:#8D0196}
.TLightBlue{background-color:#5FCDCB}
.TBlue{background-color:#1673D2}
.TDarkBlue{background-color:#0849B1}
.TFacebookBlue{background-color:#3B5D9C}
.TTwitterBlue{background-color:#59D5E6}
.TThumblrBlue{background-color:#2A4866}
.TLinkedinBlue{background-color:#1477AC}
.TDribbblePink{background-color:#F26097}
.TTurquise{background-color:#5FCDCB}
.TLightGrey{background-color:#E0E0E0}
.TGrey{background-color:#BBB}
.TDarkGrey{background-color:#666}
.TLightGreen{background-color:#74E800}
.TGreen{background-color:#00A300}
.TDarkGreen{background-color:#008A00}
.TBlack{background-color:#000}
.TWhite{background-color:#fff}

Tile Size Codes; (Just for information)

'' => 'Box (Standart Square)',
't2x' => 'Double Box Horizontal',
't2x-v' => 'Double Box Vertical',
't3x' => 'Triple Box Horizontal',
't3x-v' => 'Triple Box Vertical',
't4x' => 'Quadro Box Horizontal',
't4x-v' => 'Quadro Box Vertical',
't2x-b' => 'Double Horizontal / Double Vertical Box',
't3x-b' => 'Triple Horizontal / Triple Vertical Box',
't4x-b' => 'Quadro Horizontal / Quadro Vertical Box',
't3x-t2x-b' => 'Triple Horizontal / Double Vertical Box',
't4x-t2x-b' => 'Quadro Vertical / Double Horizontal Box',
't4x-t2x22-b' => 'Quadro Horizontal / Double Vertical Box',
't4x-t1x-b' => 'Quadro Horizontal / Single Vertical Box'
            

Icon Tile Shortcode Explanation

[webbu_icontile size="" url="" pi="77" color="TBlue" sname="About us" sicon="" scolor=""]icon-group[/webbu_icontile]

• size = Show box size like: t2x ( You can find all sizes upside.)
• url = Custom url (Optional)
• pi = Page ID (We recommend don't put this manually use Webbu Shortcode editor.)
• color = Tile color code (All codes and names upside.)
• sname = Sub bar name (Optional)
• sicon = Sub bar icon (Optional)
• icon-group = icon name from fontawesome icon library

Image Tile Shortcode Explanation

[webbu_imgtile size="t4x-b" url="" pi="" alt="-" sname="" sicon="" scolor=""]http://metromobile.webbudesign.com/test/wp-content/uploads/2012/11/metroentrance.jpg[/webbu_imgtile]

• size = Show box size like: t2x ( You can find all sizes upside.)
• url = Custom url (Optional)
• pi = Page ID (We recommend don't put this manually use Webbu Shortcode editor.)
• alt = Image alt tag
• sname = Sub bar name (Optional)
• sicon = Sub bar icon (Optional)
• and image url middle of the code.

Slider Tile Shortcode Explanation

[webbu_slidertile size="t2x-b" url="" pi="" st="5000" tp="1500"][webbu_simgtile]http://metromobile.webbudesign.com/test/wp-content/uploads/2012/11/slider1.jpg[/webbu_simgtile] [webbu_simgtile]http://metromobile.webbudesign.com/test/wp-content/uploads/2012/11/slider2.jpg[/webbu_simgtile] [webbu_simgtile]http://metromobile.webbudesign.com/test/wp-content/uploads/2012/11/slider3.jpg[/webbu_simgtile] [/webbu_slidertile]

[webbu_slidertile] is main container. You have to add images sub container like code [webbu_simgtile]

• size = Show box size like: t2x ( You can find all sizes upside.)
• url = Custom url (Optional)
• pi = Page ID (We recommend don't put this manually use Webbu Shortcode editor.)
• st = Change duration
• tp = Wait duration

Video Tile Shortcode Explanation

[webbu_videotile size="" type="youtube" src="23237102"][/webbu_videotile]

• size = Show box size like: t2x ( You can find all sizes upside.)
• type = Youtube or vimeo
• src = vimeo video number or youtube video code

Map Tile Shortcode Explanation

[webbu_maptile size="" address="New York, USA"][/webbu_maptile]

• size = Show box size like: t2x ( You can find all sizes upside.)
• address = write address you want to find.

Tile Types Image Below