skip to Main Content

The seo company I work closely with told me I needed to add this code inbetween the body tags of my meteor project.

<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = 123456789;
var google_custom_params = window.google_tag_params;
var google_remarketing_only = true;
/* ]]> */
</script>
<script type="text/javascript"       src="//www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt=""src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/949352235    /?value=0&amp;guid=ON&amp;script=0"/>
</div>
</noscript>

However as we know script tags don’t get executed properly inside body tags.
So I searched on google to find an answer and I found this code that supposedly works but it’s in REACT. How can I convert this react code into normal javascript that I can refer from a template or something. I’m thinking in a onCreated and or onRendered function.

          GoogleTag = React.createClass({
                displayName : 'GoogleTag',
                render(){
                    var src = '';
                    if(this.props.type === 'conversion'){
                        src =  _.template('//www.googleadservices.com/pagead/conversion/<%=id%>/?label=<%=label%>&guid=ON&script=0'),
                        src = src({id : this.props.id, label : this.props.label})
                    }

                    if (this.props.type === 'remarketing') {
                        src = _.template('//googleads.g.doubleclick.net/pagead/viewthroughconversion/<%=id%>/?value=0&guid=ON&script=0'),
                        src = src({id: this.props.id})
                    }
                    var style = {
                        display : "inline"
                    },
                    imgStyle = {
                        borderStyle : "none"
                    }
                    return (
                        <div style={style}>
                            <img height="1" width="1" style={imgStyle} alt="" src={src}/>
                        </div>
                    )
                }
            })

3

Answers


  1. Place

    <script type="text/javascript">
        var google_conversion_id = 123456789;
        var google_custom_params = window.google_tag_params;
        var google_remarketing_only = true;
    </script>
    <script type="text/javascript" src="//www.googleadservices.com/pagead/conversion.js"></script>
    

    in your head and you will be fine.

    In Meteor you can only have one <head> defined in your project, just create a file called head.html on the client and place the code above inside a body tag in the file.

    Login or Signup to reply.
  2. First, remove any code that you have regarding this. A standard implementation won’t work with Meteor without a custom written implementation.

    Second, take the code block that Google gives you. Throw out all of the JavaScript, and all of the script tags. You don’t need them.

    We’ll be running a ‘non-standard implementation’, but it work’s the same as far as we’re concerned. Take the code within the noscript tags (the div with the img tag), and we need to place it in every place our pages render. So, place it in your Blaze or React layout template, and you should be done.

    Google will detect the noscript implementation (which they create so it’ll work for visitors who don’t have JavaScript enabled, but we are hacking it for use with our implementation), all Google really needs to see is the url call from the img tag 🙂

    Login or Signup to reply.
  3. You can use Google Remarketing library for async actions and write your meta-data via direct call tracking function:

    /* remarketingTrack utility */
    
    export default function remarketingTrack(data = {}) {
          try {
            trackConversion({
              google_conversion_id: SOME_ID,
              google_custom_params: data,
              google_remarketing_only: true
            });
          } catch (e) {
            // error
          }
     }
    
    /** somewhere in ReactJS component **/
    
        componentDidMount() {
           remarketingTrack({
             flight_originid: XXX,
             flight_destid: XXX,
             flight_startdate: date,
             flight_pagetype: 'home',
           });
        }
    

    I think that it’s more flexible and neat solution

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search