WordPressQQ微信等登录插件二开美化版

今天给大家分享一个WordPress个人网站/博客等接入社交登录方法，网站使用了QQWorld通行证插件，觉得图标不好看，就仿照Foxlogin写的登录前端样式。

支持QQ、微信、新浪微博、支付宝、百度、推特、谷歌、脸书、line 10种社交登录。

以下为原版登录

钻芒大神美化:

使用方法:

QQ：在QQ互联https://connect.qq.com/登录并创建用户，提交信息后等待腾讯审核通过。插件内填写APPID和APPKEY，完成配置即可。

如您的域名没有备案请移步：https://www.xxuanyl.com/300.html

文档

如何输出头像？

<?php get_avatar($id_or_email, $size, $default, $alt, $args); ?>

参考：https://codex.wordpress.org/Function_Reference/get_avatar
如何获取头像图片的URL？

<?php get_user_meta($user->ID, 'QQWorld Passport Avatar', true); ?>

参考：https://codex.wordpress.org/Function_Reference/get_user_meta
如何更换头像图片？

<?php update_user_meta($user->ID, 'QQWorld Passport Avatar', $image_url); ?>

参考：https://codex.wordpress.org/Function_Reference/update_user_meta
如何输出第三方登录列表？

<?php do_action('qqworld-passport'); ?>
<?php
ob_start();
do_action('qqworld-passport');
$codes = ob_get_contents();
ob_end_clean();
?>

如何调用绑定社交账号的按钮？

<?php
if (!function_exists('get_user_to_edit')) include(ABSPATH . '/wp-admin/includes/user.php');
do_action( 'binding_social_media_account', get_user_to_edit(get_current_user_id()) );
?>

.Jz52_dowbox .button{box-shadow:inset 0 0 0 1px #FF3657!important;color:#FF3657!important}.Jz52_dowbox .button:hover{background-color:#FF3657!important;color:#fff!important}.Jz52_dowbox .button.primary1{background-color:#FF3657!important;color:#fff!important;box-shadow:none!important}.Jz52_dowbox .button.primary1:hover{background-color:#222533!important;color:#fff!important}.jz-popup .jz-popup-container{width:620px;}.jzinfo-down{background-color:#f2f2f5}.jzinfo-down.Jz52_dowbox h4{color:#FF3657}.jzinfo-down.Jz52_dowbox p{color:#888}h3.Jz52_dowbox{border-left: 5px solid #;background-color: #;color: #;}.jzftp p.p1 span, .jzftp p.p2 span, .jzptp p.p1 span, .jzptp p.p2 span{color: #;}.jzftp p.p1, .jzptp p.p1{color: #;}.jzptp p.p2,.jzftp p.p2 {color: #888;}.jz-popup .title {color: #; background: #;}.jz-popup .jz-popup-container {background: #;}/* CSS Document */

下载地址