AdMob设计工具google web designer

1、google web designer工具中文文档：

https://support.google.com/webdesigner?hl=zh-Hans#topic=3227692 我用的版本：应用版本4.2.0.0802

2、google web designer是什么

若是要定制本身的AdMob广告，就须要用到google web designer工具。本质上，这广告是H5页面。google web designer也容许制做除了AdMob外的其余HTML：

 

本质上，google web designer是一个可视化制做H5页面的工具，可是因为一些不完善的地方（或者说BUG）。基本上没有人用它作H5页面，大部分用它只是来制做AdMob广告。
3、特性
可视化制做H5页面，是这个工具的设计视图提供的功能。除此以外，AdMob也提供了代码视图，能够直接修改设计中的代码。注意，代码视图中的代码并非最终生成H5的代码。这个代码和编辑器中的设计视图是对应的。有不少不多用的css属性：

.gwd-page-content {
transform: perspective(1400px) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}

这是css的属性，但上面这一行的属性，也决定了在设计视图中的展现方式，修改会改变在设计视图的显示方式。

<gwd-image id="gwd-image_6" source="assets/index/logo_little_english.png" scaling="stretch" class="gwd-image-ehfx"></gwd-image>

若是是设计视图中添加的图片，在代码视图的是这样一行，最后会转换为H5中的<img>来显示。
4、元素工具
设计视图中，经常使用组件来堆砌页面，常见的有：360度图片。但有些元素是没有的，好比input输入框，这时候须要用到左侧的【元素工具】，本身画一个输入框。
5、发布
预览生成的文件夹：gwd_preview_项目名。
文件夹下有个index.html，这就是入口。
发布的时候，打包后须要校验，google提供的校验网址：https://h5validator.appspot.com/adwords/asset。上传发布的zip包校验便可，在实际测试中，这个校验会涉及注释掉的代码。也就是说，注释代码中有引用不存在的资源，他也会警告。
AdMob广告项目大小限制150k,不容许包含视频，音频。若是要作，只能是网络资源作（但不必定支持）。