WordPress建站指南（2）

写在前面

一直不愿意升级wordpress版本和twentytwelve主题，因为添了一些自定义的东西，对原有模版做了不少修改，担心一升级就又得重做一遍

趁着改版，点了更新，结果就耗费了差不多一整天时间来善后。。。越来越不喜欢wordpress了

一.添加自定义页面

步骤比较简单，但不太友好：

  1. 进入wordpress/wp-content/themes/twentytwelve/找到page.php，下载到本地

  2. 修改文件头部注释，例如：

    <?php
/*
Template Name: My Page Name
*/
?>

    My Page Name可以换成自定义名称，将会出现在模版下拉列表中

    P.S.虽然以注释形式来设置模版名称不太科学，但wp就是这样，勉强接受吧

  3. 修改文件内容，添加自定义逻辑，例如：

    <?php
/*
Template Name: My Page Name
*/
get_header(); ?>

    <div id="primary" class="site-content">
        <div id="content" role="main">
            <?php
                query_posts('cat=51');

                while ( have_posts() ) : the_post();
                get_template_part('content');
                comments_template( '', true );
                endwhile; // end of the loop.

                wp_reset_query();   // reset query
            ?>
        </div><!-- #content -->
    </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

  4. 保存，修改文件名，上传至wp当前主题模版目录下，如wordpress/wp-content/themes/twentytwelve/page-templates

  5. 进入后台/页面/，新建页面，标题就是会在首页导航栏展示的那几个字；选择模版（在下拉列表中选取My Page Name）；点击更新（文章内容不用填）

  6. 更新后，点击查看文章

特别注意：一旦更新主题，这些自定义页面都会被删掉，建议不要升级，非要升级的话，切记备份

二.获取最新文章列表

查询文章信息主要用到一个函数：query_posts

这里提供一个简单的工具函数：

// 获取文章列表，生成：
// <li><h2 class="icon icon-item"><a href="blog/响应时间的3个重要界限/" target="_blank">响应时间的3个重要界限</a></h2></li>
// 具体样式类可自行修改
function getPostList($strFilter) {
    global $post;

    query_posts($strFilter);

    while (have_posts()): the_post();
    echo '<li><h2 class="icon icon-item"><a href="';
    echo the_permalink();
    echo '" target="_blank">';
    echo mb_strimwidth(strip_tags(apply_filters('the_title', $post->post_title)), 0, 50," ");
    echo '</a></h2></li>';
    endwhile;

    wp_reset_query();   // reset query
}

工具函数简单用法示例：

  1. 获取最新的10篇文章列表

    getPostList(‘showposts=10’);

  2. 获取某分类最新的10篇文章列表

    getPostList(‘cat=301&showposts=10’);

    cat的值很有意思，在后台也不能直接看到，有彩蛋：进入后台/文章/分类目录，鼠标悬停在分类名称上，看浏览器左下角显示的URL，其中类似于tag_ID=133这样的东西，133就是cat的值

关于query_posts函数的更多信息请查看WordPress函数：query_posts（查询文章）

三.如何在wordpress目录外使用wp API

用处不是特别大，比如本站根目录下的所有二级页面都是在wordpress目录之外的（wp被藏在了自定义首页后面），那么在首页如何获取文章列表？

wp的API入口是wordpress/wp-load.php，换句话说，只要引入了该文件，就可以使用wp提供的API了，示例代码如下：

define('WP_USE_THEMES', false); // 不使用主题
require('./cms/wordpress/wp-load.php');

另一个应用场景是在wp API的基础上开发自定义接口，返回JSON数据之类的，这样的东西没有必要也不建议放在wp目录下（万一不小心点下更新把这些文件给删掉了呢？），在wp目录外新建个目录放进去就很合理，也便于维护

四.如何解决google字体阻塞页面的问题

升级主题之后发现页面加载很长时间，在Network面板发现是google字体（fonts.googleapis.com）的锅，请求字体资源的语句在wordpress/wp-content/themes/twentytwelve/functions.php中，虽然不太科学，但确实是在这里定义的

解决方案有3个：

  • 把Google字体换成360字体（推荐做法）

    具体做法是把functions.php中的https://fonts.googleapis.com换成http://fonts.useso.com（注意http，后者不支持https）

  • 把请求的字体都下载下来，上传到自己的目录下，把Google字体的URL改为服务器上的字体URL

  • 删掉相关语句，不加载这些字体

    把twentytwelve_get_font_url函数修改为：

    function twentytwelve_get_font_url() {
    return '';
}

    这些字体对中文站没什么用，直接去掉也无妨

五.修改entry-meta

默认的entry-meta很丑，比如：

本条目发布于xxx，属于xx分类，被贴了x,x,x标签。

想改这个就比较费劲了，写在配置文件（汉化文件）里：wordpress/wp-content/languages/themes/twentytwelve-zh_CN.mo和twentytwelve-zh_CN.po，需要借助PoEdit，具体操作步骤请查看如何打开mo文件并修改 PoEdit，有点反编译的感觉~

改完之后上传到原路径即可（还是建议修改前先备份，避免悲剧）

注意：某些主题会反复自动生成po和mo文件，导致修改失效，所以上传后还需要修改mo文件的读写权限，改为444（-r–r–r–）只读

六.头像无法显示

头像来自www.gravatar.com，已经被墙掉了，会导致后台打开速度极慢，解决方案是改用https请求这些头像图片，在functions.php中添加如下代码：

function get_ssl_avatar($avatar) {
   $avatar = preg_replace('/.*\/avatar\/(.*)\?s=([\d]+)&.*/','<img src="https://secure.gravatar.com/avatar/$1?s=$2" class="avatar avatar-$2" height="$2" width="$2">',$avatar);
   return $avatar;
}
add_filter('get_avatar', 'get_ssl_avatar');

点击更新立即生效，但头像会变得很大很丑（默认是100*100px的），建议再添点样式控制（在style.css中）：

.avatar {
    width: 50px !important;
    height: 50px !important;
}

P.S.上面需要修改的functions.php和style.css可以直接在后台/外观/编辑里面选择文件在线编辑

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*

code