百度官方号帮助文档（2）如何开发符合官方号标准的网页

百度官方文档来源：百度站长平台1,863

1.添加canonical标签（必选）

<link rel="canonical" href="http(s)://xxx"/>

要求href的内容为mip页或h5页对应的PC页地址，如果没有PC页的情况，当前页面是mip页面的可以填写h5页面地址，如果也没有h5页面，可以不添加canonical标签；当前页面如果是h5页面，也没有pc页同样可以不添加这个标签。文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

049551496975391文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

2.添加Json_LD数据（必选）

JSON-LD格式示例：文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

  1. <scripttype="application/ld+json">
  2. {
  3.        "@context": "https://zhanzhang.baidu.com/contexts/cambrian.jsonld",
  4.        "@id": "http://www.seoshipin.cn/",
  5.        "title":"SEO视频|seoshipin.cn _ SEO学习视频教程从0基础到高级",
  6.        "images": [
  7.         "http://seoshipin.cn/wp-content/themes/begin/img/logo.png",
  8.         "https://www.seoshipin.cn/wp-content/uploads/2017/05/seorumen.png",
  9.         "https://m.baidu.com/static/index/plus/plus_logo.png"
  10.        ],
  11.        "description": "seoshipin.cn 分享SEO教程视频，从0基础入门开始学习seo，从建站建站教程到seo优化操作到网站运营。",
  12.        "pubDate": "2017-09-06T08:00:01",
  13.        "isOriginal": "0"
  14. }
  15. </script>

 文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

字段说明：文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

@context:必选字段，结构化数据json-ld的schema地址，保持和上例一致文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

@id: 必选字段，当前网页的url文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

title:必选字段，展现在官方号首页中的标题，建议长度：20个字符以内文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

images:可选字段，展现在官方号首页中的图文信息，如果字段存在仅允许提供1张图或3张图的数据文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

description:可选字段，标明网页的内容摘要文章源自SEO视频网-https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html

pubDate: 必选字段，标明网页的发布时间

isOriginal: 可选字段，是否原创的告知字段，1是原创，0不是原创

 

3.添加官方号ID声明（H5页面必选）

  1. <script src="//msite.baidu.com/sdk/c.js?appid=****************"></script>

在页面</head>标签前添加代码

注意：appid为官方号唯一ID，请勿做任何修改，否则无法正常展现。

 

4.添加关注功能代码（强烈推荐，可选）

4.1 H5页面

添加需要展现的bar(只允许添加2个，后期会审核)

4.1.1 吸顶bar，在页面<body>标签后添加代码

  1. <script>cambrian.render('head')</script>

4.1.2 文章段落间bar，在页面段落之间添加如下代码

  1. <script>cambrian.render('body')</script>

4.1.3 底部bar，在页面文章结束位置添加代码

  1. <script>cambrian.render('tail')</script>

注意：上述三种bar在样式上没有预留左右边距，若页面自身没有设置边距，建议按照如下方法使用。其中padding-left、padding-right为边距属性，可按需修改。

吸顶bar：

  1. <div style="padding-left: 17px; padding-right: 17px;">
  2.     <script>cambrian.render('head')</script>
  3. </div>

文章段落间bar：

  1. <div style="padding-left: 17px; padding-right: 17px;">
  2.     <script>cambrian.render('body')</script>
  3. </div>

底部bar：

  1. <div style="padding-left: 17px; padding-right: 17px;">
  2.     <script>cambrian.render('tail')</script>
  3. </div>

 

4.2 MIP页面

4.2.1 引入官方号MIP组件的SDK

在页面mip.js代码<script src="https://mipcache.bdstatic.com/static/v1/mip.js"></script>之后、</body>标签前添加代码

  1. <script src="https://mipcache.bdstatic.com/extensions/platform/v1/mip-cambrian/mip-cambrian.js"></script>

4.2.2使用官方号MIP组件

在页面<body>标签后添加代码

  1. <mip-cambrian site-id="**************"></mip-cambrian>

 

注意：site-id为官方号唯一ID，请勿做任何修改，否则无法正常展现。

建议：紧挨<body>标签添加，能够获得更好的体验。

 
  • 版权声明 本文源自 百度站长平台， 潮涌SEO 整理 发表于 2017年9月15日 15:14:01
  • 转载请务必保留本文链接：https://www.seoshipin.cn/baiduseo/baiduwendang/1431.html