News and Featured image

时间:2015-02-26 作者:Ray Williams

我试图在垂直设计的3列中列出我的新闻项目:图像、日期、标题。我在调用特色图像时遇到一些问题。是否有一个特定的功能可以帮助我做到这一点?是否还要添加CSS样式以在3列中列出它们?

网站示例:http://www.enterpriseflorida.com/why-florida/infrastructure/

我的代码:

    <?php 
        $posts = get_posts( \'numberposts=2&order=DESC&orderby=post_title&category_name=news\' );

        foreach ( $posts as $post ) : start_wp();
    ?>
            <?php toolbox_posted_on(); ?>
            <h4><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title() ; ?></a></h4>
    <?php endforeach; ?>
</div>
<a href="#" class="btn blue">Read All News</a>

2 个回复
SO网友:ngearing

显示特征图像的功能是http://codex.wordpress.org/Post_Thumbnails

要在列中显示内容,最好的方法是将内容包装在html元素中,然后将其浮动。例如:。

在模板中,您可能有:

<?php 
    $posts = get_posts(\'numberposts=2&order=DESC&orderby=post_title&category_name=news\' );
    foreach ( $posts as $post ) : start_wp();

    echo "<div class=\'news_item\'>";

        toolbox_posted_on();

        if ( has_post_thumbnail() ) {
            the_post_thumbnail();
        } 
?>
        <h4>
            <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
                <?php the_title() ; ?>
            </a>
         </h4>

<?php 
    echo "</div>";    
    endforeach; 
?>
那么您的css将类似于:

.news_item {
    float: left;
    padding: 5px;
    width: 33.33%;
}
更新了答案,并附有摘录

要自定义“阅读更多”功能,请阅读以下页面:Customizing the Read more

但总而言之,请使用以下方法:

// Replaces the excerpt "more" text by a link
function new_excerpt_more($more) {
       global $post;
    return \'<a class="moretag" href="\'. get_permalink($post->ID) . \'"> Read the full article...</a>\';
}
add_filter(\'excerpt_more\', \'new_excerpt_more\');

SO网友:codewizard

这里的一些代码已经过时了,并且已经有一段时间不推荐使用了。我将使用更新的代码,以便对那些无意中发现此线程的人更有用。

<div class=\'news_item\'>
    <?php 
    $posts = get_posts( \'numberposts=2&order=DESC&orderby=post_title&category_name=news\' );

        foreach ( $posts as $post ) : setup_postdata($post);  ?>
            <?php toolbox_posted_on();

            //Check if post has thumbnail 
            if ( has_post_thumbnail() ) :

                //Output img tag automatically
                the_post_thumbnail();

            //Output
            ?>
            <?php endif; ?>
            <h4>
                <a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
                    <?php the_title() ; ?></a>
            </h4>
        <?php endforeach;
        wp_reset_postdata(); ?>
</div>
<a href="#" class="btn blue">Read All News</a>
您的CSS

.news_item {
    float: left;
    padding: 5px;
    width: 33.33%;
}

结束

相关推荐

通过unctions.php删除页面时间戳,使其不会显示在Google搜索结果描述中

我想通过函数从页面(不是帖子)中删除上次更新/上次修改的日期。php(这可以通过使挂钩为空来实现吗?)目标是删除因日期修改代码而显示的google搜索结果描述日期时间戳。我只希望该函数在页面上运行(因为页面上次更新/创建的时间通常无关紧要)。我意识到这可以通过修改页面模板中的底层代码来实现,但这种方法更容易实现。谢谢