No problem @rmooreadrearubin-com. I will write it down here:
First, I created a button and inserted acf in the text field:
Then applied css class for this button in the advanced section:
and at the end I added your script in the Elementor Custom Code:
Any ideas?
Hi @brevalo
Ok, I see 2 problems. Edit your button again and both your Text and Link have to point to ACF link (just like how you have the text). The 2nd thing is in the Elementor Custom Code, change it to <body> – End. The page needs to load first before the script activates. Also, check your quote marks in your script. Quote marks change when you copy them from sites and can screw up your code.
Let me know if that helps.
Robert
@rmooreadrearubin-com why I have to change it to <body> – End? Button is in the middle of the page. <body> – End will apply in the footer
And the second question: Are exclamation marks normal in Elementor Custom Code as they are in your screenshot?
Thank you.
Good morning @brevalo,
The reason why you want the script at the end is that the page needs to load first so that the script can find what to change. If you put the script on top, then the script will execute first before the page loads and won’t find anything to change.
Exclamation marks? There are no exclamation marks in the script. You have to be careful with the quote marks ” “. Single and double quotation marks are common ‘ ‘ or ” “. Below is the script that I used for the ACF links.
<script>
(function($){
$(“.phoneButton a”).attr(“href”, function ( index, currentvalue) {
var url_format = currentvalue.replace(/(^\w+:|^)\/\//, “”);
$(this).attr(“href”, “tel:” + url_format);
});
})(jQuery);
</script>
Hi, @rmooreadrearubin-com
Here are exclamation marks shown in the screenshot you uploaded.
That is Elementor giving you a tip about the code. If you mouse over it, it will say that you should use single quotes.
Hey ACF/Elementor Friends 🙂
Here are some snippets that are working on my client’s site:
PHONE MAILTO
// Convert Mobile to tel link
add_filter('acf/format_value/name=ACF_MOBILE_FIELD_NAME', 'convert_phone_to_link', 20, 3);
function convert_phone_to_link ($value, $post_id, $field) {
if (!$value) {
return $value;
}
$tel_link = preg_replace('/[^0-9]/', '', $value);
$value = '<a href="tel:'.$tel_link.'">'.$value.'</a>';
return $value;
}
EMAIL MAILTO
// Convert Email to mailto link
add_filter('acf/format_value/name=ACF_EMAIL_FIELD_NAME', 'convert_email_to_link', 20, 3);
function convert_email_to_link ($value, $post_id, $field) {
if (!$value) {
return $value;
}
$email_link = $value;
$value = '<a href="mailto:'. $email_link .'">'. $value .'</a>';
return $value;
}
$app_phone_number = get_field(‘xxx’);
$code = ‘+48’
<?php
if ( (strpos($app_phone_number, $code) !== false) && strlen($app_phone_number) > 11 ) {
$country_code = substr($app_phone_number, 3);
} else {
$country_code = $app_phone_number;
}
$tel_link = preg_replace('/[^0-9]/', '', $app_phone_number);
?>
<a href="tel:+<?php echo $tel_link; ?>"><?php echo $country_code; ?></a>
acf_link.png.png
elementor_cu....png
