wordpress最新文章2列(2排)显示的代码,需要配合css来完成。常见的最新文章调用代码如下:
<?php $rand_posts = get_posts('numberposts=8&orderby=date');foreach($rand_posts as $post) : ?> <br /><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <?php endforeach;?>
numberposts
是需要提取的文章数,orderby
是文章排序方式。
下面这个代码把文章分2列,无需依赖主题css,最新文章链接为蓝色,鼠标指针浮动在字体上显示红色。添加外边框。
<style> .relates { font-size: 16px; } .relates ul{ list-style: disc; margin-left: 1px; color: #bbb; margin-bottom: 30px; overflow: hidden; } .relates ul li { width: 50%; float: left; word-break: break-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .relates ul {margin-bottom: 18px;} /*此处自行调整,我设置的相关文章数是8,这里设置的18px刚好合适*/ .art_new_box a { color: #00a67c; } .art_new_box a { outline: none; text-decoration: none; } .art_new_box a:hover{ color:#f00;} .art_new_box { background:#FFFFFF; float: left; margin: 0 0 10px 0; position: relative; border: 1px solid #DBDBDB; -moz-border-radius: 5px; -webkit-border-radius: 5px; der-radius: 4px; /* width: 808px;*/ } </style> <div class="art_new_box"> <div class="relates"><ul> <?php query_posts('showposts=8'); ?> <?php while (have_posts()) : the_post(); ?> <li>   <i class="fa fa-minus"></i> <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></li> <?php endwhile; ?> </ul> </div> </div>
这里是需要调用Font Awesome图标库的。
评论0