[原创]网站文章页面添加分享按钮，百度按钮代码复制使用时不显示问题解决！_官网的文章无法分享,分享的按钮离开就会消失-CSDN博客

本文链接：https://blog.csdn.net/u011001714/article/details/82229726

在自己的站点上写了些文章，有些文章想要分享给朋友或者朋友圈等等地方，没有分享功能只能贴网址似乎很不友好，如果通过分享按钮分享的分享出去的不管是在聊天消息还是空间，都是带有标题缩略图和简介的友好样式。

分享代码要自己写？css也自己美化？NO！太费劲了，网上肯定是有统一样式的！

百度“分享按钮”确实找到不少，果断点进了百度的，“分享按钮——百度分享”的连接，还能定制个性按钮，确实好用。

不过事情当然不是很顺利了，不然也就不会写这篇文章了！作为菜鸟的我百度的操作我暂时还是看不懂的！

按钮还是很好看的，复制代码,现在本机新建一个html文档，代码放进去，托到浏览器打开看样式，GG了，啥都没有！

当然了，表面上啥都没有，但是源代码中还是有的，看到标签上定义的class，我就明白了，同时我也想骂人了！

不给css要我自己写吗？？？没有css怎么显示？你页面上的是怎么显示的？？？这就说明他的页面是引用css的，怎么办？找呗！

首先，在分享按钮的定制页面，能显示出按钮的页面上，保存网页，然后只保留按钮的代码和<head>中的所有代码，把其他的都删掉。当然，css和js文件也是要留下的，

方法你可以按下f12打开审核元素，把其他的div删掉，只留下按钮的div再保存网页，
也可以先在代码中找到按钮的代码，复制那一段记好，再把整个页面保存下来，把body中的所有代码删掉，贴上刚才复制的按钮代码！

按钮代码（div引用了一个class所以要留下，不然你可以删掉试一下）

<div class="bdsharebuttonbox">
<a href="http://share.baidu.com/code#" class="bds_more" data-cmd="more"></a>
<a href="http://share.baidu.com/code#" class="bds_qzone" data-cmd="qzone" title="分享到QQ空间"></a>
<a href="http://share.baidu.com/code#" class="bds_tsina" data-cmd="tsina" title="分享到新浪微博"></a>
<a href="http://share.baidu.com/code#" class="bds_tqq" data-cmd="tqq" title="分享到腾讯微博"></a>                                            <a href="http://share.baidu.com/code#" class="bds_renren" data-cmd="renren" title="分享到人人网"></a>
<a href="http://share.baidu.com/code#" class="bds_weixin" data-cmd="weixin" title="分享到微信"></a></div>

最终删掉了所有引用的css和js、只留下了一条引用“share.js”的代码，而按钮在本地依然能够显示，说明share.js就是我们要找的！

到这一步也就差不多了，该的都有了，也就可以使用了。

我要把它放到我的文章页面，需要找一个合适的位置把代码贴上！我选择放在结束的声明位置把！效果就是本页面看到的！