[Resolved] Make phone numbers clickable

[Author]

Posts

[stewartE]

I have a custom content type called Sites with custom fields to display the location details of my offices with address, phone, number, email etc

One of the fields is a phone number (see attached) which is filled in and displayed on the front end as part of a listing using Views and you can click on each site in the listing to show the individual site page (using Content Templates)

I have had a request from marketing that these phone numbers need to be clickable on mobile. To do this I think I need to make the phone numbers into a clickable link? ( but if i try and add that html into the field itself it just shows on the front end. Is there a way to wrap the field in a tel link in the Content template?

When the field is filled in it would then automatically be in a link and the correct number would be automatically inserted in the link from what what is filled in to the field

Or is there another way to do this?

Thanks

[Beda]

You would add the phone number to the Field, then insert the Field in your Post Body or Content Template using the HTML for clickable numbers:

<a href="tel:[types field='your_number_field'][/types]"</a>

Does that work?

[stewartE]

Hi Unfortunately that didn't seem to work

This is the code i used:

<i class="fa fa-phone-square blue" aria-hidden="true"> '][/types]"

and this is what I saw on the front end where the phone number should be displayed (see screenshot)

(also added screenshot of current shortcode without added anchor link which is displaying the phone number fine)

Thanks!

[Minesh]

Hello. Thank you for contacting the Toolset support.

Well - there is a little issue with the code shared by the Beda.

What if you try to use the following code:

 <a href="tel:[types field='phone' output='raw'][/types]"><i class="fa fa-phone-square blue" aria-hidden="true"> [types field='phone'][/types]</i> </a>

[stewartE]

That worked Thanks!