Style-99 – own Image / GIF – shortcode

WhatsApp chat
[chat style=99]

( since version 1.5 )

Shortcode Attributes

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

Instead of changing the image Width, Height add the image URL with perfect  image size.

Style – 99 – Own Image ( more information about style -99 own image / GIF – and added some links to get images )

 

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


[chat style=99  s99_img_height_desktop=100px]
WhatsApp chat

 

Style-9 – shortcode

WhatsApp chat

Shortcode Attributes

s9_icon_size  – to change icon size (  s9_icon_size= 48px )

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


[chat style=9  s9_icon_size=24px]
WhatsApp chat

 

[chat style=9  s9_icon_size=100px]
WhatsApp chat

 

 


Fixed position

[chat style=9 position=fixed bottom=10px right=10px]

 


 

[chat style=9 s9_icon_size=24px; ]

[chat style=9 s9_icon_size=48px;]

[chat style=9 s9_icon_size=96px; ]

 

WhatsApp chat
WhatsApp chat
WhatsApp chat

 

Style-2 – shortcode

[chat style=2]

Shortcode Attributes ( Specific to 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 .. (  none, underline, overline, line-through, initial, inherit )
s2_decoration_onhover  – to chagne text decoration on hover (  none, underline, overline, line-through, initial, inherit ) ( e.g.  s2_decoration_onhover=underline )

 

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,  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


 

[chat style=2 s2_text_color=#ff9100  s2_text_color_onhover=#ffa726  s2_decoration=underline  s2_decoration_onhover=none ]

 


Fixed position

[chat style=2 position=fixed bottom=10px right=10px]

( fixed position  – bottom right corner )

Style-3 – shortcode

WhatsApp chat

Shortcode Attributes ( Specific to Style-3 )

s3_icon_size  – to change icon size (  s3_icon_size= 48px )

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


[chat style=3  s3_icon_size=24px]
WhatsApp chat

 

[chat style=3  s3_icon_size=100px]
WhatsApp chat

 

 


Fixed position

[chat style=3 position=fixed bottom=10px right=10px]

 

 


 

[chat style=3 s3_icon_size=24px; ]

[chat style=3 s3_icon_size=48px;]

[chat style=3 s3_icon_size=96px; ]

 

WhatsApp chat
WhatsApp chat
WhatsApp chat

 

Style-4 – shortcode

Contact PersonWhatsApp us

 

Shortcode Attributes ( Specific to 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.

 

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,  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


 

[chat style=4   s4_text_color=#ffa500  s4_background_color=#c6ff00  ]
Contact PersonWhatsApp us

 


Fixed position

[chat style=4 position=fixed bottom=10px right=10px]

 

Style-5 – shortcode

 

Shortcode Attributes ( Specific to 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 )

 

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


 

[chat style=5  s5_color=#ffa500    s5_hover_color=#ffbb3d     s5_icon_size=48px   ]

 

 


Fixed position

[chat style=5 position=fixed bottom=10px right=10px]

 

Style-6 – shortcode

 

Shortcode Attributes ( Specific to 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 )

 

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


 

[chat style=6 s6_color= #fff s6_hover_color=orange     s6_icon_size=50px   s6_circle_background_color=#9cff57  s6_circle_background_hover_color =#00e51e  s6_circle_height=100px   s6_circle_width=100px   s6_line_height=100px ]

 

 


Fixed position

[chat style=6 position=fixed bottom=10px right=10px]

 

Style-7 – shortcode

 

Shortcode Attributes ( Specific to 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 )

 

num  – ( to change the number )
style  – (  e.g. style=1   – right now there are 8 styles )
position  –  ( e.g. position=fixed  – to add fixed position style,  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


 

[chat style=7  s7_color= #fff    s7_hover_color=#ffa500    s7_icon_size=50px     s7_box_background_color=#9cff57   s7_box_background_hover_color=#00e51e      s7_box_height=100px     s7_box_width=100px      s7_line_height=100px ]

 

 


Fixed position

[chat style=7 position=fixed bottom=10px right=10px]

 

Style-8 – shortcode

[chat style=8]

 

Shortcode Attributes ( Specific to 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  –   (  left, right , hide )  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

 

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,  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

 


 

[chat style=8  s8_text_color=#a7ffeb      s8_background_color=#1de9b6     s8_icon_color=#a7ffeb     s8_text_color_onhover=#ddd     s8_background_color_onhover=#00cbcc       s8_icon_color_onhover=#ddd        s8_icon_float=right   ]

 

 

 

Change Width  ( using style 8.1 )

 

[chat style=8.1 val=' support team'     s8_1_width=40% ]
[chat style=8.1 val='Chat with Sales Team' s8_1_width=60% ]
[chat style=8.1 val='Chat with COO'     s8_1_width=80% ]
[chat style=8.1 val='Chat with CEO'    s8_1_width=100% ]

 


Fixed position

[chat style=8 position=fixed bottom=10px right=10px]

 

Style-1 – shortcode

[chat style=1]

Shortcode Attributes

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,  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

Style-1 is the default theme button. (looks like currently activated Theme button). For customizable button, please select style-8.


Fixed position

[chat style=1 position=fixed bottom=10px right=10px]