본문으로 건너뛰기
黯羽轻扬매일 조금씩

WordPress 사이트 구축 가이드（2）

무료2015-09-14#Solution#Topic#WordPress修改本条目发布于#WordPress查询文章列表#Google字体阻塞页面#WordPress API#WordPress添加自定义页面#wordpress#个人网站

점점 더 WordPress 가 좋아지지 않습니다

서문에

줄곧 WordPress 버전과 twentytwelve 테마를 업그레이드하고 싶지 않았습니다. 커스터마이징한 것을 몇 개 추가하고, 기존 템플릿에 상당한 수정을 가했기 때문에, 업그레이드하면 다시 처음부터 해야 할까 봐 걱정했습니다

버전 변경을 계기로 업데이트를 클릭한 결과, 거의 종일 하루를 들여 뒷수습에 쏟게 되었습니다。。。점점 더 WordPress 가 좋아지지 않습니다

一.커스텀 페이지 추가

절차는 비교적 간단하지만, 그다지 친절하지 않습니다:

  1. wordpress/wp-content/themes/twentytwelve/에 들어가 page.php를 찾아 로컬에 다운로드

  2. 파일 헤더의 주석을 수정. 예를 들어:

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

My Page Name은 커스텀 이름으로 교체 가능하며, 템플릿 드롭다운 목록에 표시됩니다

P.S.주석 형식으로 템플릿 이름을 설정하는 것은 그다지 과학적이지 않지만, WP 는就是这样。어쩔 수 없이 받아들이ましょう

  1. 파일 내용을 수정하고, 커스텀 로직을 추가. 예를 들어:

    <?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(); ?>

  2. 저장하고, 파일명을 수정하여, WP 현재 테마 템플릿 디렉토리에 업로드. 예: wordpress/wp-content/themes/twentytwelve/page-templates

  3. 백엔드/페이지/에 들어가, 새 페이지 생성. 제목은 홈페이지 네비게이션 바에 표시될 문자열. 템플릿을 선택（드롭다운 목록에서 My Page Name 선택）. 업데이트 클릭（기사 내용은 기입 불필요）

  4. 업데이트 후, 클릭하여 기사 표시

특히 주의: 한번 테마를 업데이트하면, 이러한 커스텀 페이지는 모두 삭제됩니다. 업그레이드하지 않는 것을 권장합니다. 업그레이드해야 한다면, 반드시 백업하십시오

二.최신 기사 목록 가져오기

기사 정보 조회에는 주로 하나의 함수를 사용합니다: 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 를 사용하는 방법

용도는 특별히 크지 않습니다. 예를 들어, 당 사이트 루트 디렉토리 하의 모든 2 급 페이지는 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는, 백엔드/외관/편집 중에서 파일을 선택하여 온라인 편집할 수 있습니다

댓글

아직 댓글이 없습니다

댓글 작성