Dynamic link support for tel, mailto and anchor

I’m using ACF to collect phone numbers and email addresses, but the dynamic link option is set to always add http:// in front of the content.

Would it be possible to select between http(s), tel, mailto or an anchor?

Also, for buttons the dynamic link will only populate the post meta field if # is used in the button URL.

1 Like

Hey Jesse,

We’re working on some “true” dynamic blocks that will hopefully make this better.

Which Block are you seeing this with? You should be able to input your value without anything being automatically placed in front of it.

This is intended and necessary, as the system is told to look for # and replace it with the dynamic value.

Hi Tom,

Sorry, I think I worded that incorrectly. The http:// is added to the start of the href.

In this example I’ve used a Headline block to get the phone post meta for both the text and link. The same happens with buttons and the site itself is being loaded over https.

And what is the value of the meta field? Does it include the protocol?

We use esc_url() in the output, which is likely what’s added the http:// - however, it shouldn’t add anything if you’ve added your own protocol.

The value is “02 5555 5555” with no protocol.

I have seen someone suggest a solution is to have a second field specifically for the link, but when we only need to add :tel to a phone number or mailto: to an email address it would be a much better user experience to have an option in the block settings

Interesting - does the issue go away if you add the protocol to the meta value?

You’re right that an option to select a custom protocol might be necessary. Of course, you can filter the meta values to include the protocol quite easily if you need a solution right away (let me know if you need help with that).

Yes, I just tested adding tel: in the ACF field and the link output is href="tel:value" so that would work for the two field option.

If you can provide an example of the filter that would be great!

You should be able to use the get_post_metadata filter.

add_filter( 'get_post_metadata', function( $value, $object_id, $meta_key ) {
    if ( 'your_tel_meta_key' === $meta_key ) {
        $value = 'tel:' . $value;

    return $value;
}, 10, 3 );

Let me know :slight_smile: