Getting DCM clicktags to work correctly with swipeable gallery

181 views
Skip to first unread message

Max Schwartz

unread,
Jun 16, 2017, 11:02:47 AM6/16/17
to Google Web Designer beta
How would I go about getting DCM clicktags to work with a swipeable gallery? Each image in the gallery has an exit URL and I need this to work with DCM. Thanks!

San Khong

unread,
Jun 16, 2017, 1:42:57 PM6/16/17
to Google Web Designer beta
Hi Max,

Can you please try using the Exit URLs field in the Advanced properties in the Properties panel? 

Exit URLsA list of URLs, separated by commas (no space), that corresponds to each frame in the gallery.

Thanks,
San
Google Web Designer team

Max Schwartz

unread,
Jun 16, 2017, 1:53:21 PM6/16/17
to Google Web Designer beta
San, this functionally works but is going to be an issue when clicktags are necessary for Google Doubleclick. The ad will not pass validation using this tool:

Please explain how I would use the Exit URLs field to satisfy the clicktag requirements on this page:

San Khong

unread,
Jun 16, 2017, 2:04:55 PM6/16/17
to Google Web Designer beta
In your creative, do you have a logo that you can add an exit url to?  Do you go through DoubleClick Studio before DCM or directly to DCM?  If you go through Studio, another option is to create a dynamic ad and bind the swipeable gallery exits to the exit urls defined in the feed.

Max Schwartz

unread,
Jun 16, 2017, 3:25:33 PM6/16/17
to Google Web Designer beta
As there are 3 different images in the gallery, each with a unique URL, no it would not help to add an exit url to a logo (don't have one anyway). Also, I am preparing the zip for an external advertiser so I will not be going through studio. I need the code to pass the validator with working click-throughs straight from GWD.

San Khong

unread,
Jun 16, 2017, 3:58:48 PM6/16/17
to Google Web Designer beta
Max, I think there is a way to do this by using custom action. Instead of having the exit action on the taparea click/tap event, we can set it on the swipeable gallery frame tap event and the url can be set based on the currentIndex of the gallery.

Right click on the swipeable gallery and select Add event...
Select Swipeable gallery > Frame tap for event.
Select Custom > Add custom action for action.
Give the function a name, then copy and paste the following in the custom action: 
var gallery = document.getElementById("gwd-swipegallery_1");
if (gallery.currentIndex == 1) {
  gwd.actions.gwdDoubleclick.exit('gwd-ad', 'image_1', 'http://www.google.com', true, true);
} else {
  gwd.actions.gwdDoubleclick.exit('gwd-ad', 'image_2', 'http://www.google.com/webdesigner', true, true);
}

where the gwd-swipegallery_1 is the id of the swipeable gallery, image_1 is the metric name, and the last 2 parameters are collapse on exit and pause media on exit.
You can also use the switch statement if you like for your 3 images.

I also attach the sample file.

Hope it helps.
galleryExits.html

Max Schwartz

unread,
Jun 16, 2017, 4:25:55 PM6/16/17
to Google Web Designer beta
How do I follow the clicktag guidelines with this method? I've come up with something similar but fails validator tool.

San Khong

unread,
Jun 16, 2017, 4:53:39 PM6/16/17
to Google Web Designer beta
Ok Max, I found the workaround.

Switch to code view, add the following tags right before the </gwd-doubleclick>

<gwd-exit metric="yourMetric" url="http://www.yourURL.com/image1"></gwd-exit>
<gwd-exit metric="yourMetric2" url="http://www.yourURL.com/image2"></gwd-exit>

Then publish locally from code view and it should work in the html5 validator. These tags will be wiped out next time you do anything in GWD so just remember to insert them before publish from code view.

I will log an issue internally to see if we can support this workflow. Sorry about this.

Thanks,
Reply all
Reply to author
Forward
0 new messages