Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
5

Animate CC - clickTag implementation

New Here ,
Feb 23, 2016 Feb 23, 2016

Does anyone know how to implement a ClickTag var in HTML 5 Canvas file?

TOPICS
How to
69.8K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Enthusiast , Feb 23, 2016 Feb 23, 2016

from a previous post:

Don't do anything in Animate. Don't create button.
Edit exported html file. 1. Add bolded code with your dimensions in html file in </head> section. 2. In </body> section wrap </canvas> tag with <a href> tag.

<head>

<meta name="ad.size" content="width=300,height=250">   // your dimensions !!!

<script type="text/javascript">

var clickTag = "http://www.google.com"; </script>

</head>

<body onload="init();" style="margin:0;">

  <a href="javascript:window.open(window.clickTag)"><canvas i

...
Translate
Enthusiast ,
Feb 23, 2016 Feb 23, 2016

from a previous post:

Don't do anything in Animate. Don't create button.
Edit exported html file. 1. Add bolded code with your dimensions in html file in </head> section. 2. In </body> section wrap </canvas> tag with <a href> tag.

<head>

<meta name="ad.size" content="width=300,height=250">   // your dimensions !!!

<script type="text/javascript">

var clickTag = "http://www.google.com"; </script>

</head>

<body onload="init();" style="margin:0;">

  <a href="javascript:window.open(window.clickTag)"><canvas id="canvas" width="300" height="250"></canvas></a>

</body>

</html>

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 15, 2016 Nov 15, 2016

do i have to insert the url of every ad server? (google) in your example?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Jan 31, 2018 Jan 31, 2018

How and where do you add a clicktag? Can you please list step by step. Thank you!

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Dec 11, 2018 Dec 11, 2018

You can do it in a more simple way.

In Adobe Animate you create a HTML5 canvas and create you banner.

Then you make an invisible button (fx instance name: btn_ClickTag).

Create a new layer (fx AS) and put in:

this.btn_ClickTag.on("click", function() {

  window.open(clickTag, '_blank');

});

If you want to test it, put this code in the published html in <head> section.

<script>var clicktag="http://www.google.com"</script>

!!!! Remove this html code when uploading to DCM. Had problems with that. !!!!

Test it here HTML5 Validator

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Enthusiast ,
Nov 15, 2016 Nov 15, 2016

No we use that as a placeholder of sorts so that once we are done building out the banners we then pass them on to our media team which places into Googles Ad Platform, from there they customize the exact url of the ad to the offer we have going on.

If your using AdServe or Google DCM you can specify your url destination in the campaign.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 15, 2016 Nov 15, 2016

thanks.

I used to make flash banners and add the clicktag in with an invisible button.

I need a simple tutorial that explains the method using animate.

is there new script that goes on the button?

and do i need to modify it once i publish the banner?

thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 27, 2021 Jul 27, 2021

So is the www.google.com replaced dynamiclly then if using AdServe or google DCM. If I leave it blank the validator rejects it with a clicktag error. 

 

 

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Enthusiast ,
Nov 15, 2016 Nov 15, 2016

there is no need to have a clickTAG script in the animate file. You cans till make the button rollover and do whatever but no code is associated with it.

Step-By-Step HTML5 Ad Creation With Adobe Animate CC | Creative Cloud blog by Adobe

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Nov 16, 2016 Nov 16, 2016

Thanks for your responses.

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jan 25, 2019 Jan 25, 2019

This code leads into a problem in Firefox:

<a href="javascript:window.open(window.clickTag)">...</a>

When you click and the window is opening in a new tab, then the banner is not showing anymore in the first tab. There is only a message "object Window".

Better use this code:

<a href="javascript:void(window.open(window.clicktag))">...</a>

javascript - Problem in firefox when calling window.open - Stack Overflow

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Oct 07, 2020 Oct 07, 2020

Simple and effective answer. Thank you. A lot

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 05, 2022 Jan 05, 2022

Someone can give the easiest way to put a clikctag please ? I very bad in code and I need to know the easiest way to do it please, I read this post but I didn't get it. Thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jan 12, 2022 Jan 12, 2022
LATEST

Anyone to explain me step by step how to do it with a transparent button with animate please ? Thanks

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines