Add a WordPress click-to-call button with ButtonFlow

This guide is for one specific handoff: a visitor taps the mobile CTA and their device follows a tel link to the business phone line. Keep the number, label, and display boundary clear so the button does not compete with other contact paths.

WordPress phone CTAmobile tap-to-call buttontel link button WordPress

Make a phone tap do one predictable thing.

A click-to-call button works when its only job is to open the business line. ButtonFlow supplies that focused mobile handoff while the page keeps its full contact details for visitors who need more context.

Phone number hidden in context

  • Visitors search the header or footer for the number
  • The visible phone text is easy to miss on a long page
  • The mobile next step competes with unrelated links

A direct call handoff

  • One mobile tap follows the configured tel link
  • The CTA stays available at the mobile-only boundary (<=767px)
  • Desktop visitors keep the existing page layout

Treat the phone value as configuration, not copy.

In Settings → ButtonFlow, choose the Phone Call action and enter the business number in international format. For example, +12025550147 is an explicit value that can be checked before publishing; do not rely on a local-only number that changes meaning across regions.

ButtonFlow uses the configured value for a tel link. The label can explain the action, while the icon, colors, Small, Medium, or Large size choice, and show delay control how the button appears. Those presentation choices should support the phone action rather than introduce a second destination.

The button is mobile-only at the <=767px boundary. If a page already has a prominent desktop contact treatment, leave it in place and use ButtonFlow for the smaller-screen call handoff.

Start with a number and a page boundary.

These are variations of one site-wide Phone Call configuration. The phone value is always the call destination, and page exclusions control where the CTA does not appear.

Primary service line

Action: Phone Call. Phone value: +12025550147. Label: Call the office. ButtonFlow follows tel:+12025550147 after the tap.

  • Use the international number that the business wants visitors to call

Compact mobile treatment

Keep Action set to Phone Call, use the label Call now, choose Small, and set the icon and colors to match the existing mobile palette.

  • Use show delay only to control when the CTA enters the viewport

More prominent service CTA

Keep the same Phone Call value, use the label Speak with our team, choose Medium or Large, and verify the text remains clear at a 320px-wide viewport.

  • Do not change the destination while testing presentation variants

Exclude mismatched pages

Keep Phone Call enabled site-wide, then add the WordPress IDs or slugs for pages where a direct call is not the right action to ButtonFlow's page exclusions.

  • Check an excluded page and an included page after saving

Set up the click-to-call path in five checks.

A short verification loop catches formatting mistakes before a visitor tries to call from a phone.

  1. Install ButtonFlow

    Install ButtonFlow from the WordPress plugin directory and activate it on the site.

  2. Open the plugin settings

    Go to Settings → ButtonFlow and select Phone Call as the action type.

  3. Enter the international number

    Add the business phone value in international format, then confirm the number against the site's published contact details.

  4. Set the presentation

    Choose the label, icon, colors, Small, Medium, or Large size, and show delay. Keep the label specific to calling.

  5. Test and exclude where needed

    Save, test the tel link at the <=767px boundary, and add page IDs or slugs to the exclusion list where the call CTA should not appear.

Verify the handoff, not just the styling.

A call CTA is ready when the destination and display rule are both easy to confirm.

Number check

Compare the international value in Settings → ButtonFlow with the number the business has approved for incoming calls.

  • Check that no local prefix or spacing convention changed the intended number

Tap check

At a mobile viewport, tap the button and confirm the device receives a tel link for the configured number.

  • Use a phone or a test environment that can handle tel links

Boundary check

Resize above and below 767px, then visit one included and one excluded page to confirm the visibility rule.

  • Review page IDs and slugs whenever the site's URL structure changes
ButtonFlow settings showing the shared label, icon, Action Type, Action Value, appearance controls, and live preview, with WhatsApp Chat selected as the example action
ButtonFlow uses this same settings screen for Phone Call: select Phone Call under Action Type and enter the international phone number in Action Value. The screenshot uses WhatsApp Chat to show the complete set of controls.

Common questions.

Does ButtonFlow create a tel link for Phone Call?

Yes. The Phone Call action uses the configured international phone value for a tel link, so tapping the mobile CTA hands the number to the device's calling behavior.

What phone-number format should I use?

Enter the business number in international format in Settings → ButtonFlow. Confirm the value against the number the business has approved before publishing.

Will the click-to-call button show on desktop?

No. ButtonFlow v1.2.0 is mobile-only and shows the CTA at the <=767px boundary.

Can I control how the button looks?

Yes. Configure the label, icon, colors, Small, Medium, or Large size choice, and show delay in ButtonFlow's settings.

Can I hide the call CTA on selected pages?

Yes. Use ButtonFlow's page exclusion controls with WordPress page IDs or slugs, then test both excluded and included pages.

Put this guide into practice with ButtonFlow.

Review the plugin features, requirements, and other implementation guides, or install it directly from WordPress.org.