Google Web Designer横幅缺少点击代码检查验证

Question

我需要创建双击横幅，我正在使用Google Web Designer。我想通过简单的href="javascript:window.open(window.clickTag)"调用clickTag，一切正常，但是当我验证它时

https://h5validator.appspot.com/dcm/asset我收到错误：

缺少点击代码检查

如何删除此错误，我错过了什么？

谢谢

Answer 1

我认为这可以帮助您找到问题的解决方案，请按照以下步骤操作：

第1步：从zip中提取文件。使用任何代码编辑器打开.html文件，对trafficker最有用的是notepad ++。

第2步：html文件<head></head>和<body></body>中将有两个重要部分

<head>部分将有<script type=”text/javascript”>处理大多数功能将出现。
现在粘贴下面的代码之前</head>部分和内部<script type=”text/javascript”>Some Code From Creative </script>
var clickTag = "http://www.google.com";
确保其他标记/功能已关闭，并且您没有在其他标记/功能中粘贴上述代码。

码：

<head>
    <script type=”text/javascript”>
        var clickTag = “http://www.google.com”;
        Somecode of(function() 
        {
            somefunctionality code ...
        }
    </script>
</head>

第3步：在<body>开始后粘贴以下代码，代码的排列可能会影响广告素材的哪些部分可点击，因此请确保使用以下代码覆盖广告素材代码的每个资源

<body>
    <a href="javascript:window.open(window.clickTag)">
        .......Creative assets code...
        .......Some functionality code.....
    </a>
</body>
click tag google web designer

第4步：确保在body中定义的clickTag和head部分中定义的clickTag应该相同。现在保存文件。

第5步：转到所有资源显示的文件夹，选择全部然后创建zip，确保您创建zip而不是rar，因为zip仅支持DFP格式。对于其他服务器，可能会有所不同。

因为如果没有正确压缩所有文件，您可能会收到“未检测到主要HTML文件”此错误

未检测到主要HTML文件

Creative是从Adobe Animate CC构建的

一步解决广告素材问题

步骤1：解压缩zip文件并打开文件夹中的html文件
第2步：在文件sublime / Notepad ++编辑器中打开.html，在<head>部分之前粘贴下面的代码，您可以使用客户端提供的点击跟踪或登录页面URL替换http://www.google.com。

码： var clickTag =“http://www.google.com”;

Adobe_animate_CC_clickTag_Issue_head_section

第3步：现在一旦上面的代码实现了它在实体部分中实现clickTag的时间，因为clickTag区分大小写，请确保在Head部分中实现的clickTag应该与body部分中的clickTag匹配，现在在标记之后实现下面的代码。 Adobe_animate_CC_clickTag_Issue_body_section
第4步：确保标记的位置很重要，您必须覆盖整个画布部分，以便整个广告素材可以点击。

Answer 2

我有同样的问题，我试图按照https://support.google.com/dcm/answer/3145300?visit_id=636892883779240296-1524067146&rd=1#dev>点击标签>示例点击标签插入下的说明。然而，无论我尝试什么，我都无法工作。结果总是：它工作正常，但验证器引发了错误。

所以我回到了“使用Google Web Designer进行退出事件”中描述的第二个选项。完全遵循所有步骤。结果是在验证程序中签入但无法点击的广告素材。

因此，在包含gwd tap区域之后，我还在主体内部手动添加了一个额外的锚点，所以它看起来像这样：

<body>
  <a href="javascript:window.open(window.clickTag)">
    <gwd-google-ad id="gwd-ad" polite-load="">
    (...)
      <gwd-pagedeck class="gwd-page-container" id="pagedeck">
        <gwd-page id="page1" class="gwd-page-wrapper gwd-page-size gwd-lightbox" data-gwd-width="300px" data-gwd-height="600px">
         (...)
            <gwd-taparea id="gwd-taparea_1" class="gwd-taparea-vsnj"></gwd-taparea>
          </div>
        </gwd-page>
      </gwd-pagedeck>
      <gwd-exit metric="CTA-xyz" url="http://abc.de"></gwd-exit>
    </gwd-google-ad>
    <script type="text/javascript" id="gwd-init-code">
     (...)
    </script>
  </a>
</body>

现在我有一个经过验证但也可以点击的广告素材。

Answer 3

使用Google Web Designer（GWD）创建的HTML5广告素材应该在导出到.zip文件之前添加clickTag作为在Google Web Designer中添加的号召性用语（https://support.google.com/webdesigner/answer/3263494?hl=en）。

由于您只有导出的.zip文件，因此您需要返回到GWD并添加号召性用语或遵循我所做的硬编码解决方法：

我会参考你的jsfiddle（http://jsfiddle.net/ae363saf）：

用其余的样式标签粘贴（第8行）。

<style data-exports-type="gwd-taparea" data-gwd-node="true">gwd-taparea{display:block;cursor:pointer;background-color:rgba(0,0,0,0);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}</style>

根据您的广告素材尺寸，您需要修改此代码中的值。创意示例为300x250，因此在以下代码中，设置：height：300px，宽度：250像素， transform-origin：125px 150px 0px， -webkit-transform-origin：125px 150px 0px，和 -moz-transform-origin：125px 150px 0px（半宽，半高，0）。将编辑后的代码粘贴在第13行末尾的</style>之前。

.gwd-taparea-11s4{position:absolute;top:0px;height:300px;left:0px;width:250px;transform-origin:125px 150px 0px;-webkit-transform-origin:125px 150px 0px;-moz-transform-origin:125px 150px 0px}

在</head>之前粘贴（第86行）。

  <script data-source="gwdtaparea_min.js" data-version="4" data-exports-type="gwd-taparea">(function(){'use strict';var c;var d=function(a,b,e){if(e){var f=document.createEvent("CustomEvent");f.initCustomEvent(a,!0,!0,e)}else f=document.createEvent("Event"),f.initEvent(a,!0,!0);b.dispatchEvent(f);return f};var g=[],h=function(a){a=g.indexOf(a);0<=a&&g.splice(a,1)};document.addEventListener("click",function(a){for(var b=0;b<g.length;b++)if(25>Math.abs(a.clientX-g[b].m)&&25>Math.abs(a.clientY-g[b].o)||25>Math.abs(a.screenX-g[b].A)&&25>Math.abs(a.screenY-g[b].B))g.splice(b,1),a.stopPropagation(),a.preventDefault()},!0);var k=function(){};goog.inherits(k,HTMLElement);c=k.prototype;c.createdCallback=function(){this.l=this.j=0;this.f=this.b=this.g=this.c=null;this.a=!0;this.h=this.s.bind(this)};
c.attachedCallback=function(){this.b||(this.c=this.i.bind(this),this.g=this.w.bind(this),this.b=this.v.bind(this),this.f=this.u.bind(this));this.addEventListener("click",this.c,!1);this.addEventListener("touchstart",this.g,!1);this.addEventListener("action",this.h,!1)};c.detachedCallback=function(){this.removeEventListener("click",this.c,!1);this.removeEventListener("touchstart",this.g,!1);this.removeEventListener("action",this.h,!1)};c.i=function(){this.a&&d("action",this);this.a=!0};
c.w=function(a){this.addEventListener("touchmove",this.b,!1);this.addEventListener("touchend",this.f,!1);a=a.touches[0];this.j=a.clientX;this.l=a.clientY};c.u=function(a){this.i();this.removeEventListener("touchmove",this.b,!1);this.removeEventListener("touchend",this.f,!1);a=a.changedTouches[0];a={m:a.clientX,o:a.clientY,A:a.screenX,B:a.screenY};g.push(a);setTimeout(h.bind(null,a),2500)};c.v=function(a){a=a.touches[0];this.a=this.a&&10>=Math.abs(this.j-a.clientX)&&10>=Math.abs(this.l-a.clientY)};
c.s=function(){var a=this.getAttribute("exit-id"),b=this.getAttribute("product-index"),e=this.getAttribute("exit-override-url");e&&!d("tapareaexit",this,{"exit-id":a,url:e,"product-index":b}).detail.handled&&window.open(e)};c.attributeChangedCallback=function(){};document.registerElement("gwd-taparea",{prototype:k.prototype});}).call(this);
</script>
  <script type="text/javascript" gwd-events="support">var gwd=gwd||{};gwd.actions=gwd.actions||{};gwd.actions.events=gwd.actions.events||{};gwd.actions.events.getElementById=function(id){var element=document.getElementById(id);if(!element){var pageDeck=document.querySelector("[is=gwd-pagedeck]");if(pageDeck){if(typeof pageDeck.getElementById==="function"){element=pageDeck.getElementById(id)}}}if(!element){switch(id){case"document.body":element=document.body;break;case"document":element=document;break;case"window":element=window;break;default:break}}return element};gwd.actions.events.addHandler=function(eventTarget,eventName,eventHandler,useCapture){var targetElement=gwd.actions.events.getElementById(eventTarget);if(targetElement){targetElement.addEventListener(eventName,eventHandler,useCapture)}};gwd.actions.events.removeHandler=function(eventTarget,eventName,eventHandler,useCapture){var targetElement=gwd.actions.events.getElementById(eventTarget);if(targetElement){targetElement.removeEventListener(eventName,eventHandler,useCapture)}};gwd.actions.events.setInlineStyle=function(id,styles){var element=gwd.actions.events.getElementById(id);if(!element||!styles){return}var transitionProperty=element.style.transition!==undefined?"transition":"-webkit-transition";var prevTransition=element.style[transitionProperty];var splitStyles=styles.split(/\s*;\s*/);var nameValue;splitStyles.forEach(function(splitStyle){if(splitStyle){var regex=new RegExp("[:](?![/]{2})");nameValue=splitStyle.split(regex);nameValue[1]=nameValue[1]?nameValue[1].trim():null;if(!(nameValue[0]&&nameValue[1])){return}element.style.setProperty(nameValue[0],nameValue[1])}});function restoreTransition(event){var el=event.target;el.style.transition=prevTransition;el.removeEventListener(event.type,restoreTransition,false)}element.addEventListener("transitionend",restoreTransition,false);element.addEventListener("webkitTransitionEnd",restoreTransition,false)};gwd.actions.gwdDoubleclick=gwd.actions.gwdDoubleclick||{};gwd.actions.gwdDoubleclick.exit=function(receiver,exitId,url,opt_collapseOnExit,opt_pauseMedia){gwd.actions.events.getElementById(receiver).exit(exitId,url,opt_collapseOnExit,opt_pauseMedia)}</script>
  <script type="text/javascript" gwd-events="handlers">gwd.auto_Gwd_taparea_1Action=function(event){gwd.actions.gwdDoubleclick.exit("gwd-ad","clickTag","http://www.visitloscabos.travel/",true,true)}</script>
  <script type="text/javascript" gwd-events="registration">gwd.actions.events.registerEventHandlers=function(event){gwd.actions.events.addHandler("gwd-taparea_1","action",gwd.auto_Gwd_taparea_1Action,false)};gwd.actions.events.deregisterEventHandlers=function(event){gwd.actions.events.removeHandler("gwd-taparea_1","action",gwd.auto_Gwd_taparea_1Action,false)};document.addEventListener("DOMContentLoaded",gwd.actions.events.registerEventHandlers);document.addEventListener("unload",gwd.actions.events.deregisterEventHandlers)</script>

在<gwd-metric-configuration>标签内（第90行）。

<gwd-metric-event source="gwd-taparea_1" event="tapareaexit" metric="" exit="Exit"></gwd-metric-event>

在</div>的<div class="gwd-page-content gwd-page-size">之前（第95行）。

<gwd-taparea id="gwd-taparea_1" class="gwd-taparea-11s4"></gwd-taparea>

将您要点击的任何网址（您的clickTag）或默认网址替换为以下网址，因为某些广告服务器可以选择在其界面中修改此网址。在</gwd-doubleclick>之前粘贴（第98行）。

<gwd-exit metric="clickTag" url="https://www.google.com/"></gwd-exit>

将URL替换为您要单击的URL。在括号内的StudioExports函数中粘贴（第138行的结尾）。

Enabler.exit("clickTag", "https://www.google.com/");

将URL替换为您要单击的URL。在括号内的<script type="text/gwd-admetadata"> "exits":[]数组内粘贴（第138行）。

{"exitId":"clickTag","url":"https://www.google.com/"}

在最后一个组件<script type="text/gwd-admetadata">（第138行）之后粘贴到"components":["gwd-doubleclick","gwd-page","gwd-pagedeck"]数组中的"gwd-pagedeck"标记的末尾。

,"gwd-taparea"

保存文件，再次.zip文件夹，现在广告素材应传入Google的HTML5验证器。

Google Web Designer横幅缺少点击代码检查验证

问题描述投票：-1回答：3

3个回答

最新问题

Google Web Designer横幅缺少点击代码检查验证

问题描述 投票：-1回答：3

3个回答

最新问题

问题描述投票：-1回答：3