0

我尝试将退出 URL 和来自 doubleclick studio 的指标从转换后的带有 swiffy 的 swf 添加到 HTML5 文件。谁能告诉我最有效的方法是什么？HTML5 广告素材中的代码是什么样的？在代码中哪里添加最好？使用什么标签？swiffy 生成的代码对我来说看起来很乱。

<!doctype html>
<html>
  <head>

   <script src="https://s0.2mdn.net/ads/studio/Enabler.js"> </script>
   <link rel="stylesheet" type="text/css" href="exit.css">
   <script src="exit.js"></script>


    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Swiffy Output</title>
    <script type="text/javascript" src="https://www.gstatic.com/swiffy/v7.3.0/runtime.js"></script>

    <script>
      swiffyobject = {"as3":true,"frameRate":25,"frameCount":342,"backgroundColor":-1,"frameSize":{"ymin":0,"xmin":0,"ymax":1800,"xmax":19400},"fileSize":52767,"v":"7.3.0","internedStrings":["::::::6Y:","::::: <<shortend from here>>

  </script>
    <style>html, body {width: 100%; height: 100%}</style>
  </head>
  <body style="margin: 0; overflow: hidden">

    <div id="swiffycontainer" style="width: 970px; height: 90px">
    </div>

    <script>

      var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),
          swiffyobject, {});

      stage.start();
    </script>
  </body>
</html>
4

1 回答 1

1

这是对此答案的附加/改进。

因此，您的 HTML5 文件夹中有一些文件（您将打包成一个 zip 文件，以便在构建过程结束时上传到 Doubleclick Studio）

  • 索引.html
  • 样式.css
  • 备份图片 ( *.gif / *.jpg )
  • ajax-loader.gif （当元素仍在加载时，我将其用作占位符）
  • object.js（转换后的 Swiffy 代码所在的位置）
  • script.js（神奇发生的地方）

备份图像是您应该显示的图像，以防广告素材无法加载，并且 ajax-loader.gif 可以在线广泛使用。所以我们将专注于其他 4 个文件。

索引.html

<html lang="en-US">
    <head>
        <meta charset="UTF-8">
        <title>[ Creative Name ]</title>
        <meta name="ad.size" content="width=300,height=250">

        <link rel="stylesheet" type="text/css" href="styles.css" media="all">

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

        <!-- Make sure that this is the most recent runtime.js from the Swiffy Conversion file -->
        <script type="text/javascript" src="https://www.gstatic.com/swiffy/v7.3.0/runtime.js"></script>
        <script src="object.js"></script>
        <script src="script.js"></script>
    </head>

    <body>
        <div id="swiffycontainer" class="loading"></div>
        <div id="bg-exit"></div>
    </body>
</html>

样式.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;
}

#swiffycontainer.loading {
    background: url("ajax-loader.gif") center center no-repeat;
}

对象.js

复制 swiffy 转换的任何输出并粘贴到 {} 中，如下所示

var swiffyobject = {
"as3":false,"frameRate":24,"frameCount":114,"backgroundColor":-1,"frameSize":{" .... blah blah blah blah }]
};

脚本.js

var stage;
var clickTag;

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('swiffycontainer').className = "";
    document.getElementById('bg-exit').addEventListener('click', exitHandler, false);

    stage = new swiffy.Stage(document.getElementById('swiffycontainer'), swiffyobject, {});
    stage.start();
}

function exitHandler(e) {
    Enabler.exit('Exit');
}

为我做上述工作，我所有使用上述代码的广告素材都已获得 Google 质量检查的批准，现在正在被投放 - 所以我对我的答案非常有信心 - 尽管这只是对这个答案的改进。

于 2015-09-16T04:55:10.940 回答