6

我已经使用 Swiffy 将一个 AS2 flash 文件转换为 HTML5。我也在使用 DoubleClick Studio 来制作广告。我想知道如何在广告上获得点击标签，以便它显示在 DoubleClick Studio 中的事件下，并且我可以编辑目标 URL。

谢谢！

4

4 回答 4

6

解决方案非常简单。看看我的例子。目标 url 可以在 DB Studio 中更新。

HTML：

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title>HTML5 Banner</title>
    <meta name="ad.size" content="width=300,height=250">
    <link rel="stylesheet" type="text/css" href="styles.css" media="all">
    <script src="https://s0.2mdn.net/ads/studio/Enabler.js"></script>
    <script src="https://www.gstatic.com/swiffy/v7.2.0/runtime.js"></script>
    <script src="object.js"></script>
    <script src="script.js"></script>
    <script type="text/javascript">
        var clickTag = "http://www.example.com";
    </script>
</head>
<body>
    <div id="swiffycontainer"></div>
    <div id="bg-exit"></div>
</body>
</html>

脚本.js：

var stage;
if (!Enabler.isInitialized()) {
    Enabler.addEventListener(
        studio.events.StudioEvent.INIT,
        enablerInitialized
    );
} else {
    enablerInitialized();
}
function enablerInitialized() {
    if (!Enabler.isVisible()) {
        Enabler.addEventListener(
            studio.events.StudioEvent.VISIBLE,
            adVisible
        );
    } else {
        adVisible();
    }

}
function adVisible() {
    document.getElementById('bg-exit').addEventListener('click', exitHandler, false);
    stage = new swiffy.Stage(document.getElementById('swiffycontainer'), swiffyobject, {});
    stage.start();
}
function exitHandler(e) {
    Enabler.exit('Exit');
    window.open(window.clickTag);
}

对象.js：

var swiffyobject = {YOUR_SWIFFTY_OBJECT_HERE};

样式.css：

* {
    border:0;
    padding:0;
    margin:0;
}

body, html {
    width:100%;
    height:100%;
    overflow:hidden;
    background:#fff;

    width:100%;
    height:100%;

    position:relative;
}

#bg-exit {
    position:absolute;
    z-index:999999;
    left:0;
    top:0;
    width:100%;
    height:100%;
    overflow:hidden;
    cursor: pointer;
}

#swiffycontainer {
    position:absolute;
    z-index:100;
    width:100%;
    height:100%;
    overflow:hidden;
}
于 2015-07-01T22:02:55.423 回答
3

不幸的是，Google 的 DoubleClick Studio 允许制作 HTML5 横幅广告的唯一工具是Google Web Designer。请参阅文档的“工作室提示”部分。

更新：现在支持 Adob​​e Edge Animate 和手动编码广告。

更新：我已经尝试过了，它确实允许我从 DoubleClick Studio 中控制退出 URL，它确实在输出控制台中跟踪退出。

打开导出为 HTML5 时获得的 HTML 文件(Swiffy) 将 Studio Enabler 添加到文档的头部

<script src="https://s0.2mdn.net/ads/studio/Enabler.js"> </script>

<div id="swiffycontainer">用<div id="bg-exit"> EX包裹你：

<div id="bg-exit">
<div id="swiffycontainer"></div>
<div>

添加以下 CSS 样式以使所需的透明按钮

#bg-exit {
  background-color: rgba(255,255,255,0);
  cursor: pointer;
  height: 100%;
  left: 0px;
  position: absolute;
  top: 0px;
  width: 100%;
}

然后添加以下脚本以添加所需的 Exit。这需要位于文档的底部。

<script>
function bgExitHandler(e) {
  Enabler.exit('Background Exit');
}

document.getElementById('bg-exit').addEventListener('click', bgExitHandler, false);
</script>

上面的所有代码都可以在文档中找到，只需继续执行后续步骤即可。您可以包含其他选项，例如pageLoadHandler，但这将允许您实现能够在工作室中编辑 URL 的目标。

因为它只是复制粘贴，所以这不是一个太糟糕的解决方法，我相信你可以创建一个代码片段来加快速度。

于 2015-04-21T19:46:49.180 回答
2

尝试

...
stage.setFlashVars("clickTAG=%%CLICK_URL_ESC%%%%DEST_URL%%");
stage.start();
...

<script>节内

请参阅https://support.google.com/dfp_premium/answer/6263155?hl=en

于 2015-09-01T12:24:08.467 回答
0

解决这个问题的唯一方法（至少从我发现的）是首先加载 DoubleClick HTML API（https://www.google.com/doubleclick/studio/docs/sdk/html5/en/class_studio_Enabler.html），然后要么....

  1. 使用 JavaScript 在 HTML/JS 中使整个 Swiffy 对象可点击，并在用户点击广告时调用 Enabler.exit()

  2. 使用 ExternalInterface 从 Flash/Swiffy 中调用 JavaScript 方法。然后创建一个反过来调用 Enabler.exit() 的 JavaScript 方法。

于 2015-04-05T18:29:47.570 回答