2

我尝试在我的应用程序（iOS）的启动屏幕之后集成插页式广告。它与 Google 提供的用于测试的广告按预期工作。我的问题是创建自己的广告素材。

由于插页式广告只有 4 种授权尺寸（320x480、480x320、768x1024 和 1024x768），我不知道如何为 iPhone 5、6 设置图像...或将 320x480 图像缩放为全屏。

我尝试创建一个 HTML5 广告素材来调整图像大小以适应屏幕，但它仍然是 320x480：

插页式屏幕截图

这是 HTML 5 的代码：

<!DOCTYPE html>
<html>
  <head>
    <title>ad</title>
    <script type="text/javascript">
      var clickTag = "http://www.google.com";
    </script>
    <style type="text/css" media="screen">

html{
  background-color: #CCC;
}
body{
  /* Workaround for some mobile browsers */
  min-height:100%;
} 
.className {
    max-width: 100%;
    max-height: 100%;
    bottom: 0;
    left: 0;
    margin: auto;
    overflow: auto;
    position: fixed;
    right: 0;
    top: 0;
}
    </style>
  </head>
  <body>
  <a href="javascript:window.open(window.clickTag)">
    <img src="image.png" class="className" />
  </a>
  </body>
</html>

我知道可以创建根据屏幕大小分配图像的宏，但我没有找到任何示例。我愿意接受任何建议。

对不起，很长的帖子，它可能是重复的，但提供的答案不起作用。

4

2 回答 2

1

我通过创建自定义广告素材（新广告素材 > 移动应用 > 自定义）找到了可行的解决方案。

我使用下面的代码（代码片段字段）插入图像（调整大小并在屏幕上居中）并将图像链接到点击 URL：

<div style="max-height:100%;max-width:100%; text-align: center;">
  <a href="%%CLICK_URL_UNESC%%%%DEST_URL%%">
        <img src="%%FILE:PNG2%%" style="max-height:100%;max-width:100%;vertical-align: middle;" />
    </a>
</div>
于 2016-08-02T14:56:32.263 回答
0

自定义广告素材是正确的方法，但示例代码应该是这样的。

<div style="width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; background-color: #000; ">
<a href="%%CLICK_URL_UNESC%%%%DEST_URL%%" style="width: 320px; height: 480px; display: block;">
   <img src="%%FILE:PNG1%%" style="width: 320px; height: 480px; vertical-align: middle;" />
</a>

我认为 CSS Flex 选项是这种情况下水平和垂直对齐的最佳选择。

https://jsfiddle.net/9byg3t1n/

于 2017-09-27T12:37:34.283 回答