您的位置：首页 > 网站推广 > 经验心得  >  mip-ad广告组件详解 mip-ad广告组件怎么使用

mip-ad广告组件详解 mip-ad广告组件怎么使用

 更新时间：2016年12月21日 21:00  点击：2120
mip-ad 用来支持站长添加网页内自定义广告，主要包括连接、图文，多图，banner四种形式，这类广告可以制定大小也可以被用户关闭。

标题 内容
类型 通用
支持布局 responsive 文档
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-ad/mip-ad.js
版本v1.0 支持别名mip-embed

示例

通用广告banner样式基本使用

<mip-ad

type="ad-comm"

tpl="onlyImg"

href="//m.baidu.com/s?word=百度"

data-size="1242 180"

src="//m.baidu.com/static/search/ala/ad_1.png">

</mip-ad>

使用别名

<mip-embed

type="ad-comm"

tpl="onlyImg"

href="//m.baidu.com/s?word=百度"

data-size="1242 180"

src="//m.baidu.com/static/search/ala/ad_1.png">

</mip-embed>

mip-vd-tabs 用来支持网页中标签页的显示。标签页内元素较多时不建议使用,会影响页面性能.

标题 内容
类型 通用
支持布局 responsive,fixed-height,fill,container,fixed
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-vd-tabs/mip-vd-tabs.js

示例

一共支持5种样式

等分固定标签页

<mip-vd-tabs>

<section>

<li>第一页</li>

<li>第二页</li>

<li>第三页</li>

<li>第四页</li>

</section>

<div>内容1</div>

<div>内容2</div>

<div>内容3</div>

<div>内容4</div>

</mip-vd-tabs>

横滑标签页

<mip-vd-tabs allow-scroll>

<section>

<li>第一季</li>

<li>第二季</li>

<li>第三季</li>

<li>第四季</li>

<li>第五季</li>

<li>第六季更新至09</li>

</section>

<div>内容1</div>

<div>内容2</div>

<div>内容3</div>

<div>内容4</div>

<div>内容5</div>

<div>内容6</div>

</mip-vd-tabs>

带下拉按钮的横滑标签页

<mip-vd-tabs allow-scroll toggle-more toggle-label="自定义文字">

<section>

<li>第一季</li>

<li>第二季</li>

<li>第三季</li>

<li>第四季更新至09</li>

</section>

<div>内容1</div>

<div>内容2</div>

<div>内容3</div>

<div>内容4</div>

</mip-vd-tabs>

底部标签页

<mip-vd-tabs allow-scroll type="bottom" current="3">

<div>内容1</div>

<div>内容2</div>

<div>内容3</div>

<div>内容4</div>

<section>

<li>第一季</li>

<li>第二季</li>

<li>第三季</li>

<li>第四季更新至09</li>

</section>

</mip-vd-tabs>

剧情展开标签页

<mip-vd-tabs

type="episode"

toggle-more

toggle-label="老九门剧情选集"

allow-scroll

total="23"

current="11"

text-tpl="看第{{x}}集"

link-tpl="http://www.baidu.com/{{x}}/juji">

</mip-vd-tabs>

属性

type

说明：一共有三种特型, bottom(底部选项卡), episode(剧情选项卡), 不填则为默认特型

必填项：否

allow-scroll

说明：允许滑动

必填项：否

toggle-more

说明：是否显示下拉按钮. 前置依赖于allow-scroll属性

必填项：否

toggle-label

说明：下拉说明文字. 前置依赖于toggle-more属性

必填项：否

current

说明：当前已选标签页, 从0开始计数(current="3"表示第4个标签页). 当type="episode"时,表示当前剧集,从1开始计数(current="4"表示第4集),默认为1.

必填项：否

total

说明：剧集总数. 前置依赖于type="episode",并且当type="episode"为必填

必填项：否

page-size

说明：每页显示剧集数. 前置依赖于type="episode",默认为50

必填项：否

text-tpl

说明：显示在标签页上的剧集文案, "第{{x}}集"里的"{{x}}"将被替换成表示集数的数字. 前置依赖于type="episode".

必填项：否

link-tpl

说明：标签页和下拉菜单里的剧集跳转链接, 链接里的"{{x}}"将被替换成表示集数的数字. 前置依赖于type="episode",当type="episode"为必填.

必填项：否

head-title

说明：标签页和下拉菜单里的剧集跳转新页面的头部标题. 前置依赖于type="episode",当type="episode"为必填.

必填项：否

mip-stats-tianrun 用来支持站长添加天润统计，本次为大家带来的mip-stats-tianrun 天润统计详解，为大家全面解析该组件的使用的方法。

标题 内容
类型 通用，定制
支持布局 responsive,fixed-height,fill,container,fixed
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-stats-tianrun/mip-stats-tianrun.js

示例

MIP 提供天润的插件，便于站长更好的接入 MIP，noscript 标签中是的代码是当访客手机不支持JS时直接URL回传统计数据，内容由第三方站长自己实现参数填充，代码示例：

<!-- 人民网CMS自己实现参数填充 noscript 示例：-->

<mip-stats-tianrun>

<noscript>

<img src="//cl2.webterren.com/11.gif?z=26&_wdxid=000000000000000000000000000000000000000000&_wdt=011&_wdc=w_2930&_wdci=7678771&_wda=254&_wdp=2016-10-08&_wdori=%u4e2d%u56fd%u53f0%u6e7e%u7f51%u7efc%u5408&_wdti=%u6e56%u5317%u8b66%u6821%u6821%u82b1%u6652%u82f1%u6b66%u5236%u670d%u7167%u0030%u7ec6%u6570%u8b66%u5bdf%u754c%u7684%u4eba%u6c14%u201c%u7f51%u7ea2%u201d&_wdurl=http://m2.people.cn/mip/r/MV80Xzc2Nzg3NzFfMjkzMF8xNDc1ODgzNjcz?s=baidu-mip&_wdqd=m2_baidu&_wdvs=wap&_wda2=254&_wdot=0" width="0" height="0" alt=""/>

</noscript>

</mip-stats-tianrun>

注意事项

img 的 src 不能写协议

mip-stats-baidu百度统计怎么用？mip-stats-baidu 用来支持站长添加百度统计，详细的使用方法请看下文为大家带来的mip-stats-baidu百度统计详解。

描述 百度统计组件，用于统计页面数据
类型 通用
支持布局 N/S
所需脚本 https://mipcache.bdstatic.com/static/v1/mip-stats-baidu/mip-stats-baidu.js

示例

MIP提供百度统计的插件，便于分析页面数据，需要提前到百度统计这边创建站点，会自动生成js代码使用提取工具提取token，并使用MIP提供的插件，代码示例：

<mip-stats-baidu token="02890d4a309827eb62bc3335b2b28f7f"></mip-stats-baidu>

属性

token

说明：token

必填：是

格式：字符串

[!--infotagslink--]

相关文章

  • 图解PHP使用Zend Guard 6.0加密方法教程

    有时为了网站安全和版权问题，会对自己写的php源码进行加密，在php加密技术上最常用的是zend公司的zend guard 加密软件，现在我们来图文讲解一下。 下面就简单说说如何...2016-11-25

  • ps怎么使用HSL面板

    ps软件是现在很多人都会使用到的，HSL面板在ps软件中又有着非常独特的作用。这次文章就给大家介绍下ps怎么使用HSL面板，还不知道使用方法的下面一起来看看。 &#8195;...2017-07-06

  • Vue组件跨层级获取组件操作

    这篇文章主要介绍了Vue组件跨层级获取组件操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧...2020-07-28

  • Plesk控制面板新手使用手册总结

    许多的朋友对于Plesk控制面板应用不是非常的了解特别是英文版的Plesk控制面板，在这里小编整理了一些关于Plesk控制面板常用的使用方案整理，具体如下。 本文基于Linu...2016-10-10

  • 使用insertAfter()方法在现有元素后添加一个新元素

    复制代码 代码如下: //在现有元素后添加一个新元素 function insertAfter(newElement, targetElement){ var parent = targetElement.parentNode; if (parent.lastChild == targetElement){ parent.appendChild(newEl...2014-05-31

  • 使用GruntJS构建Web程序之构建篇

    大概有如下步骤 新建项目Bejs 新建文件package.json 新建文件Gruntfile.js 命令行执行grunt任务 一、新建项目Bejs源码放在src下，该目录有两个js文件，selector.js和ajax.js。编译后代码放在dest，这个grunt会...2014-06-07

  • 使用percona-toolkit操作MySQL的实用命令小结

    1.pt-archiver 功能介绍： 将mysql数据库中表的记录归档到另外一个表或者文件 用法介绍： pt-archiver [OPTION...] --source DSN --where WHERE 这个工具只是归档旧的数据，不会对线上数据的OLTP查询造成太大影响，你可以将...2015-11-24

  • 如何使用php脚本给html中引用的js和css路径打上版本号

    在搜索引擎中搜索关键字.htaccess 缓存，你可以搜索到很多关于设置网站文件缓存的教程，通过设置可以将css、js等不太经常更新的文件缓存在浏览器端，这样访客每次访问你的网站的时候，浏览器就可以从浏览器的缓存中获取css、...2015-11-24

  • jQuery 1.9使用$.support替代$.browser的使用方法

    jQuery 从 1.9 版开始，移除了 $.browser 和 $.browser.version ， 取而代之的是 $.support 。 在更新的 2.0 版本中，将不再支持 IE 6/7/8。 以后，如果用户需要支持 IE 6/7/8，只能使用 jQuery 1.9。 如果要全面支持 IE，并混合...2014-05-31

  • C#注释的一些使用方法浅谈

    C#注释的一些使用方法浅谈，需要的朋友可以参考一下...2020-06-25

  • Vue实现动态查询规则生成组件

    今天我们来给大家介绍下在Vue开发中我们经常会碰到的一种需求场景，本文主要介绍了Vue动态查询规则生成组件，需要的朋友们下面随着小编来一起学习学习吧...2021-05-27

  • MySQL日志分析软件mysqlsla的安装和使用教程

    一、下载 mysqlsla [root@localhost tmp]# wget http://hackmysql.com/scripts/mysqlsla-2.03.tar.gz--19:45:45-- http://hackmysql.com/scripts/mysqlsla-2.03.tar.gzResolving hackmysql.com... 64.13.232.157Conn...2015-11-24

  • 安装和使用percona-toolkit来辅助操作MySQL的基本教程

    一、percona-toolkit简介 percona-toolkit是一组高级命令行工具的集合，用来执行各种通过手工执行非常复杂和麻烦的mysql和系统任务，这些任务包括： 检查master和slave数据的一致性 有效地对记录进行归档 查找重复的索...2015-11-24

  • js组件SlotMachine实现图片切换效果制作抽奖系统

    这篇文章主要介绍了js组件SlotMachine实现图片切换效果制作抽奖系统的相关资料,需要的朋友可以参考下...2016-04-19

  • php语言中使用json的技巧及json的实现代码详解

    目前，JSON已经成为最流行的数据交换格式之一，各大网站的API几乎都支持它。我写过一篇《数据类型和JSON格式》，探讨它的设计思想。今天，我想总结一下PHP语言对它的支持，这是开发互联网应用程序（特别是编写API）必须了解的知识...2015-10-30

  • PHP实现无限级分类（不使用递归）

    无限级分类在开发中经常使用，例如：部门结构、文章分类。无限级分类的难点在于“输出”和“查询”，例如 将文章分类输出为<ul>列表形式； 查找分类A下面所有分类包含的文章。1.实现原理 几种常见的实现方法，各有利弊。其中...2015-10-23

  • php类的使用实例教程

    php类的使用实例教程 <?php /** * Class program for yinghua05-2 * designer :songsong */ class Template { var $tpl_vars; var $tpl_path; var $_deb...2016-11-25

  • Vue 过渡（动画）transition组件案例详解

    这篇文章主要介绍了Vue 过渡（动画）transition组件案例详解，非常不错，具有参考借鉴价值，需要的朋友参考下...2017-01-26

  • 使用jquery修改表单的提交地址基本思路

    基本思路： 通过使用jquery选择器得到对应表单的jquery对象，然后使用attr方法修改对应的action 示例程序一： 默认情况下，该表单会提交到page_one.html 点击button之后，表单的提交地址就会修改为page_two.html 复制...2014-06-07

  • 双冒号 ::在PHP中的使用情况

    前几天在百度知道里面看到有人问PHP中双冒号::的用法，当时给他的回答比较简洁因为手机打字不大方便！今天突然想起来，所以在这里总结一下我遇到的双冒号::在PHP中使用的情况！双冒号操作符即作用域限定操作符Scope Resoluti...2015-11-08