Segment Users In Wingify Engage Through GTM

Google Tag Manager simplifies the process of making any changes to your website, tracks results, saves time, and a lot more. Hence, segmenting your users using GTM makes its implementation, for you, easier, reducing technical hassles.

Here is a detailed process flow to segment your subscribers with Google Tag Manager.

1. Sign in to https://tagmanager.google.com, and set up an account. Add an Account name of your choice and click Continue.
2. Once you have set up the Account, you’ll be prompted to Setup Container. Here, type the Container name, that is, your website name. Under the option, ‘Where to use container’, click on Web. Now click on Create. Please refer to the image below:
   
3. A box will appear, asking you to agree/disagree with Google Tag Manager's terms of service agreement. Click  Yes, which will be shown on the top right corner of the page.
4. To install Google Tag Manager on your website, follow the instructions that will now appear. Please take a look at the image below for reference. Please remember to open your website on another tab, keeping the GTM tab open. Once you have done this, please click on OK.
5. After clicking on OK, go back to the tab on which the GTM account is open. Under Workspace, on the left side of the panel, click on Triggers, as shown in the image below.
   
6. Now, you’ll see a red button, that says ‘New’. Click on it.
7. You would now want to name your Trigger. We have named it TyrionLannister. Once naming it, click on the Edit icon in the right side, as shown in the image below. Or you could also click anywhere in the blank space of the box.
   
8. Now, you’ll be asked to Choose Trigger type. Click on Page View, as shown in the image below.
   The Page View type trigger enables you to add a user to a particular segment when s/he lands on a certain page/URL, if the URL of that page contains that category/segment name.
9. You’ll now be asked to give details about the Trigger configuration. Under This Trigger fires on, click on Some Page Views.

10. Set rules for the Trigger:
    Follow the sequence below to assign values for 'Fire this trigger when an Event occurs and all of these conditions are true':
    Page URL => contains => houselannistermerchandise(segment you want the subscriber to be added to) => Save

    Note that where we have mentioned houselannistermerchandise, you may type in the category or segment you want the subscriber to fall under for this specific trigger. It could be ‘shoes’ or ‘clothing’ or ‘fictionfantasy’ or whatever you may like. Please click here to know the specifications required for naming the segment.

11. Now, on the left side of the panel, click on Tags. Then, click on the option called ‘New’.
12. Type a tag name of your choice, as shown by the arrow in the image below. Then click anywhere in the blank space in the Tag Configuration box.
13. Under Choose tag type, scroll down to Custom and click Custom HTML.
    In the box that will now appear, you’ll be asked to Choose tag type, scroll down to Custom. You’ll see an option Custom HTML. Click on it.
14. Copy and paste Javascript code to Custom HTML box
    Now, copy the code given below and paste it in the blank white space provided, under HTML.

<script> window._pcq = window._pcq || []; _pcq.push(['APIReady', callbackOnAPIReady]); //will execute callback function when Wingify Engage API is ready   _pcq.push(['subscriptionSuccessCallback',callbackOnSuccessfulSubscription]); //registers callback function to be called when user gets successfully subscribed   function callbackOnAPIReady() { //now api is ready _pcq.push(['addSubscriberToSegment', 'houselannister']); }   function callbackOnSuccessfulSubscription(subscriberId, values) { //user just got subscribed _pcq.push(['addSubscriberToSegment', 'houselannister']); } </script>

This code adds a subscriber to the segment you specify. For more information on this, please click here. Also, please note that we have named our segment ‘houselannister’ as an example, in the code, in two places. You may name it as per your choice. Please refer to the image where you can replace this name (underlined in red).

If you want to remove a user from a segment, repeat the same instructions as above, but with the following code instead.

<script>
window._pcq = window._pcq || [];
_pcq.push(['APIReady', callbackOnAPIReady]); //will execute callback function when VWO Engage API is ready
function callbackOnAPIReady() {

_pcq.push(['removeSubscriberFromSegment', 'houselannister']);  
}
</script>

Attention:  Before placing these tags on any page, make sure you have implemented Wingify Engage (formerly PushCrew) SmartCode on that page. This code will not work without the SmartCode. Click here to know how to implement this SmartCode. It won't fire Wingify Engage opt-in again if your user has already subscribed to push notifications.

  15. Now, scroll slightly down, and you’ll see ‘Advanced Settings’. Click on it.

  16. Now, go over to Tag firing options and choose Once per page.

  17.  Now, scroll down to the second box, named Triggering. Click anywhere on the blank white space.

  18. You’ll now be asked to choose the trigger for this specific tag. 
        Choose the trigger you created from step 7.  Refer to the image below and step 7 for better clarity. 



The image below shows what the window will look like after choosing the trigger you created from step 7.

 19.  Now click the blue button Save, placed on the right-hand side of the tag name.

 20. Upon successfully completing this process, below is what your GTM page will look like for the specific Tag and trigger you created.

Need more help?

For more information or further assistance, contact Wingify Support.