Can't set different title on Google Analytics

Question

I'm trying to set up a different page's title. I put that code on the head of the page:

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-XXXXXXX-Y');
    ga('send', 'pageview');
    ga('set', 'title', 'Invitation');
</script>

I'd like to set up the 'title' as 'Invitation' but I have no feedback from Google Analytic's side. Obviously I changed UA-XXXXXXX-Y into my personal code. Right now I can only see that the page has been visited but it has the page's default title instead of the overridden one.

Answer 1

Pass the title as an additional and optional parameter when you send the pageview.

ga('send', 'pageview', {
    title: 'Invitation'
});

There is more info on page tracking on google developers.

Answer 2

You'd need to swap the send and set calls. Any set calls need to be before a send call.

<script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

    ga('create', 'UA-XXXXXXX-Y');
    ga('set', 'title', 'Invitation');
    ga('send', 'pageview');
</script>

FYI - By utilizing the set command you'll be changing the page title for all subsequent calls on that page. If you pass it as an optional parameter as in Blexy's example, it'll only change it for that single call. All subsequent calls will then use the default value.