這幾天在各個系列網站上添加社會化分享按鈕，國内使用百度分享，國外使用AddThis。在普通的PC版本、手機版本或者自适應版本上添加都沒有問題，但要在AMP（谷歌推出的Accelerated Mobile Pages）和MIP（百度推出的Mobile Instant Page）版本裡面添加還有所不同，今天專門看了看，記錄如下。
AMP裡面有專門的amp-social-share插件，代碼示範如下：
<head>
...
<script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script>
...
</head>
<body>
...
<amp-social-share type="email"></amp-social-share>
<amp-social-share type="facebook"
data-param-app_id="254325784911610"></amp-social-share>
<amp-social-share type="gplus"></amp-social-share>
<amp-social-share type="twitter"></amp-social-share>
<amp-social-share type="whatsapp"></amp-social-share>
...
</body>
更詳細的例子情況：amp-social-share，以及驗證amp-social-share rules。
同樣，在MIP中也有對應的mip-share 分享組件，示範代碼如下：
<body>
....
<div class="mip-share-container">
<mip-share></mip-share>
</div>
....
<script src="https://c.mipcdn.com/static/v1/mip-share/mip-share.js"></script>
....
</body>
這個代碼很簡單，是默認提供的分享按鈕，也可以自己根據文檔來進行細節調整或者添加默認不存在的分享按鈕。
评论