网站想实现工作在左，生活在右的想法：左侧边栏展示技术探索的内容，右侧边栏显示平时自己的小随笔，小画作。经过一晚上的研究，终于初步形成现在网站的样子，现在将实现方法记录在下。
第一步、在 functions.php文件中添加文本小工具运行PHP代码的功能和 获取文章第一张图片的功能，同时附上 文件开启缩略图功能 ，因为缩略图显示效果不理想，我没有采用缩略图，而是通过框架限制了图片显示的大小
//在wordpress主题的functions.php文件中添加文本小工具运行PHP代码
add_filter('widget_text', 'php_text', 99);
function php_text($text) {
if (strpos($text, '<' . '?') !== false) {
ob_start();
eval('?' . '>' . $text);
$text = ob_get_contents();
ob_end_clean();
}
return $text;
}
//在wordpress主题的functions.php文件中添加获取文章第一张图片的方法：
function catch_first_image() {
global $post; $first_img = '';
ob_start(); //打开输出缓冲
ob_end_clean(); //清空缓冲区 并关闭输出缓冲
//通过正则来匹配文章内容中的图片，把获取到的图片地址放到$matches数组中
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$first_img = $matches [1] [0]; //从数组中获取第一张图片地址
if(empty($first_img)){ //如果没有图片，就启用默认随机图片
$random = mt_rand(1, 10); //随机 1-10 的数字，表示共10个随机图片
$first_img = get_bloginfo ( 'stylesheet_directory' ).'/images/random/'.$random.'.jpg'; //默认图片路径在主题目录下的/images/random/目录里
}
return $first_img; //返回图片地址
};第二步、在小工具中拖曳文本框到右侧第二个位置，填入以下代码，一定要在文本模式下粘贴，如果需要修改代码，可以copy到记事本里面修改后再粘贴回来，直接修改后有可能工作不正常。
//文本小工具调用指定栏目图文的代码
<ul>
<?php
$args=array(
'cat' => 1, // 这个分类目录的ID号，可以通过在WordPress后台的“分类目录”中查看。（选择“分类栏目”>将鼠标放到需要查看的栏目的名称“SEO教程自学网”上>查看浏览器底部显示的链接-tag_ID后面的数字为3。）
'posts_per_page' => 5, // 这个是调用文章需要显示的篇数。
);
query_posts($args);
if(have_posts()) : while (have_posts()) : the_post();
?>
<li>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
<span>
<?php if (has_post_thumbnail()) { //如果缩略图存在，就调用缩略图
the_post_thumbnail( 'thumbnail',array( 'alt' => trim(strip_tags( $post->post_title )), 'class' => 'home-thumb'));
}else { //如果缩略图不存在，就调用functions.php中的catch_first_image()方法获取第一张图或默认图
echo '<img src="'.catch_first_image().'" alt="'.$post->post_title.'" width="300" height="300" />';
}
?>
<?php if (has_excerpt()) {
echo $deion = get_the_excerpt(); //调用我们文章页面的页面描述内容，也就是deion标签内容。
}
else {
echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 170,"……");
//如果没有写deion标签内容，则会自动选择一段。
}
?>
</span>
</li>
<?php
endwhile; endif; wp_reset_query();
?>
</ul>
第三步、在主页左侧不再出现非技术性的内容，编辑主题中的index.php文件，编辑如下代码（6-24日晚上搞定）
//我采用的主题是FlatMagazinews，编辑index.php文件，查找
if ( have_posts() ) :
//替换成
if ( have_posts() ) : query_posts($query_string .'&cat=-1');
//这样，我的艺术生活中的文章不再出现在首页左侧了