Add pre-filled Message

Add pre-filled message,

From Plugin Settings ( “Click to Chat”  – “Initial Message” field )

here pre-filled message added  ‘ sales team:’

so this pre-filled message returns in WhatsApp chat box.

For style-1, it return both pre-filled message + user entered text.


[chat style=1  text="for testing style-1: "]
WhatsApp chat


Add Web page URL in pre-filled message

( since version 1. 5 )

In the Initial text filled, add any text as pre-filled text in WhatsApp chat box.

To add the page URL in the pre-filled message – add {{url}} placeholder

{{url}} ( open double curl braces and then ‘url’ and then close double curl braces )

the {{url}} placeholder will be replaced with the Web page URL.

Can add {{url}} placeholder at any place


{{url}}: Hello, How are you

Hello, I am planning to buy this plan – {{url}}

{{url}} will be replaced with the Web page URL


Enable, Disable  –  styles

Enable Floating Styles

if Yes — display Floating Styles,

if No — Floating styles are disabled.

Enable Shortcodes

If Yes — shortcode will show the output content

if No- shortcode output and its inner content will be removed.


WhatsApp chat
it have to display a style

but if enable-shortode — No

then it will remove the returning output and [chat] word also



Text to Display

Text to Display on links, input field

as placeholder value entered here is whatsapp us

this value will return in the input field ( style-1 ) , in link text ( style-2) , in chip style text ( style-4 ) , button ( style-8 )





If you are using shortcodes, by default it will get this value

but you can change this by adding val attribute

[chat val=‘contact us’]

Position to Place

there are four ways to select

  • bottom right
  • bottom left
  • top left
  • top right

we can select any thing and place a fixed style at any place by changing it values.

but its relevant to choose particular position — and add values

can support any css units


10px 10px

2% 2%

1em 1em

position_bottom : 10px i.e. from bottom of the view page 10 pixel up

position_right : 10px i.e. from right side 10 pixel to left


Select Styles

There are eight styles and a style to add own image

For Desktop and Mobile Devices, style are same

but we can choose different style for each device.

( Images )

style – 99 – own Image / GIF ( since version 1.5 )

style — 1

input field

user can enter text and click on submit it will navigate to WhatApp with the text entered in that field

style — 2

plain link

link settings also similar to your theme link settings ( a tag )

because some time we need to add links with in content, and that links have to match the content and other links, so we just left like that

plain link

style — 3

it just a WhatApp logo

can change the height

WhatsApp logo
WhatsApp logo

style — 4

logo + text

simply called chip

chip style
chip style

style — 5


can change size, color

Style — 6

icon with circle border

can change size, color

Style — 7

icon with box border

can change size, color

Style — 8

button with text, icon

can change width, color

Style – 99 – own Image / GIF

Your own Image or GIF

If style – 99 is selected – Add Image URL at Plugin Settings page

( Click to Chat -> Customize styles —  Style-99 own Image )

Different styles for Desktop, Mobile Devices

Can change different styles for Desktops, Mobile devices.

Hide styles based on Device

can Hide on one device and display on other device

by Selecting the last option ‘Hide on Desktop Device’ , it Hide the floating style in Desktop devices.

or at ‘style for Mobile Devices’ can select ‘Hide on Mobile Devices’.

Shortcode Attributes

Hide Styles – based on type of the page

Based on Type of page, can hide Styles

if it is Checked ( ticked ) it means —  Hide Styles on this types of pages

here in above image — we hide Floating Styles on Category pages, Archive pages, 404 page

some post types may not included in this list ( but added feature to hide Styles based on category name, post id ) , that types of pages default to show styles.

so if like to hide on post type that not included in this list then add a category name to that posts, and add that category in Categorys to Hide

or add the post-id’s in Posts, Pages Id’s to Hide


Change shortcode name


Shortcode attributes

Shortcodes- Group chat

Default shortcode name is ‘chat’ — can use like [chat]

At click-to-chat settings page change the value at ‘shorcode name’ field and save changes.

now the shortcode name is ‘c

can use like

[c style=2]

another e.g.

now the shortcode name is ‘whatsapp

can use like

[whatsapp style=2 val=’WhatsApp us’ ]

Related Links: