为你的WordPress主题框架建立起始文件

网络
有那么一个人出现在你的生命里，其他人都会变成风景，只有那个人是他心口的朱砂，放在心尖上的人，再也放不下。
本文是《开发你的 WordPress 主题框架》专题的第 4 篇，共 10 篇：
  • 为你的WordPress主题框架添加动作挂钩
  • WordPress 主题框架是如何工作的
  • 决定如何开发你的WordPress主题框架
  • 为你的WordPress主题框架建立起始文件
  • 为你的WordPress主题框架添加函数
  • 为你的WordPress主题框架添加过滤挂钩
  • 为你的WordPress主题框架创建子主题
  • 为你的WordPress主题框架开发插件
  • 发布你的WordPress主题框架
  • 为你的WordPress主题框架编写文档

在之前的课程中，您已经了解并学习了主题框架的工作方式和开发途径。

现在是时候深入探讨一些代码了！

在本好代码教程中，您会采用一个基本的主题，然后编辑模板文件，为主题框架添加相关挂钩和函数做好准备。本好代码教程旨在整理主题，减少代码重复，这意味着您要为循环建立包含文件（include files）。

您将不必在子主题中创建重复循环，当您创建新的模板文件时，或者您需要编辑循环时，您只需做一次就行了。

注：起始文件在我的系列课程《从静态HTML中创建一个WordPress主题》而创建的基础之上，稍作了些改动。您可以从GitHub库相关系列中去下载它们。

您需要做的是

跟随本好代码教程，您需要

  • 安装一个WordPress开发环境
  • GitHub库相关系列中的起始文件或者起始主题文件
  • 一个代码编辑器

为循环建立包含文件

我会为我的框架建立三个循环：

  • 一个用于存档（包括主博客页面）
  • 一个用于单篇文章
  • 一个用于页面

这是因为我想让其中的每一个循环与其他的显示起来都略有不同。

尽管将会有三个循环，但相比较于每一个模板文件中都包含一个循环而言，这会更加高效。

主循环

主循环会用于存档和主博客页面。在您的主题文件夹中，创建一个名为loop.php的文件。

从archive.php中将下列代码复制到loop.php文件中：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69

<?php
/* Queue the first post, that way we know if this is a date archive so we can display the correct title.
 * We reset this later so we can run the loop properly with a call to rewind_posts().
 */
if ( have_posts() )
    the_post();
?>

        <h2 class="page-title">
            <?php if ( is_day() ) { ?>
                Archive for <?php echo get_the_date();
            }
            elseif ( is_month() ) { ?>
                Archive for <?php echo get_the_date('F Y');
            }
            elseif ( is_year() ) { ?>
                Archive for <?php echo get_the_date('Y');
            }
            else {
                echo get_queried_object()->name; 
            } ?>
        </h2>

<?php rewind_posts(); ?>


<?php // start the loop ?> 
<?php while ( have_posts() ) : the_post(); ?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

    <h2 class="entry-title">
        <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'compass' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark">
            <?php the_title(); ?>
        </a>
    </h2>

    <section class="left image quarter">

        <?php if ( has_post_thumbnail() ) { ?>
            <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail( 'medium', array(
                    'class' => 'left',
                    'alt'   => trim(strip_tags( $wp_postmeta->_wp_attachment_image_alt ))
                ) ); ?>
            </a>
        <?php } ?>
    </section><!-- .image -->

    <section class="entry-meta">
        <p>Posted on <?php the_date(); ?> by <?php the_author(); ?></p>
    </section><!-- .entry-meta -->

    <section class="entry-content">
        <?php the_content(); ?>
    </section><!-- .entry-content -->

    <section class="entry-meta">
        <?php if ( count( get_the_category() ) ) : ?>
            <span class="cat-links">
                Categories: <?php echo get_the_category_list( ', ' ); ?>
            </span>
        <?php endif; ?>   
    </section><!-- .entry-meta -->

</article><!-- #01-->

<?php endwhile; ?>
<?php // ends the loop ?>

<?php /* Queue the first post, that way we know if this is a date archive so we can display the correct title. * We reset this later so we can run the loop properly with a call to rewind_posts(). */ if ( have_posts() ) the_post(); ?> <h2 class="page-title"> <?php if ( is_day() ) { ?> Archive for <?php echo get_the_date(); } elseif ( is_month() ) { ?> Archive for <?php echo get_the_date('F Y'); } elseif ( is_year() ) { ?> Archive for <?php echo get_the_date('Y'); } else { echo get_queried_object()->name; } ?> </h2> <?php rewind_posts(); ?> <?php // start the loop ?> <?php while ( have_posts() ) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <h2 class="entry-title"> <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'compass' ), the_title_attribute( 'echo=0' ) ); ?>" rel="bookmark"> <?php the_title(); ?> </a> </h2> <section class="left image quarter"> <?php if ( has_post_thumbnail() ) { ?> <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>"> <?php the_post_thumbnail( 'medium', array( 'class' => 'left', 'alt' => trim(strip_tags( $wp_postmeta->_wp_attachment_image_alt )) ) ); ?> </a> <?php } ?> </section><!-- .image --> <section class="entry-meta"> <p>Posted on <?php the_date(); ?> by <?php the_author(); ?></p> </section><!-- .entry-meta --> <section class="entry-content"> <?php the_content(); ?> </section><!-- .entry-content --> <section class="entry-meta"> <?php if ( count( get_the_category() ) ) : ?> <span class="cat-links"> Categories: <?php echo get_the_category_list( ', ' ); ?> </span> <?php endif; ?> </section><!-- .entry-meta --> </article><!-- #01--> <?php endwhile; ?> <?php // ends the loop ?>

您并不需要去显示主博客页面上的标题，所以在第一个循环上添加一个条件标签，以检查我们是不是该网页上：

1
2

if ( ! is_front_page() ) {
}

if ( ! is_front_page() ) { }

第一个循环当前会如下所示：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

if ( ! is_front_page() ) {

    if ( have_posts() )
        the_post();
    ?>

            <h2 class="page-title">
                <?php if ( is_day() ) { ?>
                    Archive for <?php echo get_the_date();
                }
                elseif ( is_month() ) { ?>
                    Archive for <?php echo get_the_date('F Y');
                }
                elseif ( is_year() ) { ?>
                    Archive for <?php echo get_the_date('Y');
                }
                else {
                    echo get_queried_object()->name; 
                } ?>
            </h2>

    <?php rewind_posts();

} ?>

if ( ! is_front_page() ) { if ( have_posts() ) the_post(); ?> <h2 class="page-title"> <?php if ( is_day() ) { ?> Archive for <?php echo get_the_date(); } elseif ( is_month() ) { ?> Archive for <?php echo get_the_date('F Y'); } elseif ( is_year() ) { ?> Archive for <?php echo get_the_date('Y'); } else { echo get_queried_object()->name; } ?> </h2> <?php rewind_posts(); } ?>

现在，您需要在相关模板文件中包含这个循环。在archive.php和index.php文件中，将现有的循环替换为get_template_part()标签，其中包含了您的循环文件：

1

<?php get_template_part( 'loop' ); ?>

<?php get_template_part( 'loop' ); ?>

现在您有了一个用于存档的工作循环。

页面循环

接下来，您将为页面创建一个循环文件。创建一个名为loop-page.php的文件。

从现有的page.php文件中将下列循环代码复制到loop-page.php文件：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<?php
    // Run the page loop to output the page content.

     if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

        <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

            <?php if ( ! is_front_page() ) { ?>
                <h2 class="entry-title"><?php the_title(); ?></h2>
            <?php } ?>

            <section class="entry-content">
                <?php the_content(); ?>
            </section><!-- .entry-content -->
        </article><!-- #post-## -->

    <?php endwhile; ?>

<?php // Run the page loop to output the page content. if ( have_posts() ) while ( have_posts() ) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php if ( ! is_front_page() ) { ?> <h2 class="entry-title"><?php the_title(); ?></h2> <?php } ?> <section class="entry-content"> <?php the_content(); ?> </section><!-- .entry-content --> </article><!-- #post-## --> <?php endwhile; ?>

现在在主题的所有页面模板中(page.php 和 page-full-width.php)，使用下面的代码替换循环：

1

<?php get_template_part( 'loop' , 'page' ); ?>

<?php get_template_part( 'loop' , 'page' ); ?>

文章页循环

最后，您将为单篇文章页面创建一个循环文件，用于普通的文章和您将来创建的任何自定义的文章类型。这和主循环是相似的，只是它不包括该文章的链接，也没有初始循环，用来检查我们的存档情况。

建立一个名为loop-single.php和另一个名为single.php的文件。

将index.php文件中的内容复制到single.php文件，并在文件的初始位置编辑说明和循环，如下所示：

1

<?php get_template_part( 'loop', 'single' ); ?>

<?php get_template_part( 'loop', 'single' ); ?>

现在，在single-loop.php文件中，复制代码到loop.php文件，不包括查询档案的第一个循环。在循环内编辑初始标题标签并取消链接，代码如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

<?php while ( have_posts() ) : the_post(); ?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

    <h2 class="entry-title">
        <?php the_title(); ?>
    </h2>

    <section class="left image quarter">

        <?php if ( has_post_thumbnail() ) { ?>
            <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>">
                <?php the_post_thumbnail( 'medium', array(
                    'class' => 'left',
                    'alt'   => trim(strip_tags( $wp_postmeta->_wp_attachment_image_alt ))
                ) ); ?>
            </a>
        <?php } ?>
    </section><!-- .image -->

    <section class="entry-meta">
        <p>Posted on <?php the_date(); ?> by <?php the_author(); ?></p>
    </section><!-- .entry-meta -->

    <section class="entry-content">
        <?php the_content(); ?>
    </section><!-- .entry-content -->

    <section class="entry-meta">
        <?php if ( count( get_the_category() ) ) : ?>
            <span class="cat-links">
                Categories: <?php echo get_the_category_list( ', ' ); ?>
            </span>
        <?php endif; ?>   
    </section><!-- .entry-meta -->

</article><!-- #01-->

<?php endwhile; ?>

<?php while ( have_posts() ) : the_post(); ?> <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <h2 class="entry-title"> <?php the_title(); ?> </h2> <section class="left image quarter"> <?php if ( has_post_thumbnail() ) { ?> <a rel="nofollow noopener noreferrer" href="<?php the_permalink(); ?>"> <?php the_post_thumbnail( 'medium', array( 'class' => 'left', 'alt' => trim(strip_tags( $wp_postmeta->_wp_attachment_image_alt )) ) ); ?> </a> <?php } ?> </section><!-- .image --> <section class="entry-meta"> <p>Posted on <?php the_date(); ?> by <?php the_author(); ?></p> </section><!-- .entry-meta --> <section class="entry-content"> <?php the_content(); ?> </section><!-- .entry-content --> <section class="entry-meta"> <?php if ( count( get_the_category() ) ) : ?> <span class="cat-links"> Categories: <?php echo get_the_category_list( ', ' ); ?> </span> <?php endif; ?> </section><!-- .entry-meta --> </article><!-- #01--> <?php endwhile; ?>

保存这两个文件。现在，所有的循环文件您都准备好了。

小结

从长远来看，使用一个主题框架之前，先整理主题并减少代码重复将会节省下不少的工作时间。

当您开始创建子主题并和父主题一起使用时，您会发现自己在建立自定义循环的同时，也在以一种完全正确的方式完成一个给定项目的内容。有了三个独立的循环，您就会避免在子主题中建立重复的模板文件，因为您只需要建立重复循环文件就行了。

  • 原文出自：http://code.tutsplus.com/tutorials/creating-the-starting-files-for-your-wordpress-theme-framework--cms-21662
  • 由 stonetan@WordPress大学 原创翻译，未经允许，禁止转载和采用本译文。

本文为你的WordPress主题框架建立起始文件到此结束。没有我为您掌灯，您在往返家的路上，会觉得难过吗?小编再次感谢大家对我们的支持！

您可能有感兴趣的文章
WordPress站点Gravatar头像前后台不显示的如何解决办法
WordPress主题需要支持https吗？WordPress站点如何如何实现https？
WordPress站点的页面/标签/分类URL地址如何添加.html？
WordPress站点更换了域名后数据库应该如何操作替换新旧域名？
WordPress安装在主机空间的什么目录里面？根目录在哪里？