WordPress customize Twenty Twelve theme
WordPress 摘要
WordPress 摘要是一段非必需的，对文章的概述性文字；简单地说，就是文章大意。
摘要的主要功能有二：
- 当您在“控制板” > “设置” > “阅读”中选择了显示摘要之后，替换文章全文。
- 根据主题的不同，亦将用于如下更需要概述性内容的场合：
- 搜索结果
- 标签存档
- 分类目录存档
- 月度文章存档
- 作者文章存档
如何给文章添加摘要
如果想给文章添加摘要，只需要在文章编辑框下面的摘要编辑框添加即可。摘要可以任意地短，但想要表达清文章大意，通常一两句话的摘要较为合适。
手工摘要、自动摘要、内容预告
手工摘要、自动摘要，和内容预告（当你使用 More 标签时，首页上显示的部分文章内容），这三者很容易混淆。自动摘要和内容预告都与手工摘要相关，但与它也有一定的区别。
这三者之间的关系是这样的：当文章没有手工摘要时，而且当前文章模板使用 the_excerpt() 的模板标签时，WordPress 将会自动截取文章的前 55 个单词作为自动摘要；而当文章模板使用 the_content() 的模板标签时，WordPress 则会在文章中搜索 More 标签，并将其之前的部分作为内容预告。
content.php
搜索结果页面 ：WordPress 默认调用 the_excerpt() 函数， 注释条件判断语句，搜索结果页面调用 the_content() 函数 。
<?php
/**
* The default template for displaying content
*
* Used for both single and index/archive/search.
*
* @package WordPress
* @subpackage Twenty_Twelve
* @since Twenty Twelve 1.0
*/
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<?php if ( is_sticky() && is_home() && ! is_paged() ) : ?>
<div class="featured-post">
<?php _e( 'Featured post', 'twentytwelve' ); ?>
</div>
<?php endif; ?>
<header class="entry-header">
<?php
if ( ! post_password_required() && ! is_attachment() ) :
the_post_thumbnail();
endif;
?>
<?php if ( is_single() ) : ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php else : ?>
<h1 class="entry-title">
<a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a>
</h1>
<?php endif; // is_single() ?>
<?php if ( comments_open() ) : ?>
<div class="comments-link">
<?php comments_popup_link( '<span class="leave-reply">' . __( 'Leave a reply', 'twentytwelve' ) . '</span>', __( '1 Reply', 'twentytwelve' ), __( '% Replies', 'twentytwelve' ) ); ?>
</div><!-- .comments-link -->
<?php endif; // comments_open() ?>
</header><!-- .entry-header -->
<?php // if ( is_search() ) : // Only display Excerpts for Search ?>
<!-- <div class="entry-summary"> -->
<?php // the_excerpt(); ?>
<!-- </div> --><!-- .entry-summary -->
<?php // else : ?>
<div class="entry-content">
<?php the_content( __( 'Continue reading <span class="meta-nav">→</span>', 'twentytwelve' ) ); ?>
<?php
wp_link_pages(
array(
'before' => '<div class="page-links">' . __( 'Pages:', 'twentytwelve' ),
'after' => '</div>',
)
);
?>
</div><!-- .entry-content -->
<?php // endif; ?>
<footer class="entry-meta">
<?php twentytwelve_entry_meta(); ?>
<?php edit_post_link( __( 'Edit', 'twentytwelve' ), '<span class="edit-link">', '</span>' ); ?>
<?php if ( is_singular() && get_the_author_meta( 'description' ) && is_multi_author() ) : // If a user has filled out their description and this is a multi-author blog, show a bio on their entries. ?>
<div class="author-info">
<div class="author-avatar">
<?php
/** This filter is documented in author.php */
$author_bio_avatar_size = apply_filters( 'twentytwelve_author_bio_avatar_size', 68 );
echo get_avatar( get_the_author_meta( 'user_email' ), $author_bio_avatar_size );
?>
</div><!-- .author-avatar -->
<div class="author-description">
<h2><?php printf( __( 'About %s', 'twentytwelve' ), get_the_author() ); ?></h2>
<p><?php the_author_meta( 'description' ); ?></p>
<div class="author-link">
<a href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ); ?>" rel="author">
<?php printf( __( 'View all posts by %s <span class="meta-nav">→</span>', 'twentytwelve' ), get_the_author() ); ?>
</a>
</div><!-- .author-link -->
</div><!-- .author-description -->
</div><!-- .author-info -->
<?php endif; ?>
</footer><!-- .entry-meta -->
</article><!-- #post -->
文章页面：设置为全宽度页面，无侧边栏
文章页面 (single.php)
移除侧边栏
<?php
/**
* The Template for displaying all single posts
*
* @package WordPress
* @subpackage Twenty_Twelve
* @since Twenty Twelve 1.0
*/
get_header(); ?>
<div id="primary" class="site-content">
<div id="content" role="main">
<?php
while ( have_posts() ) :
the_post();
?>
<?php get_template_part( 'content', get_post_format() ); ?>
<nav class="nav-single">
<h3 class="assistive-text"><?php _e( 'Post navigation', 'twentytwelve' ); ?></h3>
<span class="nav-previous"><?php previous_post_link( '%link', '<span class="meta-nav">' . _x( '←', 'Previous post link', 'twentytwelve' ) . '</span> %title' ); ?></span>
<span class="nav-next"><?php next_post_link( '%link', '%title <span class="meta-nav">' . _x( '→', 'Next post link', 'twentytwelve' ) . '</span>' ); ?></span>
</nav><!-- .nav-single -->
<?php comments_template( '', true ); ?>
<?php endwhile; // end of the loop. ?>
</div><!-- #content -->
</div><!-- #primary -->
<?php get_footer(); ?>
custom.css
文章页面：设置为全宽度页面，无侧边栏
/* =Reset
-------------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: normal;
}
/* =Repeatable patterns
-------------------------------------------------------------- */
/* Small headers */
.archive-title,
.page-title,
.widget-title,
.entry-content th,
.comment-content th {
font-weight: normal;
color: #000;
}
/* =Basic structure
-------------------------------------------------------------- */
/* Body, links, basics */
body {
color: #000;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Hiragino Sans GB", "PingFang SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
body.custom-font-enabled {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Hiragino Sans GB", "PingFang SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}
/* =Main content and comment content
-------------------------------------------------------------- */
.entry-content h1,
.comment-content h1,
.entry-content h2,
.comment-content h2,
.entry-content h3,
.comment-content h3,
.entry-content h4,
.comment-content h4,
.entry-content h5,
.comment-content h5,
.entry-content h6,
.comment-content h6 {
font-weight: bold;
}
.entry-content h1,
.comment-content h1 {
font-size: 22px;
}
.entry-content h2,
.comment-content h2 {
font-size: 20px;
}
.entry-content h3,
.comment-content h3 {
font-size: 18px;
}
.entry-content h4,
.comment-content h4 {
font-size: 16px;
}
.entry-content h5,
.comment-content h5 {
font-size: 14px;
}
.entry-content h6,
.comment-content h6 {
font-size: 12px;
}
.entry-content blockquote,
.comment-content blockquote {
margin-bottom: 24px;
margin-bottom: 1.5rem;
padding: 24px 32px 24px 32px;
padding: 1.5rem 2rem 1.5rem 2rem;
font-style: italic;
}
.site-content article {
border-bottom: 1px solid #ccc;
}
/* =Media queries
-------------------------------------------------------------- */
/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
.single .site-content {
width: 100%;
}
}
/* Quote */
.wp-block-quote:not(.is-large):not(.is-style-large) {
border: 0;
padding: 24px;
padding: 1.5rem;
}
#time_is_link {
color: #000;
text-decoration: none;
}
.hilite {
background-color: yellow;
}
.term-1 {
background-color: #E50;
}
.term-2 {
background-color: #0B3;
}
.term-3 {
background-color: #26F;
}
.term-4 {
background-color: #E0E;
}
Demo
刻鹄不成尚类鹜，画虎不成反类狗。
