首页 > 网站 > 建站经验 > 正文

非插件实现WordPress侧栏最新文章列表+缩略图调用

2024-04-25 20:31:43
字体:
来源:转载
供稿:网友

 如果是一般的WordPress主题,需要调用最新的文章列表至侧边栏直接拖动小工具就可以完成,即便有些主题不支持小工具我们也可以在侧边模板中手工添加最新的内容。但是,如果需要在侧边栏调用最新的内容且带有缩略图,要么可以用插件解决,要么采用无插件代码实现,这里老蒋整理非插件实现WordPress侧栏最新文章列表+缩略图调用。

第一、代码部分

<ul id="new-posts">
<?php
$recentPosts = new WP_Query();
$recentPosts->query('showposts=10'); ?>
<?php while ($recentPosts->have_posts()) : $recentPosts->the_post(); ?>
<li>
<?php
if ( has_post_thumbnail() ) {
?>
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail('thumb', array('alt' => ''.get_the_title().'', 'title' => ''.get_the_title().'')); ?></a>
<a class="new-post-title" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
<?php } else {?> <a class="new-post-title" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a>
<?php } ?>
<p>in <span class="new-categ"><?php $category = get_the_category(); $categLink = get_category_link($category[0]->cat_ID); ?> <a href="<?php echo $categLink; ?>" title="<?php $category[0]->cat_name; ?>"><?php echo $category[0]->cat_name; ?></a></span></p>
</li>
<?php endwhile; ?>
</ul>

利用WP_Query函数调用最新的文章以及缩略图,前提是我们必须有缩略图的功能,这个我们自己添加就可以。

第二、样式部分

需要定义样式部分,根据实际情况再做未调整。

#new-posts li { overflow:auto; margin:20px 0px;}
#new-posts li img { float:left; margin-right:10px; border:3px solid #798295;}
.new-post-title { text-decoration:none; font-weight:bold; color:#798295;}
.new-post-title:hover{color:#6eaebe;}
#new-posts li p { margin-top:10px; }
.new-categ{padding:5px;background:#6eaebe;}
.new-categ a{ font-weight:normal;color:#464b56;}
.new-categ a:hover{color:#545b68;}

这样我们可以看到调用的最新WORDPRESS内容且带有缩略图效果。

本文原创来自:http://www.itbulu.com/wordpress-new-post-thumb.html

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表