Home / / How to Make a Contact Button Open WhatsApp

How to Make a Contact Button Open WhatsApp

15 views

How to Make a Contact Button Open WhatsApp

You can make a contact button open WhatsApp instead of opening a standard contact page or contact form.

There are two possible setups, depending on how you want WhatsApp contact to work:

  • Option 1: Use one fixed WhatsApp number for all listings.
  • Option 2: Use a different WhatsApp number for each owner or agent.

Important: The default WhatsApp icon in WpRentals is a share button. It is used to share the listing URL through WhatsApp. It is not a direct owner-contact button by default.

Option 1: Quick Setup With One Fixed WhatsApp Number

This is the fastest option and does not require custom development.

Use this option if all inquiries should go to the same WhatsApp number.

Step 1: Create the WhatsApp Link

Use this format:

https://wa.me/COUNTRYCODEPHONE?text=YOUR-ENCODED-MESSAGE

Example:

https://wa.me/441234567890?text=Hi%2C%20I%20want%20to%20ask%20about%20a%20property.

The phone number must use the full international format, without the plus sign, spaces, brackets, or dashes.

Example:

Correct: https://wa.me/441234567890

Incorrect: https://wa.me/+44 123 456 7890

If you add a pre-filled message, the message text must be URL-encoded. For example, spaces should be replaced with %20.

Step 2: Add the Link to Your Contact Button

In WordPress admin, go to the place where your Contact Us button is configured.

This can be one of these areas, depending on your website setup:

  • Header builder
  • Elementor button
  • Menu link
  • Contact block
  • Custom page section
  • Footer widget

Replace the current button URL with your WhatsApp wa.me URL.

Step 3: Open the Link in a New Tab

We recommend setting the button link to open in a new tab.

After saving the change, clear your website cache, CDN cache if used, and browser cache.

Step 4: Test the Button

Test the button from:

  • mobile, where it should open the WhatsApp app if installed
  • desktop, where it should open WhatsApp Web
  • logged-in and logged-out views

Result: This is the fastest solution, but all inquiries go to the same WhatsApp number.

Option 2: Different WhatsApp Number Per Owner or Agent

This option requires custom development.

Use this option if each listing should contact its own owner or agent directly on WhatsApp.

How This Custom Setup Works

  1. Add a new WhatsApp field for each owner or agent profile.
  2. Save the WhatsApp number as user meta, agent meta, or through a custom field solution such as ACF.
  3. Make sure each listing is connected to the correct owner or agent account.
  4. Customize the listing contact area template to read the current listing owner’s WhatsApp number.
  5. Generate a dynamic WhatsApp link for each listing.

The generated link would use this structure:

https://wa.me/{owner_whatsapp}?text={prefilled_message}

Recommended Validation

For this custom setup, the developer should validate the WhatsApp field carefully.

  • Store only digits in the WhatsApp number field.
  • Use the full country code and phone number.
  • Do not store spaces, plus signs, brackets, or dashes.
  • Escape the output in the template.
  • Add fallback behavior if the owner does not have a WhatsApp number.

Fallback Options

If an owner or agent does not have a WhatsApp number saved, the custom code should use one of these fallback options:

  • hide the WhatsApp button
  • show the standard contact form
  • send the inquiry to a default website WhatsApp number

Testing Required

After the custom development is added, test the WhatsApp button in all listing layouts used on the website.

Test these cases:

  • owner with WhatsApp number
  • owner without WhatsApp number
  • admin-owned listings
  • mobile behavior
  • desktop behavior
  • translated pages, if a multilingual plugin is used

Result: Each listing can contact its own owner or agent directly, but this requires developer customization.

Which Option Should You Choose?

Choose Option 1 if you want a simple no-code setup and all messages can go to the same WhatsApp number.

Choose Option 2 if every property must contact its own owner or agent. This requires custom development and is not part of the default WpRentals contact button behavior.

Important Note

The WhatsApp share icon and a direct WhatsApp contact button are different features.

The share icon lets visitors share the listing link through WhatsApp. A direct contact button opens a WhatsApp conversation with a specific phone number.

Official WhatsApp Link Format

https://faq.whatsapp.com/425247423114725