Support

Account

Forum Replies Created

  • That is Elementor giving you a tip about the code. If you mouse over it, it will say that you should use single quotes.

  • 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 @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

  • Hello @brevalo, I just saw your email, I am not an expert so I would not be comfortable touching your site. Please post your error message here so that we can all see what the issue may be.

  • Hi @brevalo, in Elementor, for the button select Advance and give the button a CSS name like phoneButton. That’s what I did for all the phone buttons on my page. Then I added the script above to Elementor / Custom Code and applied it every page.

    What error are you getting? Be careful with the quotes within the code when you copy and paste. Sometimes they get screwed up and can cause an error. You should retype the quotes within the function just to make sure. Here is my code again that is working for me.

    <script>
    (function($){
    $(“.phoneButton a”).attr(“href”, function ( index, currentvalue) {
    var url_format = currentvalue.replace(/(^\w+:|^)\/\//, “”);
    $(this).attr(“href”, “tel:” + url_format);
    });

    })(jQuery);
    </script>

  • Hi everyone, thanks for the tip but I found that if you just use the bottom portion of the script it works just as well. In elementor I gave all of my ACF phone buttons a css class of phoneButton (I have multiple acf phone buttons so an ID wouldn’t work for me) and then in Elementor Custom Code I added the script below and applied it to the whole site and it worked (you can also add it to your footer.php). What is the reason for the add_filter? that did nothing for me and I removed it from my functions.php page and my ACF phone buttons still work.

    <script>
    (function($){
    $(“.phoneButton a”).attr(“href”, function ( index, currentvalue) {
    var url_format = currentvalue.replace(/(^\w+:|^)\/\//, “”);
    $(this).attr(“href”, “tel:” + url_format);
    });

    })(jQuery);
    <script>

Viewing 6 posts - 1 through 6 (of 6 total)