一、功能介绍
B2主题集成了完整的微信分享功能,支持将网站内容分享到微信好友、微信朋友圈、QQ、微博和QQ空间等平台。分享内容包括标题、描述、链接和缩略图,并且可以根据需要自定义是否显示站点名称。
![图片[1]-B2主题免插件实现微信QQ卡片分享-三尾狐](https://img.sanweihu.com/2025/12/20251215005146323-image.png)
二、准备工作
在使用微信分享功能前,您需要准备一个微信认证的服务号(订阅号没有此功能),并完成以下配置:
1. 获取微信公众号信息
- 登录微信公众平台
- 进入左侧菜单最下面的基本配置
- 获取开发者ID(AppID) 和开发者密码(AppSecret)
2. 配置微信公众号
- IP白名单配置
- 在基本配置中,将您网站服务器的IP地址添加到IP白名单中
- 域名配置
- 进入公众号设置 → 功能设置
- 配置业务域名、JS接口安全域名、网页授权域名三项为您的站点域名
- 服务器配置(可选,用于高级功能)
- 在基本配置中,设置服务器配置
- 稍后会在B2主题设置中获取相关配置信息
三、B2主题微信设置
1. 进入微信设置页面
- 登录WordPress后台
- 进入B2设置 → 常规 → 微信设置选项卡
2. 基本配置
在微信设置部分,填写以下信息:
| 配置项 | 说明 |
|---|---|
| 微信公众号appid | 从微信公众平台获取的AppID |
| 微信公众号appsecret | 从微信公众平台获取的AppSecret |
3. 微信分享设置
在微信分享设置部分,配置是否在分享时显示站点标题:
- 显示:分享到微信和QQ时,标题中会包含站点名称(如:”文章标题 – 站点名称”)
- 隐藏:分享到微信和QQ时,标题中不包含站点名称(如:”文章标题”)
4. 高级配置(可选)
如果需要使用微信自动回复等高级功能,还需要配置:
- 公众号自动回复
- Token
- EncodingAESKey
这些信息需要在微信公众平台的服务器配置中获取。
四、分享功能使用
在文件/b2/Modules/Templates/Footer.php第26行-67行下方代码(代码可能有偏差,照着结构改就行)
public function get_wxshare_data(){
将以下代码段修改为以下以下内容:
public function get_wxshare_data(){
if(!b2_is_weixin()) return;
$key = b2_get_option('normal_weixin','weixin_appid');
$secret = b2_get_option('normal_weixin','weixin_appsecret');
if(!$key || !$secret) return;
$jssdk = new \JSSDK($key, $secret);
$signPackage = $jssdk->getSignPackage();
if($signPackage){
global $post;
$img = '';
// 获取文档标题并确保中文字符正确处理
$title = wp_get_document_title();
// 全面解码HTML实体
$title = htmlspecialchars_decode($title, ENT_QUOTES | ENT_HTML5);
// 替换特定的HTML实体
$title = str_replace('–','-', $title);
// 获取描述并确保中文字符正确处理
$desc = Seo::get_desc();
// 全面解码HTML实体
$desc = htmlspecialchars_decode($desc, ENT_QUOTES | ENT_HTML5);
// 替换特定的HTML实体
$desc = str_replace('–','-', $desc);
// 确保所有文本字段都是UTF-8编码
$title = mb_convert_encoding($title, 'UTF-8', 'auto');
$desc = mb_convert_encoding($desc, 'UTF-8', 'auto');
// 获取当前页面URL
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = $protocol.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
// 根据页面类型获取分享图片
if(isset($post->ID)){
$post_type = get_post_type($post->ID);
// 处理不同的文章类型
switch($post_type){
case 'circle':
$imgs = get_post_meta($post->ID,'b2_circle_image',true);
if(isset($imgs[0])){
$img = wp_get_attachment_url($imgs[0]);
}else{
$img = Post::get_post_thumb($post->ID);
}
break;
case 'document':
// 文档类型特殊处理,确保获取正确的缩略图
$thumb = get_post_meta($post->ID, 'b2_post_thumb', true);
if($thumb){
$img = $thumb;
}else{
$img = Post::get_post_thumb($post->ID);
}
break;
default:
$img = Post::get_post_thumb($post->ID);
break;
}
}elseif(is_archive() || is_category() || is_tag()){
// 分类/标签/归档页面
$term = get_queried_object();
if(isset($term->term_id)){
$img = Seo::get_term_meta($term->term_id, 'b2_tax_img');
}
}
// 如果没有获取到图片,使用默认图片
if(empty($img)){
$img = b2_get_default_img();
}
// 确保图片URL是完整的
if(strpos($img, 'http') !== 0){
$img = home_url().$img;
}
// 处理图片尺寸
$img = b2_get_thumb(array('thumb'=>$img,'width'=>300,'height'=>300));
// 如果图片还是不完整,再次处理
if(strpos($img, 'http') !== 0){
$img = home_url().$img;
}
// 移除所有字段中可能存在的反引号
$img = str_replace('`', '', $img);
$url = str_replace('`', '', $url);
$desc = str_replace('`', '', $desc);
$title = str_replace('`', '', $title);
// 再次确保所有文本字段都是UTF-8编码
$title = mb_convert_encoding($title, 'UTF-8', 'auto');
$desc = mb_convert_encoding($desc, 'UTF-8', 'auto');
return array('msg'=>$signPackage,'post_data'=>array(
'imgUrl'=>$img,
'link'=>$url,
'desc'=>$desc,
'title'=>$title
));
}
return;
}
继续在此文件以下代码
wp_cache_set('b2_copyright',$output,'b2_copyright',DAY_IN_SECONDS);
return $output;
}
添加以下代码:
public function weixin_share(){
$share_data = $this->get_wxshare_data();
if(!$share_data) return;
$wx_data = $share_data['msg'];
$post_data = $share_data['post_data'];
// 添加新的分享API,确保兼容性
$js_api_list = apply_filters('b2_footer_wx_js_api_list', [
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'updateTimelineShareData',
'updateAppMessageShareData',
'onMenuShareQZone'
]);
$js_api_str = "'" . implode("','", $js_api_list) . "'";
// 检查是否需要隐藏站点标题
$show_site_title = b2_get_option('normal_weixin', 'weixin_share_show_site_title');
$title = $post_data['title'];
if($show_site_title != 1){
// 移除标题末尾的站点名称和分隔符
$site_name = get_bloginfo('name');
// 确保中文字符正确处理
$site_name = mb_convert_encoding($site_name, 'UTF-8', 'auto');
$title = mb_convert_encoding($title, 'UTF-8', 'auto');
// 定义可能的分隔符
$separators = array(' - ', ' | ', ' _ ', ':', ': ', '- ', '| ', '_ ', ': ', ':');
// 只移除标题末尾的站点名称和分隔符
foreach($separators as $sep){
$site_pattern = $sep . preg_quote($site_name, '/') . '$';
$title = preg_replace('/' . $site_pattern . '/', '', $title);
}
// 清除可能产生的多余空格
$title = trim(preg_replace('/\s+/', ' ', $title));
}
// 移除所有字段中可能存在的反引号(双重保险)
$post_data['imgUrl'] = str_replace('`', '', $post_data['imgUrl']);
$post_data['link'] = str_replace('`', '', $post_data['link']);
$post_data['desc'] = str_replace('`', '', $post_data['desc']);
$post_data['title'] = str_replace('`', '', $post_data['title']);
$title = str_replace('`', '', $title);
?>
<script>
wx.config({
debug: false, // true:调试时候弹窗
appId: '<?php echo $wx_data['appId']; ?>', // 微信appid
timestamp: '<?php echo $wx_data['timestamp']; ?>', // 时间戳
nonceStr: '<?php echo $wx_data['nonceStr']; ?>', // 随机字符串
signature: '<?php echo $wx_data['signature']; ?>', // 签名
jsApiList: [<?php echo $js_api_str; ?>]
});
wx.ready(function() {
// 分享配置
var shareConfig = <?php echo wp_json_encode(array(
'imgUrl' => $post_data['imgUrl'],
'link' => $post_data['link'],
'title' => $title,
'desc' => $post_data['desc']
)); ?>;
// 确保图片URL是完整的
if (shareConfig.imgUrl.indexOf('http') !== 0) {
shareConfig.imgUrl = '<?php echo home_url(); ?>' + shareConfig.imgUrl;
}
// 统一的分享回调
function onShareSuccess() {
// 分享成功不显示提示,避免影响用户体验
}
// 微信好友分享
var friendShareData = {
title: shareConfig.title,
desc: shareConfig.desc,
link: shareConfig.link,
imgUrl: shareConfig.imgUrl,
type: 'link',
dataUrl: '',
success: onShareSuccess
};
// 朋友圈分享
var timelineShareData = {
title: shareConfig.title,
link: shareConfig.link,
imgUrl: shareConfig.imgUrl,
success: onShareSuccess
};
// QQ分享
var qqShareData = {
title: shareConfig.title,
desc: shareConfig.desc,
link: shareConfig.link,
imgUrl: shareConfig.imgUrl,
success: onShareSuccess
};
// 微博分享
var weiboShareData = {
title: shareConfig.title + ' ' + shareConfig.desc,
link: shareConfig.link,
imgUrl: shareConfig.imgUrl,
success: onShareSuccess
};
// QQ空间分享
var qzoneShareData = {
title: shareConfig.title,
desc: shareConfig.desc,
link: shareConfig.link,
imgUrl: shareConfig.imgUrl,
success: onShareSuccess
};
// 使用旧的API确保兼容性
if (wx.onMenuShareTimeline) {
wx.onMenuShareTimeline(timelineShareData);
}
if (wx.onMenuShareAppMessage) {
wx.onMenuShareAppMessage(friendShareData);
}
if (wx.onMenuShareQQ) {
wx.onMenuShareQQ(qqShareData);
}
if (wx.onMenuShareWeibo) {
wx.onMenuShareWeibo(weiboShareData);
}
// 使用新的API
if (wx.updateTimelineShareData) {
wx.updateTimelineShareData(timelineShareData);
}
if (wx.updateAppMessageShareData) {
wx.updateAppMessageShareData(friendShareData);
}
if (wx.onMenuShareQZone) {
wx.onMenuShareQZone(qzoneShareData);
}
<?php do_action('b2_footer_wx_js_api'); ?>
});
wx.error(function(res){
console.log('微信分享配置错误:', res);
});
</script>
<?php
}
修改 Modules/Settings/Normal.php 文件(如果需要自定义设置选项)
添加微信分享设置选项(第2870行附近)
确保微信分享设置选项存在:
$weixin->add_field(array(
'name' => __('分享时显示站点标题', 'b2'),
'id' => 'weixin_share_show_site_title',
'type' => 'select',
'options' => array(
1 => __('显示', 'b2'),
0 => __('隐藏', 'b2')
),
'default' => 1,
'before_row' => '<hr><h2>微信分享设置</h2>',
'desc' => __('开启后,分享到微信和QQ时会在标题中包含站点名称', 'b2')
));
![图片[2]-B2主题免插件实现微信QQ卡片分享-三尾狐](https://img.sanweihu.com/2025/12/20251215005253867-image.png)
十一、版本兼容性
B2主题的微信分享功能支持:
- 微信旧版分享API(确保兼容性)
- 微信新版分享API(支持最新功能)
- 多种分享渠道(微信好友、朋友圈、QQ、微博、QQ空间)
十二、总结
B2主题的微信分享功能集成完善,配置简单,支持多种分享渠道和自定义选项。通过本教程的指导,您可以轻松配置和使用微信分享功能,提升网站的社交传播能力。
© 版权声明
1、本网站名称:三尾狐
2、本站永久网址:www.sanweihu.com
3、本网站的文章部分内容来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4、本站资源仅供学习和交流使用,版权归原作者所有,请在下载后24小时之内自觉删除。
5、本站大部分下载资源收集于网络,不保证其完整性以及安全性,不提供技术支持,请下载后自行研究。
6、若作商业用途,请购买正版,由于未及时购买和付费发生的侵权行为,使用者自行承担,概与本站无关。
2、本站永久网址:www.sanweihu.com
3、本网站的文章部分内容来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4、本站资源仅供学习和交流使用,版权归原作者所有,请在下载后24小时之内自觉删除。
5、本站大部分下载资源收集于网络,不保证其完整性以及安全性,不提供技术支持,请下载后自行研究。
6、若作商业用途,请购买正版,由于未及时购买和付费发生的侵权行为,使用者自行承担,概与本站无关。
THE END











暂无评论内容