抛弃第三方自己搭建完美支持HTTPS的社会化分享功能

最后更新： 3年之前在隽永东方内训教程标签： HTTPS, 社会化分享 732 // 评论数 // 参与数

最近给隽永东方官网加载了HTTPS加密，随之带来了一些问题无法解决，比如以前加入的百度分享失效了，不支持HTTPS下的社会化分享，然后转而继续尝试 addthis.com 但是发觉会自动载入graph.facebook.com 这种会严重拖慢速度的资源，后来又尝试了大陆抄袭addthis.com的jiathis.com，发觉还是坑爹的不支持https，最后彻底放弃了第三方工具，寻求自己搭建的本地化方案，花了点时间整理了一份不错的代码，不敢独享，分享给大家，如下：

<?php
$thumb_t = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail' );
$thumb_url_t = $thumb_t['0']; 
$permalink = urlencode(get_permalink($post->ID));
$title = urlencode($post->post_title);
$title = str_replace('+','%20',$title);
$sitename="<span class='wp_keywordlink'><a href="https://www.eastdesign.net" title="隽永东方设计工作室" target="_blank">隽永东方设计工作室</a></span>";
$domainurl="https://www.eastdesign.net";
?>
<p><i class="fa fa-share-alt fa-2x"></i> &nbsp; <a class="sina-icon" title="分享到新浪微博" href="javascript:void((function(s,d,e,r,l,p,t,z,c){var%20f='http://v.t.sina.com.cn/share/share.php?appkey=',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','<?php echo $thumb_url_t; ?>','<?php echo $title;?>','<?php echo $permalink; ?>','utf-8'));"><i class="fa fa-weibo fa-2x"></i></a> &nbsp; <a title="分享到QQ空间" href="javascript:void((function(s,d,e,r,l,p,t,z,c){var%20f='http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?',u=z||d.location,p=['url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=550,height=540,left=',(s.width-550)/2,',top=',(s.height-540)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','<?php echo $thumb_url_t; ?>','<?php echo $title;?>','<?php echo $permalink; ?>','utf-8'));"><i class="fa fa-qq fa-2x"></i></a> &nbsp; <a class="wechat-icon" title="分享到微信朋友圈" href="javascript:void((function(s,d,e,r,l,p,t,z,c){var%20f='http://s.jiathis.com/qrcode.php?',u=z||d.location,p=['url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=140,height=140,left=',(s.width-140)/2,',top=',(s.height-140)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','<?php echo $thumb_url_t; ?>','<?php echo $title;?>','<?php echo $permalink; ?>','utf-8'));"><i class="fa fa-wechat fa-2x"></i></a> </p>

<?php

$thumb_t = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail' );

$thumb_url_t = $thumb_t['0'];

$permalink = urlencode(get_permalink($post->ID));

$title = urlencode($post->post_title);

$title = str_replace('+','%20',$title);

$sitename="隽永东方设计工作室";

$domainurl="https://www.eastdesign.net";

将以上代码存成比如social-share.php并放入当前主题目录，然后通过以下代码调用到single.php这类详情页面：

<?php include(TEMPLATEPATH . "/wechat-share.php"); ?>

1	<?php include(TEMPLATEPATH . "/wechat-share.php"); ?>

打开前台实际测试一下效果如下：

效果有点简陋，不过因为没载入任何图片，采用了 fontawesome 的字体图片，微信二维码生成使用了 http://s.jiathis.com/qrcode.php ，速度挺快的，当然如果是英文类的国外站点，还是直接建议启用addthis.com，效果很好，同时还支持Responsive，有详细的分享统计报告。

隽永东方创始人 & CEO
生于福建长汀，学于海滨大连，创业于国际都市上海，隽永东方设计工作室创始人兼CEO，喜欢音乐、运动、旅游，热心公益事业，在网站设计开发和运营数据中心等领域皆有多年从业经验，独特的国际视角，以客户为中心，视客户需求为核心价值观……
作者： Xiaoge