Question

我尝试将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>

Answer 1

这是this answer的附加/改进。

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

的index.html
styles.css的
backupimage（* .gif / * .jpg）
ajax-loader.gif（我在元素仍在加载时将其用作占位符）
object.js（转换后的Swiffy代码将）
script.js（魔术发生的地方）

备份图像是您应该显示的图像，以防Creative加载，并且ajax-loader.gif可在线广泛使用。因此，我们将重点关注其他4个文件。

<强>的index.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>

<强> styles.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;
}

<强> objects.js

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

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

<强> scripts.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的QA批准，现在正在被投放 - 所以我对我的答案非常有信心 - 尽管如此，只是this answer的改进。

使用swiffy退出转换后的swf上的URL

1 个答案: