天津11选5诀窍:wordpress如何調用標簽tag文章列表

作者: 魯智深 分類: wordpress 發布時間: 2013-09-01 23:19

天津11选5中奖结果 www.ebzvaz.com.cn 如何調用tag下面的文章,以列表的方式呈現出來?

本人博客的側邊欄“CamtasiaStudio7視頻軟件使用教程”就是利用此方法調用。

如下圖:

調用tag下的文章

調用tag下的文章

php代碼部分

php調用代碼如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<?php
    $args=array(
        'tag_id' => 82,
        'posts_per_page' => 5,
    );
    query_posts($args);
    if(have_posts()) : while (have_posts()) : the_post();
?>
                <li>
               <img src="<?php echo catch_first_image() ?>" alt="<?php the_title(); ?>" width="40" height="40" /><div>
                    <a href="<?php the_permalink(); ?>"  title="<?php the_title(); ?>">  <?php echo cut_str($post->post_title,36); ?></a>
                    <p>
                        <?php echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 35,"……"); ?>
                      </p>
                </div>
              </li>
           
<?php endwhile; endif; wp_reset_query();?>

如果不想調用出圖片!把下面的這段代碼刪除。

1
<img src="<?php echo catch_first_image() ?>" alt="<?php the_title(); ?>" width="40" height="40" />

去除圖片后的效果圖如下:

調用tag下的文章

調用tag下的文章

css樣式部分

1
2
3
4
#new_art ul{padding:5px 5px;}
#new_art ul li{border-bottom: 1px dotted #CCC;padding:3px 0;}
#new_art ul li a.title{padding:0 0 0 15px; background:url(images/newAirtl_icon.png) no-repeat 3px 50%;max-width:170px;overflow:hidden;}
#new_art ul li img{ float: left; height: 40px;margin: 5px 10px 0 0px;}

注意:如果出現錯位或者位置偏離,可調整css樣式參數!

如果覺得我的文章對您有用,請隨意打賞。您的支持將鼓勵我繼續創作!

發表評論

電子郵件地址不會被公開。 必填項已用*標注