环境

• WordPress 6.0.1
• Twenty Twelve 3.7
• PHP 8.1.9

修改 Twenty Twelve: 样式表 (style.css)

将以下CSS代码直接插入到 Twenty Twelve 主题样式文件（style.css）末尾即可生效。

1. 去掉导航栏项目被点击后出现的虚线轮廓以及站点标题被点击后的轮廓

/*去掉导航栏项目点击后的轮廓*/
.main-navigation a {
	outline: none;
}

.wp-block-search__input {
   padding: 5px 6px;
   font-size: 13px;
}

input[type="text"],input[type="search"],textarea {
	outline: none;
	border: 1px solid #d8d9dc;
	background:#fff;
}

input[type="text"]:focus,input[type="search"]:focus,textarea:focus {
	border-color: #40a9ff;
   box-shadow: 0 0 0 2px rgba(24, 144, 255, .2);
   border-right-width: 1px;
}

/*去掉站点标题被点击后的轮廓*/
.site-header h1 a,
.site-header h2 a {
	outline:none;
}

2. 美化输入框

/*修改搜索框*/
.wp-block-search__input {
   padding: 5px 6px;
   font-size: 13px;
}

input[type="text"],input[type="search"],textarea {
	outline: none;
	border: 1px solid #d8d9dc;
	background:#fff;
}

input[type="text"]:focus,input[type="search"]:focus,textarea:focus {
	border-color: #40a9ff;
   box-shadow: 0 0 0 2px rgba(24, 144, 255, .2);
   border-right-width: 1px;
}

input[type="text"]:hover,input[type="search"]:hover,textarea:hover {
	border-color: #40a9ff;
   border-right-width: 1px;
}

3. 美化默认代码块显示方式

/*美化代码块*/
.entry-content pre code,
.comment-content pre code {
	/*改变下代码块的背景颜色跟padding*/
	background: rgb(247, 246, 243);
	padding: 10px;
	border: 1px solid #ededed;
	font-size: 13px;
}

4. 美化主边栏

/*主边栏搜索*/
.wp-block-search .wp-block-search__label{
	background-color: rgb(247,247,247);
	padding: 4px 0px 4px 10px;
	margin: 5px 0;
	position: relative;
	font-size: 14px;
	width: auto;
}
.wp-block-search .wp-block-search__label:before{
	content: "";
	height: 100%;
	width: 8px;
	position: absolute;
	left: -8px;
	top: 0;
	background-color: #999;
	display: inline-block;
}

/*主边栏其他*/
.wp-block-group__inner-container h2{
	background-color: rgb(247,247,247);
	padding: 10px;
	margin: 5px 0;
	position: relative;
	font-size: 14px;
}
.wp-block-group__inner-container h2:before{
	content: "";
	height: 100%;
	width: 8px;
	position: absolute;
	left: -8px;
	top: 0;
	background-color: #999;
	display: inline-block;
}

修改 Twenty Twelve: content.php 文件，增加文章摘要显示

笔者并不是很懂PHP，以至于花了几个小时才弄好，也许这个方法并不是很完美，但已经达到效果。

只需要将 entry-content 区域改为下面代码即可，默认摘要的是300字，大家可自行修改。

<div class="entry-content">

    <?php if ( is_single() && 'post' == get_post_type() ) : ?>
    <?php the_content( __( 'Continue reading <span class="meta-nav">&rarr;</span>', 'twentytwelve' ) ); ?>
    <?php else : ?>
    <?php echo wp_trim_words(get_the_content( __( 'Continue reading <span class="meta-nav">&rarr;</span>', 'twentytwelve' ) ) ,300," ..."); ?>

    <?php if(strlen(wp_strip_all_tags(get_the_content( __( 'Continue reading <span class="meta-nav">&rarr;</span>', 'twentytwelve' ) ))) >=300 ) :?>
    <a href="<?php the_permalink(); ?>" rel="bookmark">阅读更多</a>
    <?php endif; ?>

    <?php endif; ?>

    <?php
    wp_link_pages(
        array(
            'before' => '<div class="page-links">' . __( 'Pages:', 'twentytwelve' ),
            'after'  => '</div>',
        )
    );
    ?>
</div><!-- .entry-content -->