首页 > 网站推广 > 经验心得

mip-pix统计是什么 mip-pix统计怎么使用

发布时间:2016-12-21 21:00

mip-pix统计是什么,mip-pix 用来支持站长在页面中添加百度搜索的相关统计。这些统计主要包括访问时间,来自的点击title和来自的域名,下面请看详细的介绍。

标题 内容
类型 通用
所需脚本

示例

接入方提供一个接收请求的服务地址,例如:https://yourselfdomain/mip/tj.gif, 如果服务地址不支持HTTPS,可以使用百度提供的HTTPS代理服务使用MIP提供的插件,向服务地址定向发送请求。

如:

<mip-pixsrc="https://yourselfdomain/mipurl/tj.gif?t={TIME}&title={TITLE}&host={HOST}&from=baidu"></mip-pix>

MIP会自动匹配参数,生成请求地址。

例如://yourselfdomain/mipurl/tj.gif?t=1459415529464&title=MIP_PIX_DEMO&host=mip.bdstatic.com&from=baidu

目前支持的参数: {TIME},{TITLE},{HOST}

属性

src

说明:资源方服务地址

必选项:是

很多人都还不知道mip-img图片是什么,以及mip-img图片怎么用,mip-img 用来支持在 mip 中增加图片内容,本次一聚教程网为大家带来了详细的介绍,请看下文。

标题 内容
类型 通用
支持布局 responsive,fixed-height,fill,container,fixed
所需脚本

示例

最基本使用

<mip-img 

 layout="responsive"

width="350"

height="263"

src="http://filesimg.111cn.net/2016/12/16/20161216173855963.jpg"

</mip-img>

加全屏查看

<mip-img

 layout="responsive"

width="350"

height="263"

popup

src="http://filesimg.111cn.net/2016/12/16/20161216173855963.jpg">

</mip-img>

其他布局(以fixed为例)

<mip-img 

layout="fixed-height"

height="263"

alt="baidu mip img"

rc="http://filesimg.111cn.net/2016/12/16/20161216173855963.jpg">

</mip-img>

带图片标题

图片标题可添加在<mip-img>后用于说明,可在<style mip-custom>标签下自定义样式

<mip-img

layout="responsive"

width="350"

height="263"

popup

alt="baidu mip img"

src="http://filesimg.111cn.net/2016/12/16/20161216173855963.jpg"

</mip-img>

<p class="mip-img-subtitle">带图片标题的类型</p>

属性

src

说明:图片地址

必选项:是

格式:字符串

popup

说明:设置图片资源是否可以在被点击后弹出全屏浮层查看

必选项:否

取值:无

alt

说明:与img标签的alt属性相同

必选项:否

class

说明:与img标签的class属性相同,用于标识元素,设置元素样式

必选项:否

mip-iframe 是用来支持在 mip 中嵌入第三方内容的一种方式,需要注意的是:所嵌入的内容强制是符合https协议的,下面请看详细的介绍。

如您的网站还不支持https,可使用百度云加速或其他同类型服务,开通https

标题 内容
类型 通用
支持布局 responsive, fixed-height, fixed
所需脚本

示例

基本使用

<mip-iframe

allowfullscreen

srcdoc="<p>123</p>"

src="http://m.baidu.com"

sandbox=""

allowfullscreen

width="400"

height="300"

allowtransparency="true"> 

</mip-iframe>

加布局(fixed-height为例)

<mip-iframe

layout="fixed-height"

height="50"

allowfullscreen 

srcdoc="<p>123</p>"

src="http://m.baidu.com"

sandbox=""

allowfullscreen

width="400"

height="300"

allowtransparency="true"> 

</mip-iframe>

属性

src

说明:与原生iframe的src属性作用一致

必选项:是

类型:URL

单位:无

取值:必须要使用https地址

默认值:无

width

说明:与高度(height)的比值被mip-iframe用来计算区域的比例和大小

必选项:是

类型:数字

单位:无

默认值:无

height

说明:与宽度(width)的比值被mip-iframe用来计算区域的比例和大小

必选项:是

类型:数字

单位:无

默认值:无

allowfullscreen

说明:与原生iframe的allowfullscreen属性作用一致

必选项:否

取值:空

默认值:无

srcdoc

说明:与原生iframe的srcdoc属性作用一致

必选项:否

类型:HTML_code

单位:无

取值:要显示在 iframe 中的 HTML 内容。必需是有效的 HTML 语法。

默认值:无

sandbox

说明:与原生iframe的sandbox属性作用一致

必选项:否

类型:字符串

单位:无

取值:"", allow-same-origin,allow-top-navigation,allow-forms,allow-script

默认值:无

allowtransparency

说明:与原生iframe的allowtransparency属性作用一致

必选项:否

类型:字符串

单位:无

取值:"",true,false

默认值:无

mip-carousel 用来支持 mip 中图片的一种展示方式,支出多图轮播,下面将为大家详细介绍怎么实现。
标题 内容
类型 通用
支持布局 fixed-height,responsive
所需脚本

示例

response 布局

<mip-carousel 
layout="responsive" 
width="600" 
height="400"> 
<mip-img src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg">
</mip-img> 
<mip-img src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg"> 
</mip-img> 
<mip-img src="http://img3.3lian.com/2013/v9/58/d/25.jpg"> 
</mip-img> 
</mip-carousel> 

自动轮播

<mip-carousel 
autoplay 
layout="responsive"
width="600" 
height="400"> 
<mip-img src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg"> 
</mip-img> 
<mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg"> 
</mip-img> 
<mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg"> 
</mip-img> 
</mip-carousel> 

设置轮播时间间隔

<mip-carousel 
autoplay 
defer="1000"
layout="responsive" 
width="600" 
height="400"> 
<mip-img 
src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg"> 
</mip-img> 
<mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg"> 
</mip-img> 
<mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg">
</mip-img> 
</mip-carousel> 

加指示器

<mip-carousel 
autoplay 
defer="1000" 
layout="responsive" 
width="600" 
height="400" 
indicator 
> 
<mip-img 
src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg">
</mip-img> 
<mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg">
</mip-img>
<mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg"> 
</mip-img> 
</mip-carousel> 

加翻页按钮

<mip-carousel 
autoplay 
defer="1000"
layout="responsive" 
width="600" 
height="400"
indicator 
buttonController 
> 
<mip-img 
src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg">
</mip-img> 
<mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg"> 
</mip-img> 
<mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg"> 
</mip-img> 
</mip-carousel> 

加副标题

<mip-carousel
    autoplay
    defer="1000" 
layout="responsive" 
width="600" 
height="400"
indicator
    buttonController
    >
    <a target="_blank" href="http://wenda.tianya.cn/m/question/1almfj0foas94gc7vtoq6ejbfbmdk3e78ehaa">
        <mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg" layout="responsive" 
width="600"
height="400">
        </mip-img>
        <div class="mip-carousle-subtitle">这里是title2</div>
    </a>
    <mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg">
    </mip-img>
    <mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg">
    </mip-img>
</mip-carousel>

点击图片跳转

非 mip-carousel 直接子级元素的 mip-img 节点需要设置 width 和 height 属性

<mip-carousel
    autoplay
    defer="1000"
layout="responsive" 
width="600" 
height="400">
    <mip-img 
src="http://a2.att.hudong.com/71/04/300224654811132504044925945_950.jpg">
</mip-img>
<a target="_blank" href="http://wenda.tianya.cn/m/question/1almfj0foas94gc7vtoq6ejbfbmdk3e78ehaa">  
<mip-img 
src="http://www.bz55.com/uploads/allimg/150305/139-1503051FS0.jpg" width="600" height="400">
        </mip-img>
    </a>
    <mip-img 
src="http://img3.3lian.com/2013/v9/58/d/25.jpg">
    </mip-img>
</mip-carousel>

属性

width

说明:宽度,不是实际宽度,与高度属性配合来设置图片比例

必选项:是

类型:数字

单位:无

默认值:无

height

说明:高度,不是实际高度,与宽度属性配合来设置图片比例

必选项:是

类型:数字

单位:无

默认值:无

autoplay

说明:自动轮播开关

必选项:否

类型:字符串或空

取值:"",autoplay

单位:无

默认值:无

defer

说明:每次轮播的时间间隔,如果设置了autoplay,可以添加defer来指定轮播的时间间隔

必选项:否

类型:数字

单位:ms

默认值:2000

标签:[!--infotagslink--]

您可能感兴趣的文章: