-
Posts
-
I am trying to add a button shortcode to a layer inside the LayerSlider. It will not render the button, it just displays the shortcode.
[av_button label='Click me' link='manually,http://' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='25']
Quick and dirty: insert the shortcode to a (blank) page and locate the generated output in source view. Copy it over in your LayerSlider element and it should work fine.
Obviously, the LayerSlider won’t process any shortcodes. Could be annoying if you use a gallery… :)
Otherwise, have a look over here: http://codecanyon.net/item/layerslider-responsive-wordpress-slider-plugin-/1362246
Hi,
@formateins: Thanks.
@olylax21: Shortcode is not going to work. You should use the html generated by the button shortcode. It looks something like this.
<div class="avia-button-wrap avia-button-center avia-builder-el-2 el_after_av_textblock avia-builder-el-last "><a href="http://www.thisISaLink.com" class="avia-button avia-icon_select-yes avia-color-red avia-size-medium avia-position-center " target="_blank"><span class="avia_button_icon avia-font-entypo-fontello">♥</span><span class="avia_iconbox_title">Click me</span></a></div>Regards,
Ismael
Hmm. It does work for me to just use the shortcode, which I generated beforehand on a blank page as suggested by formateins and then copy/pasted. The important thing is to choose “Div / Video” for your layer. It even says “This field is also shortcode-aware” on the tooltip:
However, neither this method nor the HTML method by Ismael solves one huge problem: buttons don’t like responsive, they don’t scale. They look horrible on mobile devices:
So I just created my buttons as .png images in PS (including button text) and used those. Not ideal, but… well.
Good to know. Never reading any tooltips… :D But I checked the LayerSlider code and there’s a do_shortcode for the Div-Section of a Slide. Should also work with nested ones.
Hi,
I tested this code, place it on a Div/Video. It works ok but you are correct they are not responsive. You need to add a special class then use Media Queries to make them responsive.
<div class="avia-button-wrap avia-button-center avia-builder-el-2 el_after_av_textblock avia-builder-el-last "><a href="http://www.thisISaLink.com" class="avia-button avia-icon_select-yes avia-color-red avia-size-medium avia-position-center " target="_blank"><span class="avia_button_icon avia-font-entypo-fontello">♥</span><span class="avia_iconbox_title">Click me</span></a></div>Regards,
Ismael
- The topic ‘Add a shortcode inside a LayerSlider layer’ is closed to new replies.