TEASER SHORTCODE

    : :
  • On : Sep 03, 2012

How to add teaser boxes to page

To add teaser box to your page simply click on teaser box shortcode button, that can be found integrated in default editor panel in visual mode. Use columns to set different amount of teasers per row.

How it looks

[one_third][teaser url=”#” title=”Create your online Store!” src=”http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg” excerpt=”Start sell online today with our Simplicity theme! It comes with WooCommerce, eCommerce and Jigoshop WordPress plugins support.” ]Shop now![/teaser][/one_third]
[one_third][teaser url=”#” title=”Responsive Design” src=”http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg” excerpt=”This theme looks great not only on desktops but also on devices. What means that there are no special requirements to browse your website.” ]See How it Works[/teaser][/one_third]
[one_third last=last] [teaser url=”#” title=”One Click Install” src=”http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg” excerpt=”You will love this theme from the first steps! You can setup this theme with the same look as on preview in just a couple of clicks.” ]Learn more[/teaser][/one_third]
[clear]


Examle with 2 columns

[one_half] [teaser url=”#” title=”Create your
online Store!” src=”” excerpt=”Start sell online today with our Simplicity theme! It comes with WooCommerce, eCommerce and Jigoshop WordPress plugins support.” ]Shop now![/teaser] [/one_half]
[one_half last=last] [teaser url=”#” title=”Responsive
Design” src=”” excerpt=”This theme looks great not only on desktops but also on devices. What means that there are no special requirements to browse your website.” ]See How it Works[/teaser]
[/one_half] [clear]

 

Sample Code

[one_third][teaser url="#" title="Create your online Store!" src="http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg" excerpt="Start sell online today with our Simplicity theme! It comes with WooCommerce, eCommerce and Jigoshop WordPress plugins support." ]Shop now![/teaser][/one_third] [one_third][teaser url="#" title="Responsive Design" src="http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg" excerpt="This theme looks great not only on desktops but also on devices. What means that there are no special requirements to browse your website." ]See How it Works[/teaser][/one_third] [one_third last=last] [teaser url="#" title="One Click Install" src="http://localhost/work/retro.wp/wp-content/uploads/2012/12/teasers.jpg" excerpt="You will love this theme from the first steps! You can setup this theme with the same look as on preview in just a couple of clicks." ]Learn more[/teaser][/one_third] [clear]

[clear]

[one_half] [teaser url=”http://localhost/work/retro.wp/” title=”AMAZING
RETRO DESIGN” src=”http://retro.olegnax.com/wp-content/uploads/2012/08/teaser_01.jpg” target=”_blank” excerpt=”Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod” ]READ MORE[/teaser] [/one_half]
[one_half last=last] [teaser url=”http://localhost/work/retro.wp/” title=”AMAZING
RETRO DESIGN” src=”http://retro.olegnax.com/wp-content/uploads/2012/08/teaser_01.jpg” target=”_blank” excerpt=”Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod” ]READ MORE[/teaser] [/one_half]

Be Sociable, Share!