Re: Google Phone Website Call Conversions PROBLEM

  • 15 February 2018
  • 12 replies
  • 14 views

I Implemented Google Phone Website Call Conversions a while ago using the following page

I have just noticed that the buttons I use are not as I would like them to appear.

This is how I would like it to appear
03%20am

This is how it actually appears
46%20am

At the very least I would like the “Call Us Now” Text to remain in button

How do I fix this issue
thanks
Rodney


12 replies

Hey @Rodney

The easiest way to re-insert the text before the phone number would probably be to add it via CSS pseudo-class:

#your-button-id .label:before {
  content: 'Call Us Now';
}

As for the formatting of the number itself, I believe Google will match the same formatting of the number that you pass through the following function in the script (at the bottom):

<script>
  $(function(){
  _googWcmGet(ubCallback, '1-800-123-4567')
  });
</script> 

In this part of your script, does your number have the format (00) 0000 0000?

Hi Leah.ann

Thanks for the reply

Not sure where to add this css on my page? Do I add it to the button text field? or style sheet area?
Also do I delete the Call Us Now text from button text field" your instructions are vague.

Also this doesnt address the issue of the number is there a way of hiding the google number and display my number instead?

as for formatting you can see from images that it follows that formate which is fine.

Thanks
Rodney

Sorry @Rodney, I should have been more clear with my instructions!

You’ll want to add the CSS to the stylesheet area at the bottom of your page builder. Be sure to wrap it in <style> tags, so the full text that you’ll paste into the stylesheet will be:

<style>
#your-button-id .label:before {
  content: 'Call Us Now';
}
</style>

You certainly can, and might want to for the sake of keeping things clean, but you don’t have to. What’s essentially happening is that the Google phone call conversion code is replacing all of the button text with the new tracking number, not just the phone number itself.

By adding the text using the :before pseudo-class, it is not affected by the script.

Apologies, I misunderstood what you were wanting here. I thought you just wanted the number formatting to look like 00 0000 0000 instead of (00) 0000 0000.

Unfortunately, the Google number is what needs to be displayed in order for the tracking to work properly.

The way that Google is able to track phone calls on your landing pages is by inserting their own tracking numbers in place of your number. Since they have control of these numbers, they’re able to attribute it to the proper channels on your AdWords account. These tracking numbers will then forward to your number, so from your end everything should be the same. If you removed the Google tracking number and just kept your number, there would be no way for Google to track phone calls.

I hope this was a more clear explanation. Let me know if I didn’t answer any of your questions completely or if you want me to explain anything further!

Hi Leah.ann

Finally got around to testing this and it works but now have a new problem the text is inserted before the number the only problem is that it is all one long sentence that wraps around ie
Line 1: Call Us
Line 2: Now (03) 85669635

Need to put a line break in this CSS somehow so it appears the same as top image on this post
Line 1: Call Us Now
Line 2: (03) 85669635

Any Ideas?

Hi Leah.ann

I have now fixed that issue with following code using \A as a line break

#lp-pom-button-226 .label:before { content: 'Call Us Now \A'; } #lp-pom-button-79 .label:before { content: 'Call Us Now \A'; }

I now have another issue the text now appears at very bottom of button how do I get it to appear in middle of button.

Hey @Rodney

Glad to hear you figured out the line break issue!

Would you mind sharing a link to the landing page that you’re working on? Vertical alignment tends to be a bit finicky and there are a few different ways to approach it depending on how the button is already styled.

Ok sure the page is here

http://ad.synergyhypnotherapymelbourne.com.au/

Thanks
Rodney

Cool, thanks for sharing that with me.

Does this page have the Google tracking script on it? I’m seeing “Call Us Now” twice and your phone number doesn’t look to have changed to the tracking number, so it looks like this:

Screen%20Shot%20on%20Feb%2022nd%20at%2003_05%20PM

When I used the browser DevTools to see what it would look like without the second “Call Us Now”, everything looked to be aligned correctly:

Screen%20Shot%20on%20Feb%2022nd%20at%2003_08%20PM

Are you experiencing something different on your end?

Hi Leah.ann

ok sorry about that forgot to delete the Call Us Now in my second variant. I have now fixed that.

You wont see the google tracking number unless you do a search and click on a adwords ad that I have running only then will google change the number.
You can search for “hypnotherapy melbourne” remember I am in australia. look for synergy hypnotherapy.

you dont need to do this to see the text not aligning properly if you have a look again it will appear as I described
10%20am

My bad, you’re totally right! Sorry about that.

I’m definitely seeing what you’re describing now. Try adding the following CSS to the same stylesheet that you added the other CSS above:

#lp-pom-button-226 .label,
#lp-pom-button-79 .label {
  top: 35%;
}

Hi Leah.ann

Thanks for that all fixed now using the following CSS
indent preformatted text by 4 spaces

<style>

#lp-pom-button-226 .label:before {
content: ‘Call Us Now \A’;
}

#lp-pom-button-79 .label:before {
content: ‘Call Us Now \A’;
}

#lp-pom-button-226 .label {
top: 35%;
}

#lp-pom-button-79 .label {
top: 35%;
}

Wonderful, glad to hear it!

Reply