By default shortcodes get values what’s given in options page ( settings page of this plugin in admin ), we can override that using attributes
Overall Attributes – supports most of the styles
num – ( to change the number )
val – ( to change the display text for – style-1, style-2, style-4, style-8 )
style – ( e.g. style=1 – right now there are 8 styles )
position – ( e.g. position=fixed – to add fixed position style, any css positions )
top – ( e.g. – left=10px , left=2% )
right – ( e.g. – left=10px , left=2% )
bottom – ( e.g. – left=10px , left=2% )
left – ( e.g. – left=10px , left=2% )
home – ( home= hide ) to hide shortcodes in home page , category, archive
text – to add pre-filled text. ( e.g. text=”to the sales team:” ) ( since version 1.3 )
hide_mobile – Hide that shortcode on mobile device (hide_mobile=true)
hide_desktop – Hide that shortcode on desktop device (hide_desktop=true)
inline_issue– If shortcode output is display in new line and don’t want that, add inline_issue=”true”, fix for the autop issue
Attributes Specific to styles :
style-1
Style-1 is the default theme button. (looks like currently activated Theme button). For customizable button, please select style-8
Style-1-Examples
style-2
s2_text_color – to change text color
s2_text_color_onhover – to change text color on hover
s2_decoration – to change text decoration – like adding underline ..
s2_decoration_onhover – to chagne text decoration on hover
s3_icon_size – to change icon size ( s3_icon_size= 48px )
style-4
s4_text_color – to change text color inside chip
s4_background_color – to change background color of chip
In some themes – wordpress adds autop – as it cause the element to display in next line.
so to add chip style ( style-4 ) inline with in content- use style-4.1
so style-4.1 make previous element display – inline.
style-5
s5_color – to change icon color
s5_hover_color – to change icon color when hover
s5_icon_size – to change icon size ( s5_icon_size= 48px )
style-6
s6_color – to change icon color
s6_hover_color – to change icon color when hover
s6_icon_size – to change icon size
s6_circle_background_color – to change circle background color ( border color )
s6_circle_background_hover_color – to change circle background color when hover
s6_circle_height – to change circle height
s6_circle_width – to change circle width
s6_line_height – to change circle line height
( circle have radius – but here how circle created is by adding border-radius to 50% of the given height, width )
( try to add same values for – s6_circle_height , s6_circle_width , s6_line_height – if not perfect then change the values )
style-7
s7_color – to change icon color
s7_hover_color – to change icon color when hover
s7_icon_size – to change icon size
s7_box_background_color – to change box background color ( border color )
s7_box_background_hover_color – to change box background color on hover
s7_box_height – to change box height
s7_box_width – to change box width
s7_line_height – to change line height
( try to add same values for – s7_box_height, s7_box_width, s7_line_height – if not perfect then change the values )
style-8
s8_text_color – to change text color
s8_background_color – to change button color
s8_icon_color – to change change icon color
s8_text_color_onhover – to change text color when hover on button
s8_background_color_onhover – to change button color when hover
s8_icon_color_onhover – to change icon color when hover on button
s8_icon_float – to change icon floats on left or right side of text or hide icon
Full width button ( Change width )
There is sub style for style-8 which is style-8.1
created to change width and there is no icon for style-8.1
s8_1_width – to change width of button ( new for style – 8.1 )
s8_text_color – to change text color
s8_background_color – to change button color
s8_text_color_onhover – to change text color when hover on button
s8_background_color_onhover – to change button color when hover
style-9
( since version 1.4 )
s9_icon_size – to change icon size ( s9_icon_size= 48px )
Style-99 – own Image / GIF ( since version 1.5 )
s99_img_height_desktop – To Change the Image Height for Desktop devices
s99_img_width_desktop – To change the image Width for Desktop devices
s99_img_height_mobile – To Change the Image Height for Mobile devices
s99_img_width_mobile – To Change the Image Height for Mobile devices
s99_desktop_img – Image URL to display on Desktop devices
s99_mobile_img – Image URL to display on Mobile devices