Animated hover CSS3 effects for images
These shortcodes allows you to display an image and its description with animated CSS3 effect.
Note: If you would like to add your own text into the image description, just modify the shortcode below or edit an existing shortcode of the demo template.
Parameters
- title
- subtitle
- effect : saddie / goliath / julia / marley
- background : URL to image with http://
- fontcolor : color value (HEX)
- width : size in PX
- height : size in PX
- link : URL with http://
- target : _self / _blank
Example 1 – sadie
Example 2 – goliath
Example 3 – julia
Example 4 – marley
Testimonial
Parameters
- title
- subtitle
- class : custom css class (eg. right)
Your custom text here<strong>bill gates</strong><strong>famous visionary</strong>
Your custom text here<strong>steven tyler</strong><strong>famous singer</strong>
Video Gallery
Parameters
- id : ID of video
- web : youtube / vimeo
- fs : 1 / 0
- size : 1 – 12 (grid)
Image Gallery
Parameters
- orderby : none / ID / author / title / date / modified / parent / rand / comment_count / menu_order / post__in
- order : ASC / DESC
- ids : image ID
- columns : 1 – 12 (grid)
- size : full / medium / thumbnail (image size)
- link : URL with http://
- modal : enable / disable
Accordion
This shortcode allows you to display accordion panels inside posts or widgets.
Note: Remember to always set the accordion title, and if you want that one of the accordions to be open on page load then enter the status attribute to “active”.
Parameters
- title
- status : active
Some text here that will be included in accordionSome text here that will be included in accordionSome text here that will be included in accordion
Tabs
This shortcode allows you to display tabs inside posts or widgets.
Note: Remember to always set the tab title, and if you want than one of the tabs to be open on page load then enter the status attribute to “active”.
Parameters
- class: custom css class
- title
- status: active
Some text here that will be included in tab contentSome text here that will be included in tab contentSome text here that will be included in tab content
Some text here that will be included in tab contentSome text here that will be included in tab contentSome text here that will be included in tab content
Columns
This shortcode allows you to display columns inside posts or widgets.Note: It is needed to use the col short inside row shortcode. As well you can choose class suffix for different screens by using screen attribute, default is “md”.
Parameters
- size : 1 – 12 (grid)
- screen : xs / sm / md / lg (grid)
- margin : 1 / 0
Some content here, other shortcodes can be included Some content here, other shortcodes can be included Some content here, other shortcodes can be included
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Phasellus vulputate ac dui aliquet dapibus. Suspendisse ut vestibulum tellus, sed gravida arcu. Aliquam erat volutpat. Donec sit amet eleifend tortor.
Pricing Table – example 1
This shortcode allows you to display Pricing Table.
Parameters
- size: width in PX or %
- price_up
- price_middle
- price_down
- title
- subtitle
- button_link: URL with http://
- button_text
as low as19.85monthDSL InternetStep up to incredible DSL cable internet<ul><li>Lorem ipsum dolor sit amet</li><li>Morbi rhoncus diam quis augue</li><li>Proin non finibus diam</li><li>Pellentesque varius</li><li>Vivamus quis leo</li><li>Donec ut elit maximus</li></ul>as low as14.85monthDSL InternetStep up to incredible DSL cable internet<ul><li>Lorem ipsum dolor sit amet</li><li>Morbi rhoncus diam quis augue</li><li>Proin non finibus diam</li><li>Pellentesque varius</li><li>Vivamus quis leo</li><li>Donec ut elit maximus</li></ul>
- Lorem ipsum dolor sit amet
- Morbi rhoncus diam quis augue
- Proin non finibus diam
- Pellentesque varius
- Vivamus quis leo
- Donec ut elit maximus
- Lorem ipsum dolor sit amet
- Morbi rhoncus diam quis augue
- Proin non finibus diam
- Pellentesque varius
- Vivamus quis leo
- Donec ut elit maximus
Pricing Table – example 2
This shortcode allows you to display Pricing Table.
Parameters
- title
- size: width in PX or %
- service_title
- service_price
<strong>Service 1</strong> <strong>Lorem ipsum dolor</strong> <strong>$39</strong> <strong>Donec lobortis quam</strong> <strong>$45</strong> <strong>Pellentesque habitant</strong> <strong>$68</strong> <strong>In a facilisis augue</strong> <strong>$28</strong> <strong>Aenean et placerat erat</strong> <strong>$55</strong> <strong>Nam neque massa</strong> <strong>$78</strong>
<strong>Service 2</strong> <strong>Lorem ipsum dolor</strong> <strong>$39</strong> <strong>Donec lobortis quam</strong> <strong>$45</strong> <strong>Pellentesque habitant</strong> <strong>$68</strong> <strong>In a facilisis augue</strong> <strong>$28</strong> <strong>Aenean et placerat erat</strong> <strong>$55</strong> <strong>Nam neque massa</strong> <strong>$78</strong>
<strong>Service 3</strong> <strong>Lorem ipsum dolor</strong> <strong>$39</strong> <strong>Donec lobortis quam</strong> <strong>$45</strong> <strong>Pellentesque habitant</strong> <strong>$68</strong> <strong>In a facilisis augue</strong> <strong>$28</strong> <strong>Aenean et placerat erat</strong> <strong>$55</strong> <strong>Nam neque massa</strong> <strong>$78</strong>
Service 1 | |
---|---|
Lorem ipsum dolor | $39 |
Donec lobortis quam | $45 |
Pellentesque habitant | $68 |
In a facilisis augue | $28 |
Aenean et placerat erat | $55 |
Nam neque massa | $78 |
Service 2 | |
---|---|
Lorem ipsum dolor | $39 |
Donec lobortis quam | $45 |
Pellentesque habitant | $68 |
In a facilisis augue | $28 |
Aenean et placerat erat | $55 |
Nam neque massa | $78 |
Service 3 | |
---|---|
Lorem ipsum dolor | $39 |
Donec lobortis quam | $45 |
Pellentesque habitant | $68 |
In a facilisis augue | $28 |
Aenean et placerat erat | $55 |
Nam neque massa | $78 |
Google Map
This shortcode allows you to display Google Map.
Parameters
- address
- latitude : number
- longitutde : number
- width: PX or %
- height: PX or %
- enablescrollwheel: true / false
- disablecontrols: ture / false
- zoom : 0 – 23
- tooltip : enable / disable
Headline
This shortcode allows you to display headline with effect.
Parameters
- subtitle
- class : custom css class
- style : custom css styles
Our clinic description in 3 words:<strong>reliabilityexperienceeffectiveness</strong>
Our clinic description in 3 words:reliabilityexperienceeffectiveness
Speed
This shortcode allows you to display internet speed in a cool way.
Parameters
- up
- middle
- down