教程丨美好的明天 CoreNext 主题优化汇总

本站使用的架构

WordPress是使用PHP语言开发的博客平台，用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站。也可以把WordPress当作一个内容管理系统（CMS）来使用。

WordPress是一款个人博客系统，并逐步演化成一款内容管理系统软件，它是使用PHP语言和MySQL数据库开发的，用户可以在支持PHP 和 MySQL数据库的服务器上使用自己的博客。

本站使用的主题

CoreNext主题，强大的WordPress定制主题;

体积小，性能强，功能多，是一款不可多得的高性能，高颜值主题。

本站针对主题的优化

01 评论区右侧背景图（240920）

效果演示

评论区右侧背景图

美化方法

在主题根目录下找到 style.css 文件，在合适位置加入如下代码；将url(xxx) 其中链接修改为自己的素材图片地址。

素材

评论区右侧背景图素材

无水印原图下载

以上图片请通过百度网盘下载保存

CSS美化

在主题设置中找到插入代码 → 自定义CSS，贴入如下代码

/* 评论区右侧背景图 */

textarea.comment-textarea[data-v-18ee0e41] {
    background-color: transparent;
    background: linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05)),url(https://www.wmviv.com/theme/CoreNext/static/img/comment-textarea.png) right 10px bottom 10px no-repeat;
    -moz-transition: ease-in-out 0.45s;
    -webkit-transition: ease-in-out 0.45s;
    -o-transition: ease-in-out 0.45s;
    -ms-transition: ease-in-out 0.45s;
    transition: ease-in-out 0.45s;
}

textarea.comment-textarea[data-v-18ee0e41]:focus {
    background-position-y: 789px;
    -moz-transition: ease-in-out 0.45s;
    -webkit-transition: ease-in-out 0.45s;
    -o-transition: ease-in-out 0.45s;
    -ms-transition: ease-in-out 0.45s;
    transition: ease-in-out 0.45s;
}

02 复制版权弹窗提示美化（240921）

效果演示

右键复制弹窗提示版权美化

使用方法

在主题设置中找到插入代码 → 页脚代码，在合适位置贴入如下代码，保存会强制刷新网页即可复制查看效果。

<script>
/* 右键复制弹窗提示版权美化 */

document.addEventListener(&quot;copy&quot;, function(e) {
    new Vue({
        data: function() {
            this.$notify({
                title: &quot;复制成功&quot;,
                message: &quot;转载请注明文章出处及本站链接！&quot;,
                position: 'bottom-right',
                offset: 50,
                showClose: true,
                type: &quot;success&quot;
            });
            return {
                visible: false
            }
        }
    })
})
</script>

03 右下角显示页面加载时间弹窗（240922）

效果演示

美化方法

在主题设置中找到插入代码 → 页脚代码，合适位置贴入下行代码，并保存。

<script>document.addEventListener("DOMContentLoaded",function(){var startTime=new Date().getTime();window.onload=function(){var endTime=new Date().getTime();var loadTime=(endTime-startTime)/1000;var message="页面加载完成，共耗时 "+loadTime+" 秒。";new Vue({data:function(){this.$notify({title:"加载提示",message:message,position:'bottom-right',offset:50,showClose:true,type:"info"});return{visible:false}}})}});</script>

强制刷新网页，即可生效。

在小屏幕终端隐藏加载提示

在手机端屏幕画面小，但浏览时也会弹出加载提示，影响观感，找到 CoreNext/static/css/ ，打开main.css，搜索 @media (max-width:1200px) ，在后续合适位置贴入如下代码，这样在小屏幕终端访问时就会隐藏此提示。

.el-notification{display:none}

04 页面底部显示数据库查询次数和页面加载时间短代码

/*-----------------------------------------------------------------------------------*/

/* 页面底部显示数据库查询次数和页面加载时间短代码 　 */
/*-----------------------------------------------------------------------------------*/

$page_start_time = microtime(true);

function set_page_start_time() {
    global $page_start_time;
    $page_start_time = microtime(true);
}
add_action('init', 'set_page_start_time');

function display_query_count_with_timer() {
    global $wpdb;
    $query_count = $wpdb->num_queries;

    global $page_start_time;
    $query_time = microtime(true) - $page_start_time;
    $query_time = number_format_i18n($query_time, 3);

    $output = "<p>". $query_count. " queries in ". $query_time. " seconds</p>";
    return $output;
}

add_shortcode('query_timer', 'display_query_count_with_timer');

05 文章开始位置显示文章字数和阅读时间

/*-----------------------------------------------------------------------------------*/

// 文章开始位置显示文章字数和阅读时间
/*-----------------------------------------------------------------------------------*/

function count_words_read_time( $content ) {
    global $post;
    if (!is_a($post, 'WP_Post') || empty($post->post_content)) {
        return $content;
    }

    $clean_text = preg_replace('/[^\p{Han}]+/u', '', $post->post_content);
    $text_num = mb_strlen($clean_text, 'UTF-8');
    $read_time = ceil($text_num / 300);
    $custom_content = '<p class="post-read-time">温馨提示：本文共计 '. $text_num. ' 字，阅读全文大约需要 '. $read_time. ' 分钟。</p>';
    $content = $custom_content. $content;
    return $content;
}
add_filter('the_content', 'count_words_read_time');

06 文章结束位置显示最后更新时间

/*-----------------------------------------------------------------------------------*/

// 文章结束位置显示最后更新时间
/*-----------------------------------------------------------------------------------*/

function wpb_last_updated_date( $content ) {
    $u_time = get_the_time('U'); 
    $u_modified_time = get_the_modified_time('U'); 
    $custom_content = '';
    if ($u_modified_time >= $u_time + 86400) {
        $updated_date = get_the_modified_time( 'Y-m-d H:i:s' );
        $custom_content.= '<p class="post-update-time">本页面最后更新于：'. $updated_date.'，如有链接失效，您可在下方评论区留言。</p>';
    }
    $content.= $custom_content;
    return $content;
}
add_filter( 'the_content', 'wpb_last_updated_date' );

07 WordPress文章内外链添加go跳转

/*-----------------------------------------------------------------------------------*/

// WordPress文章内外链添加go跳转
/*-----------------------------------------------------------------------------------*/

function loper_content_nofollow($content){
preg_match_all('/<a(.*?)href="(.*?)"(.*?)>/',$content,$matches);
if($matches){
foreach($matches[2] as $val){
if(strpos($val,'://')!==false && strpos($val,home_url())===false && !preg_match('/\.(jpg|jepg|png|ico|bmp|gif|tiff)/i',$val)){
$content=str_replace("href=\"$val\"", "href=\"//www.wmviv.com/go.php?url=$val\" ",$content);
}
}
}
return $content;
}
add_filter('the_content','loper_content_nofollow',999);

function add_redirect_comment_link($text = ''){
    $text=str_replace('href="', 'target="_blank" href="//www.wmviv.com/go.php?url=', $text);
    return $text;
}
add_filter('get_comment_author_url', 'add_redirect_comment_link', 99);
add_filter('get_comment_author_link', 'add_redirect_comment_link', 5);
add_filter('comment_text', 'add_redirect_comment_link', 99);

08 强制转义文章编辑器里pre标签出现的【】字符

/*-----------------------------------------------------------------------------------*/

// 强制转义文章编辑器里<pre>标签出现的[]字符
/*-----------------------------------------------------------------------------------*/

function escape_square_brackets_in_pre_tags($content) {
    $regex = '/(<pre\s+[^>]*?>)(.*?)(<\/pre>)/sim';
    return preg_replace_callback($regex, 'escape_square_brackets_callback', $content);
}

function escape_square_brackets_callback($matches) {
    $tag_open = $matches[1];
    $content = $matches[2];
    $tag_close = $matches[3];
    $content = str_replace('[', '[', $content);
    $content = str_replace(']', ']', $content);

    return $tag_open. $content. $tag_close;
}

add_filter('the_content', 'escape_square_brackets_in_pre_tags', 2);
add_filter('comment_text', 'escape_square_brackets_in_pre_tags', 2);

09 WordPress 取消重复评论限制

/*-----------------------------------------------------------------------------------*/

// 取消重复评论限制
/*-----------------------------------------------------------------------------------*/

add_filter('duplicate_comment_id', '__return_false');

10 WordPress 后台添加链接菜单

/*-----------------------------------------------------------------------------------*/

// 后台添加链接菜单
/*-----------------------------------------------------------------------------------*/

add_filter('pre_option_link_manager_enabled','__return_true');

11 优化WordPress CoreNext主题静态文件部署提升加载速度

/*-----------------------------------------------------------------------------------*/

// 优化网站静态文件部署 提升加载速度
/*-----------------------------------------------------------------------------------*/

function modify_theme_paths_in_child_theme() {
    $parentConfig = \core_next\Config::class;
    $newThemeUrl = 'https://static.wmviv.com/corenext';
    $parentConfig::$theme_url = $newThemeUrl;
    $parentConfig::$static_url = $parentConfig::$theme_url. '/static';
    $parentConfig::$js_url = $parentConfig::$static_url. '/js';
    $parentConfig::$css_url = $parentConfig::$static_url. '/css';
    $parentConfig::$img_url = $parentConfig::$static_url. '/img';
}
add_action('after_setup_theme','modify_theme_paths_in_child_theme');

12 页面底部显示数据库查询次数和页面加载时间

/*-----------------------------------------------------------------------------------*/

// 页面底部显示数据库查询次数和页面加载时间短代码 未登录不显示
/*-----------------------------------------------------------------------------------*/

$page_start_time = microtime(true);

function set_page_start_time() {
    global $page_start_time;
    $page_start_time = microtime(true);
}
add_action('init', 'set_page_start_time');

function display_query_count_with_timer() {
    global $wpdb;
    $query_count = $wpdb->num_queries;
    global $page_start_time;
    $query_time = microtime(true) - $page_start_time;
    $query_time = number_format_i18n($query_time, 3);
    if (is_user_logged_in()) {
        $output = "<p>". $query_count. " queries in ". $query_time. " seconds</p>";
    } else {
        $output = "　";
    }
    return $output;
}

add_shortcode('query_timer', 'display_query_count_with_timer');

13 页面底部显示内存使用

/*-----------------------------------------------------------------------------------*/

// 页面底部显示内存使用情况
/*-----------------------------------------------------------------------------------*/

function display_memory_usage() {
    if (is_user_logged_in()) {
        $memory_usage = memory_get_usage();
        $memory_usage_mb = $memory_usage / (1024 * 1024);
        $memory_usage_formatted = number_format_i18n($memory_usage_mb, 2). ' MB';
        $output = "<p>memory usage : ". $memory_usage_formatted. "</p>";
        return $output;
    } else {
        return "　";
    }
}

add_shortcode('memory_usage', 'display_memory_usage');

14 仅管理员可见内容的短码【adminonlyshow】

/*-----------------------------------------------------------------------------------*/

// 仅管理员可见内容的短码 本内容未公开，仅限 管理员 才能查看
此部分内容可能还在编辑或修改中，暂不可访问
请稍后再试，或联系博主。
/*-----------------------------------------------------------------------------------*/

function admin_only_shortcode_function($atts, $content = null) {
    if (current_user_can('manage_options')) {
        $html = '<div class="admin-only-section"><div class="note">此内容仅管理员可见</div><div class="admin-only-content">'. do_shortcode($content). '</div></div>';
        return $html;
    } else {
        $html = '<div class="admin-only"><div class="note"><p>本内容仅 <b>管理员</b> 才能查看</p><p>此部分内容可能还在编辑或修改中，暂不可访问</p><p>如有疑问，请稍后再试，或联系管理员。</p></div></div>';
        return $html;
    }
}
add_shortcode('adminonlyshow', 'admin_only_shortcode_function');

15 登录且回复可见内容的短码【loginreplyshow】

/*-----------------------------------------------------------------------------------*/

// 登录且回复可见内容的短码 本内容仅提供本站注册用户才能查看
您还未登录，请先 登录 或 注册
* 推荐使用社交账号快捷登录 *
/*-----------------------------------------------------------------------------------*/

function loginreplyshow_shortcode_function($atts, $content = null) {
    $user_ID = (int) wp_get_current_user()->ID;
    if ($user_ID <= 0) {
        $html = '<div class="login-reply-show login-need-action"><p>您还未登录</p><p>本内容需要 <b>登录</b> 后 <b>回复</b> 才能查看</p><div style="text-align: center;"><button class="el-button el-button--primary el-button--small need-login-btn">注册 ＆ 登录</button></div><span style ="font-size:12px;"><a href="https://www.wmviv.com/registration-and-login-guide.html" target="_blank">注册＆登录 指引</a></span></div>';
        return $html;
    }

    $email = get_userdata($user_ID)->user_email;
    $post_id = get_the_ID();
    global $wpdb;
    $query = "SELECT `comment_ID` FROM {$wpdb->comments} WHERE `comment_post_ID`={$post_id} and `comment_approved`='1' and `comment_author_email`='{$email}' LIMIT 1";
    if ($wpdb->get_results($query)) {
        $html = '<div class="login-reply-show"><div class="note">您已登录且回复，内容已为您显示</div><div class="login-show-content">'. do_shortcode($content). '</div></div>';
        return $html;
    } else {
        $html = '<div class="login-reply-show login-need-action"><p>您已登录</p><p>本内容还需要 <span style="cursor: pointer" class="core-need-reply-click"><b>回复</b></span> 才能查看</p><div style="text-align: center;"><button class="el-button el-button--primary el-button--small " onclick="scrollToCommentBox()">回复</button></div><span style ="font-size:12px;">回复后，请手动 <b>刷新页面</b>，内容即可显示</span></div>';
        return $html;
    }
}
add_shortcode('loginreplyshow', 'loginreplyshow_shortcode_function');

16 全站底部版权的短码【bottomcopyright】

/*-----------------------------------------------------------------------------------*/

// 全站底部版权的短码 [bottomcopyright]
/*-----------------------------------------------------------------------------------*/

function bottomcopyright_shortcode_function() {
    $current_year = date('Y');
    $site_name = get_bloginfo('name');
    $home_url = home_url();
    $copyright_text = "Copyright © 2013 - {$current_year} <a href='{$home_url}'>{$site_name}</a>";
    return $copyright_text;
}
add_shortcode('bottomcopyright', 'bottomcopyright_shortcode_function');

17 个人信息的短码【personalInformation】

/*-----------------------------------------------------------------------------------*/

// 个人信息的短码 [personalInformation]
/*-----------------------------------------------------------------------------------*/

function personalInformation_shortcode_function() {
    $html = '<div class="widget-admin-author-plane"><div class="widget-admin-author-background_image" style=""><img src="https://static.wmviv.com/www/theme/CoreNext/static/img/admin-author-background_image.gif"></div><div class="widget-admin-author-avatar"><img src="https://static.wmviv.com/www/theme/CoreNext/static/img/admin_avatar.svg"></div><div class="widget-admin-author-name">半夏 </div><div class="widget-admin-author-introduce"><div class="widget-admin-author-introduce-text"><center><p id="bozhujiyu"></p></center></div></div><div class="widget-admin-author-contact"><div class="block"><a class="block__title" href="https://wmviv.com" title="美好的明天起始页" target="_blank"><span class="author-weibo"><i class="fa fa-home"></i>起始</span></a><a class="block__title" href="https://status.wmviv.com" title="美好的明天在线监测" target="_blank"><span class="author-ipv6"><i class="fa fa-heartbeat"></i>监测</span></a><a class="block__title" href="https://pan.wmviv.com" title="美好的明天聚合网盘" target="_blank"><span class="author-email"><i class="fa fa-cloud"></i>网盘</span></a></div></div></div>';
    return $html;
}
add_shortcode('personalInformation', 'personalInformation_shortcode_function');

18 WordPress Corenext主题添加站点公告小工具

/*-----------------------------------------------------------------------------------*/

// WordPress Corenext主题添加站点公告小工具
/*-----------------------------------------------------------------------------------*/

class SiteNoticeWidget extends WP_Widget {

    public function __construct() {
        parent::__construct(
            'site_notice_widget', 
            __('美好的明天 _ 站点公告', 'site-notice-domain'), 
            array('description' => __('显示站点公告信息', 'site-notice-domain'))
        );
    }

    public function widget($args, $instance) {
        echo $args['before_widget'];
        echo '<h2 class="widget-title widget-title-classic" v-pre=""><i class="fas fa-bullhorn fa-shake"></i><span class="site-notice-title">'. $instance['title']. '</span></h2>';
        echo '<div class="announcement_content">'. $instance['content']. '</div>';
        echo $args['after_widget'];
    }

    public function form($instance) {
        $title =! empty($instance['title'])? $instance['title'] : __('站点公告', 'site-notice-domain');
        $content =! empty($instance['content'])? $instance['content'] : __('待添加', 'site-notice-domain');
        echo '<p>';
        echo '<label for="'. $this->get_field_id('title'). '">'. __('标题:'). '</label>';
        echo '<input class="widefat" id="'. $this->get_field_id('title'). '" name="'. $this->get_field_name('title'). '" type="text" value="'. $title. '" />';
        echo '</p>';
        echo '<p>';
        echo '<label for="'. $this->get_field_id('content'). '">'. __('内容:'). '</label>';
        echo '<textarea class="widefat" id="'. $this->get_field_id('content'). '" name="'. $this->get_field_name('content'). '" rows="5">'. $content. '</textarea>';
        echo '</p>';
    }

    public function update($new_instance, $old_instance) {
        $instance = array();
        $instance['title'] = (! empty($new_instance['title']))? $new_instance['title'] : '';
        $instance['content'] = (! empty($new_instance['content']))? $new_instance['content'] : '';
        return $instance;
    }
}

function register_site_notice_widget() {
    register_widget('SiteNoticeWidget');
}
add_action('widgets_init', 'register_site_notice_widget');

19 WordPress CoreNext 给你的网站添加喵喵纪念日页面