学习,
让视野更宽阔!

电脑本地安装WordPress网站

松鼠小阅读(430)

推荐一款免费软件:PHPStudy

让大家轻松在本地建立网站!

官网首页宣传语:

让天下没有难配的服务器环境,解放运维

页脚标语更让人敬佩!

让天下没有难配的php环境,永久公益免费!

(更多…)

网站文本复制,弹出版权提示

松鼠小阅读(84)

​标题很显然,今天给大家介绍的是:

访客复制内容时弹出版权提示。

介绍两种实现代码:

一种较简单,效果也简单;
一种稍复杂,效果也更佳。

(更多…)

Server酱 | 网站小帮手

松鼠小阅读(429)

为网站新评论添加微信提醒功能!

网站收到了一条评论,

我是在微信上看到提醒的,

感谢Server酱提供的服务。

服务号【方糖】

消息详情:

后台查看评论:

据IP,是个来自英国的朋友!

注意看留言时间与提醒时间,

在同一分钟内,可见同步之迅速。

赶紧回复:

功能实现思路参考了记磊博客

https://www.ly522.com/1109.html

升级版

UxwuitA8zJdfLon

Server酱是什么?查看官网回答

http://sc.ftqq.com/3.version

网站评论,微信提醒实现方法如下:

一、登录账号,绑定Wechat

1、登录账号:

首先需要一个 GitHub 账号来登入 Server酱网站

官网免费注册账号:github.com/

2、绑定Wechat:

点击「微信推送」,扫码关注同时即可完成绑定。

二、测试消息,获取SCKEY

1、测试消息

在 sc.ftqq.com/SCKEY.send 发送消息,看是否能在微信里收到;

2、获取SCKEY

复制保存 SCKEY,后面要用。

三、添加代码,保存测试

1、添加代码

将 SCKEY 替换到下方代码中的“你的 SCKEY”,添加到当前主题的 function.php 文件保存,并刷新缓存。

2、消息测试

在网站上留言,看是否能收到消息提醒,若不能则检查代码是否正确插入。

function sc_send($comment_id)
{
    $text = '提醒主人,又有小伙伴来留言了';
    $comment = get_comment($comment_id);
    $desp = $comment->comment_content;
    $key = '你的SCKEY';
    $postdata = http_build_query(
        array(
            'text' => $text,
            'desp' => $desp
        )
    );
    $opts = array('http' =>
        array(
            'method' => 'POST',
            'header' => 'Content-type: application/x-www-form-urlencoded',
            'content' => $postdata
        )
    );
    $context = stream_context_create($opts);
    return $result = file_get_contents('https://sc.ftqq.com/'.$key.'.send', false, $context);
}
add_action('comment_post', 'sc_send', 19, 2);

据说Server酱还有一些高级玩法

大家可以留言交流一下哦!

最近Server酱采用付费服务(测试号版)

V6WlJKk5wpfaA4g

效果展示:
20200816114159
20200823203457
20200816114321

就是卡片直接显示内容

关于价格:
8Zh6gBcaxmY4qdR

封面图:服务号【方糖】头像


WordPress附件独立下载插件Xydown 二次美化版

松鼠小阅读(105)

xydown是一款wordpress的独立下载页面插件,主要适用于wp建站用户使用,用户在发布文章的时候想要添加一些下载资源,使用这款插件可以把下载的内容独立出来,支持添加本地下载或者百度网盘的网址,并且可以自定义文件信息,包括设置文件名称、文件大小、更新日志以及适用版本等内容,同时还支持自定义文件信息以及添加自定义广告等。
二次美化介绍:
1、统一默认下载页面配色
2、移动端下载按钮对齐
3、恢复资源评星功能
4、增删部分下载栏表单
本插件改自孤狼博客(7585.net.cn)的美化版
https://www.7585.net.cn/wordpress-plugins-modify-xydown.html
插件原作者:逍遥乐
http://www.luoxiao123.cn/10615.html

插件功能概览:
自动在文末添加下载卡片

点击下载,进入资源下载页,网址类似于:
https://www.jishusongshu.com/download.php?id=75

电脑浏览器页面样式

手机浏览器页面样式

WP-China-Yes:轻松更新WordPress和插件

松鼠小阅读(378)

不少WordPress网站在更新版本或升级插件时,报错:429 too many request 。

大概率是WordPress 官网的CDN加速节点屏蔽大陆用户所致。

最近在知乎上了解到一款叫WP-China-Yes插件,可以将WP站点与官方服务的通信切换到大陆节点。

操作起来也相当方便,安装之后启用即可。下面简单介绍一下这款插件。

一、插件介绍

此插件将全面替换WP访问官方服务的链接为高速稳定的中国大陆节点,以此加快站点更新版本、安装升级插件主题的速度,并彻底解决429报错问题。加速节点是直接为你的站点与WordPress总部服务器的一切通信做加速,加速范围包括但不限于:插件、主题商城的资源下载、作品图片、作者头像、主题预览等……

二、插件使用

1、下载插件

WP-China-Yes插件被官方仓库下架

详见:https://wp-china.org/archives/912.html

大家可以到WP中国本土化社区下载

目前最新版为v3.11

可以到文末直达链接下载(该链接指向官网最新版)

也可从GitHub下载:

https://github.com/sunxiyuan/wp-china-yes/releases


貌似GitHub版本还更新,我看了实际下载的压缩包,

两者的CRC是一样的,所以作者只是忘了更新官网描述

2、启用插件

下载的压缩包解压后上传到WordPress插件目录。在后台【插件】-【已安装的插件】内启用插件。

无须其他配置即可生效。笔者已成功更新WordPress至最新版:

两三分钟就完成了!在此感谢插件作者!

以上部分图片是在以前的版本时截的,最新版本插件的设置

插件会自动提示更新,很方便啦!

网站侧边栏 | 作者信息小工具

松鼠小阅读(301)

网站侧边栏与访客接触的机会较多,

用于展示站长的个人信息比较方便。

笔者综合一些代码实现了满意的效果,

这里分享给大家,大家各取所需。

先看简单效果预览:

只需两大步操作即可实现。

一、function.php加入代码

1、增加自定义站长信息

//增加个人简介信息
function my_new_contactmethods( $contactmethods ) {
$contactmethods['zhihu'] = '知乎';
$contactmethods['weibo'] = '微博';
$contactmethods['bianji'] = '编辑身份';
return $contactmethods;
}
add_filter('user_contactmethods','my_new_contactmethods',10,1);

说明:此代码在后台添加自定义参数

v2-f4dd5d984f7808adda0dce7402334ba7_720w

2、添加数据获取函数

//获取作者所有文章浏览量
if(!function_exists('author_posts_views')) {
    function author_posts_views($author_id = 1 ,$display = true) {
        global $wpdb;
        $apvn = "SELECT SUM(meta_value+0) FROM $wpdb->posts left join $wpdb->postmeta on ($wpdb->posts.ID = $wpdb->postmeta.post_id) WHERE meta_key = 'views' AND post_author = $author_id ";
        $author_posts_views = intval($wpdb->get_var($apvn));
        if($display) {
            echo number_format_i18n($author_posts_views);
        } else {
            return $author_posts_views;
        }
    }
}
//获取作者参与评论的评论数
if(!function_exists('author_posts_comments')) {
    function author_posts_comments( $author_id = 1 ,$author_email='' ,$display = true) {
        global $wpdb;
        $apcn = "SELECT count(comment_author) FROM $wpdb->comments WHERE comment_approved='1' AND comment_type='' AND (user_id = '$author_id'  OR comment_author_email='$author_email' )";
        $author_posts_comments = intval($wpdb->get_var($apcn));
        if($display) {
            echo number_format_i18n($author_posts_comments);
        } else {
            return $author_posts_comments;
        }
    }
}

3、注册侧边栏作者信息工具

//作者信息侧边栏
add_action('widgets_init', create_function('', 'return register_widget("Authorinfo");'));
class Authorinfo extends WP_Widget {
    function Authorinfo() {
        $widget_ops = array('description' => '显示当前文章的作者信息!');
        $this->WP_Widget('Authorinfo', '本文作者', $widget_ops);
    }
    function update($new_instance, $old_instance) {
        return $new_instance;
    }
    function widget($args, $instance) {
        extract( $args );
        echo $before_widget;
        echo widget_authorinfo();
        echo $after_widget;
    }
}
v2-559d65e872d8677e9c8ff3ff9afc8c68_720w

4、侧边栏作者信息功能函数

function widget_authorinfo(){
    if (!wp_is_mobile()){
    ?>
    <div class="author-info">               
        <div class="author-avatar">
          <a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ) ?>" title="<?php the_author(); ?>" rel="author">
          <?php if (function_exists('get_avatar')) { echo get_avatar( get_the_author_email(), '80' ); }?>  <i title="网站作者认证 " class="author-ident"> <img class="zuozeipc" src="https://www.jishusongshu.com/wp-content/uploads/2020/03/v.png"></i>
          </a>        
        </div>
        <div class="author-name">
            <?php the_author_posts_link(); ?>
            <a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ) ?>" target="_blank">
            <a href="https://www.jishusongshu.com/about/about-jishusongshu-blog/" target="_blank">
            <span><font color="#ffffff"><?php the_author_meta('bianji'); ?></font></span></a>
        </div>
        <div class="author-des">
            <?php the_author_description(); ?>
        </div>

        <div class="author-social">
            <span class="author-weixin"> 
                <a title="微信"><i class="fa fa-weixin"></i>公众号<em style="background-image: url(https://test/wp-content/uploads/2020/03/jishusongshu.jpg);"></em></a>
            </span> 
            <span class="author-zhihu">
                <a href="<?php the_author_meta('zhihu'); ?>"  rel="nofollow" target="_blank"><i class="fa fa-comment-o" aria-hidden="true"></i>知乎</a>
            </span>
            <span class="author-weibo">
                <a href="<?php the_author_meta('weibo'); ?>"  rel="nofollow" target="_blank"><i class="fa fa-weibo" aria-hidden="true"></i>微博</a>
            </span>
        </div>   
        <section class="author_count">
        <ul>
            <li><span>文章数</span><strong><?php the_author_posts(); ?></strong></li>
            <li><span>浏览量</span><strong><?php author_posts_views( get_the_author_meta('ID') ); ?><?php echo get_the_author_meta('ID '); ?></strong></li>
            <li><span>评论数</span><strong><?php author_posts_comments( get_the_author_meta('ID') ,get_the_author_meta('user_email')); ?></strong></li>
        </ul>
        </section>        
    </div>    
    <?php 
        }
    }

注意里面有些参数需要修改

v2-6507f66e0b6e88a986779c6fc949858c_720w

认证标志,哈哈!

若icon如果无法显示,可以参考

网站菜单:添加个性化图标

二、添加CSS样式

在样式表 style.css 文件内添加代码。此方法若无效果,则到WordPress后台,依次选择【外观】-【自定义】-【额外CSS】

1、头像旋转代码

.avatar{
box-shadow: inset 0 -1px 0 #3333sf;/*设置图像阴影效果*/
-webkit-box-shadow: inset 0 -1px 0 #3333sf;
-webkit-transition: 0.5s;
-webkit-transition: -webkit-transform 0.5s ease-out;
transition: transform 0.5s ease-out;/*图像旋转变化时间设置为0.5秒*/
-moz-transition: -moz-transform 0.5s ease-out;
}
.avatar:hover{/*鼠标悬浮在头像时的CSS样式*/
transform: rotateZ(360deg);/*图像旋转360度*/
-webkit-transform: rotateZ(360deg);
-moz-transform: rotateZ(360deg); 
}

2、作者信息显示主要样式

/* 本文作者小工具*/
.author-info{
width: 100%;
color: #888;
font-size: 12px;
background: url(https://头像背景图地址) #fff center top no-repeat;
position: relative;
background-size: 100%;
}
.author-avatar{
padding-top: 45px;
}
.author-avatar a{
display: block;
width: 80px;
height: 80px;
margin: 0 auto;
background: #C9C9C9;
border-radius: 50%;
border: 3px solid #fff;
-webkit-border: 3px solid #fff;
-moz-border: 3px solid #fff;
}
.author-avatar .avatar {
width: 74px;
height: 74px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
}
.author-ident {
    display: inline-block;
    background-repeat: no-repeat;
    width:20px;
    height:0px;
    border-radius: 50%;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    vertical-align: -2px;
    background-position: -50px -25px;
    position: absolute;
    bottom: 152px;
    right: 142px;
}
.author-name {
height: 26px;
line-height: 26px;
margin: 10px 0;
font-weight: bold;
font-size: 16px;
text-align: center;
}
.author-name span {
font-size: 12px;
background: #2AA145;
color: #FFFFFF;
padding: 2px 6px;
margin-left: 5px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
position: relative;
}
.author-name span:hover {
background-color: #0084FF;
}
.author-des {
padding: 10px;
background: #DFDBDB;
text-indent: 2em;
}
.author-social {
text-align: center;
padding:20px 10px;
}
.author-social span{
padding:3px 15px;
margin-right: 10px;
border-radius: 2px;
display: inline-block;
}
.author-social span:hover {
background-color: #2AA145;
}
.author-social span a {
font-size: 14px;
color: #fff;
}
.author-social span a i {
margin-right: 5px;
}
.author-social .author-weixin {
background-color: #2AA145;
}
.author-social .author-zhihu {
background-color: #0084FF;
}
.author-social .author-weibo {
background-color: #E6162D;
}

说明:样式可能需要修改

加V认证图片的位置可能需要调整

.author-ident {.author-ident {
...
bottom: 152px;
right: 142px;
}

下方的是鼠标悬于社交按钮改变颜色

.author-social span:hover {
background-color: #2AA145;
}

3、鼠标悬浮显示QR Code样式

span.author-weixin a em {position:absolute;z-index:99;bottom:108px;left:0;margin-left:26px;width:100px;height:100px;background-color:#fff;-webkit-background-size:95% auto;background-size:95% auto;background-position:center center;background-repeat:no-repeat;border:1px solid #DDDDDD;display:none;-webkit-transition:all .2s ease-out .1s;-o-transition:all .2s ease-out .1s;transition:all .2s ease-out .1s;}
span.author-weixin a em:after {position:absolute;bottom:-16px;left:50%;width:0;height:0;margin-left:-8px;line-height:0;border:8px solid transparent;border-top:8px solid #dddddd;content:'';}
span.author-weixin a:hover em {display:block;-webkit-transition:all .2s ease-out .1s;-o-transition:all .2s ease-out .1s;transition:all .2s ease-out .1s;}

4、数据列表样式

.author_count {background-color:#fff;border-top:1px #efefef solid;}
.author_count ul {display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;text-align:center;}
.author_count ul li {float:left;list-style:none;width:33.333%;border-right:1px #efefef solid;padding:8px 0;font-weight:300;}
.author_count ul li:last-child {border-right:1px solid transparent;}
.author_count ul li span {display:block;font-size:14px;color:#999;}
.author_count ul li strong {font-weight:bold;}

完成后在小工具栏添加【本文作者】工具即可

三、参考资料

以上代码主要综合参考了

雅兮网:https://www.yaxi.net/2016-11-10/1132.html

一若博客:https://www.pieruo.com/5950.html

396资源:https://www.zmd396.cn/73.html

四、源码下载

以上代码文件下载

技术松鼠提示:内容已隐藏,请输入验证码后查看!
验证码:
微信扫描右侧二维码,或微信搜索“技术松鼠”或“JISHUSONGSHU”关注本站公众号,回复“验证码”,获取验证码。

v2-7f8555c24379af9fa6627943bec3b2e3_720w

WP-UserAgent:浏览器系统尾巴

松鼠小阅读(212)

给大家推荐一款WordPress插件

——wp-useragent(免费)

用于在评论区显示用户浏览器系统:

能够显示浏览器具体版本号,

操作系统的类型和电脑位数

插件在WordPress后台搜索可下载

虽说是三年前的插件,但是依然好用

图标有两套大小:16/24 pixels

个人觉得 16 pixels大小刚好合适

觉得有些浏览器旧图标没新的好看

于是自己用PS修改图标大小更换之

插件位置可设置评论文字前/后、自定义

设置好参数后保存刷新即可预览效果

 

若选择的是评论文字前/后

则无须改代码即可实现效果

若不满意位置或无法实现该效果

可自行将PHP码插入评论文件

<?php wpua_custom_output(); ?>

例如:

<?php foreach ($comments as $comment) : ?>
<cite><?php comment_author_link() ?></cite> <?php wpua_custom_output(); ?> says:<br />
<?php comment_text() ?>

更多设置可阅读原文


修改版插件下载

技术松鼠提示:内容已隐藏,请输入验证码后查看!
验证码:
微信扫描右侧二维码,或微信搜索“技术松鼠”或“JISHUSONGSHU”关注本站公众号,回复“验证码”,获取验证码。


技术松鼠