This blog will teach you how to create a click-to-call button and add it to your word-press website.
What is click to call button?
When the visitor clicks on the click to call button it will automatically show the call option natively.
This will be divided into two steps:
- Creating the button with your phone number.
- Adding it to your Card website.
Create click to call button
- visit click2contact.app and enter your phone number
- Click “Generate Widget”
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2F54425362-2dc2-49ac-93eb-6f92ef2ab9c1%2FUntitled.png%3Ftable%3Dblock%26id%3D39088fb6-6077-4700-9dd3-7cc536062724%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3DVhsDJLKF8mD23TTGafPThgtjb__XVs7PI0k1-JNF4A4?table=block&id=39088fb6-6077-4700-9dd3-7cc536062724&cache=v2)
- Enter your phone number
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2Fa6092014-577e-48f7-9f9b-5e0a5a49c247%2FUntitled.png%3Ftable%3Dblock%26id%3D4568c43a-8258-4200-b91d-fecd7e82804e%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3DIBfZQA_yuRlY5lPAspnRk_69YgyQTqhE-C5S_8rpLjQ?table=block&id=4568c43a-8258-4200-b91d-fecd7e82804e&cache=v2)
- Now if you like update the call label
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2Fa5167171-859e-496d-add6-c4fbe53c7d0d%2FUntitled.png%3Ftable%3Dblock%26id%3Dfc9f7a27-20bc-49e2-91e1-0e758a604ac9%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3Dn8GjO8Egyj6_tlHkTN-6jSys1IwgjrkNrVH0XvoL4d8?table=block&id=fc9f7a27-20bc-49e2-91e1-0e758a604ac9&cache=v2)
- If you like you can add more modes of contact just by entering the value for it like to add click to WhatsApp button i am going to add my WhatsApp number and it will look like this
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2Faab7cb1e-7bc9-46fa-a4c8-5f687ce66c0d%2FUntitled.png%3Ftable%3Dblock%26id%3Df5280046-fff1-4ff3-b987-8568d6474061%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3DAlsSFl8R2sxU0WbvLfH0Yd5kGzxSRicSuGi1Q6NHOe0?table=block&id=f5280046-fff1-4ff3-b987-8568d6474061&cache=v2)
if not continue…
- Now there are other options you can update, Alignment, labels can add profile image messages, designation, and support person names.
- Scroll down and (i) Give the widget a name so you can later manage it from click2contact.app/my-account and (ii) enter your license key then (iii) click “Generate & Send Code”
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2Fe33d8521-6f47-4f6d-beca-f1d17fc6ca87%2FUntitled.png%3Ftable%3Dblock%26id%3Df6b43ad4-9b58-49fb-9610-f6ebad53b2e6%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3D3FYbNATl6ceGu7DPQe-jdIrP2x-4HGIMGJuKX86Xw6I?table=block&id=f6b43ad4-9b58-49fb-9610-f6ebad53b2e6&cache=v2)
- You will receive the code in your email, just copy the highlighted code we will use this to add the click-to-call (click2contact widget) to the WordPress blog
![notion image](https://www.notion.so/image/https%3A%2F%2Ffile.notion.so%2Ff%2Ff%2F3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%2Faeb2455d-495d-43b2-9026-320c8546a86f%2FUntitled.png%3Ftable%3Dblock%26id%3D56c07a4d-961b-489d-9d8a-9edf1fba2c11%26spaceId%3D3e7cd5b0-cb16-4cb7-9f34-898e0b85e603%26expirationTimestamp%3D1739887200000%26signature%3Dzp1dQXZAMw5miS6NHBQI0Kqrdyflp80oTgC0thSJ8tQ?table=block&id=56c07a4d-961b-489d-9d8a-9edf1fba2c11&cache=v2)
Add the Click to call widget to the Squarespace website
Here is quick video from squarespace team
![Video preview](https://i.ytimg.com/vi/8h8EGnUBDho/hqdefault.jpg)
Add code to code injection
To add custom code to code injection:
- In the Home menu, click Settings, click Advanced, then click Code Injection.
- Add valid HTML or scripts into the appropriate Code Injection fields for the header, footer, lock page, or order confirmation page.
- After adding your code, click Save.
Header
Code added here is injected into the <head> tag on every page in your site.
Footer
Code added here is injected before the closing </body> tag on every page in your site.