仅当缩略图可用时才将缩略图添加到搜索结果中? [英] Add thumbnail to search results ONLY if the thumbnail is available?

查看：47
本文介绍了仅当缩略图可用时才将缩略图添加到搜索结果中?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我目前拥有<?php the_post_thumbnail('post-thumbnail', array('class' => "search-thumb attachment-post-thumbnail"));?> 位于包含搜索结果标题和摘录的 div 中.我想要实现的是 ONLY 添加缩略图(如果帖子可用).

我这样做的原因是因为添加缩略图会使 div 的高度更大.假设带有缩略图的 div 的高度为 150 像素.如果搜索结果没有缩略图，我想消除高度并使 div 仅适合文本.

search.php 中的 HTML//

<div id="container" class="clearfix"><div id="content-wrap"><h1 class="heading1">搜索结果</h1><div class="br"></div><div class="clear"></div><h2><?php echo 'Items Found' .$wp_query->found_posts;?></h2><div class="clear"></div><?php if(have_posts()): ?><?php while(have_posts()) : the_post();?><div class="s-res"><h3><a href="<?php the_permalink() ?>"rel="书签"><?php the_title();?></a></h3><div class="search-thumb"><?php the_post_thumbnail('post-thumbnail', array('class' => "search-thumb attachment-post-thumbnail"));?>

<?php echo str_replace('[...]', '', get_the_excerpt());?>

<?php endwhile;?><?php 其他:?><i><?php _e('抱歉，没有符合您的搜索条件.<br>请使用不同的关键字再试一次.');?></i><?php endif;?>

<?php get_footer();?>

CSS 显示高度等//

.s-res {高度:150px；底边距:10px；}img.search-thumb {向左飘浮;背景: url(images/diag_lines.png) 重复；高度:100px；填充:10px；}

屏幕截图//

解决方案

只需将缩略图 div 包裹在 if ( has_post_thumbnail() ) {... 条件块中.当您使用该函数时，您的代码应如下所示:

<div id="container" class="clearfix"><div id="content-wrap"><h1 class="heading1">搜索结果</h1><div class="br"></div><div class="clear"></div><h2><?php echo 'Items Found' .$wp_query->found_posts;?></h2><div class="clear"></div><?php if(have_posts()): ?><?php while(have_posts()) : the_post();?><div class="s-res"><h3><a href="<?php the_permalink() ?>"rel="书签"><?php the_title();?></a></h3><?php if ( has_post_thumbnail() ): ?><div class="search-thumb"><?php the_post_thumbnail('post-thumbnail', array('class' => "search-thumb attachment-post-thumbnail"));?>

<?php endif ?><?php echo str_replace('[...]', '', get_the_excerpt());?>

<?php endwhile;?><?php 其他:?><i><?php _e('抱歉，没有符合您的搜索条件.<br>请使用不同的关键字再试一次.');?></i><?php endif;?>

<?php get_footer();?>

我建议您在提问之前先快速进行Google搜索；) 这个功能很不错很容易找到，而且 WordPress 有一个很好的代码文档，所以你很有可能在那里找到大部分问题的答案.

I currently have the <?php the_post_thumbnail('post-thumbnail', array( 'class' => "search-thumb attachment-post-thumbnail")); ?> inside of a div that holds the Search Result Title, and Excerpt. What I'm trying to achieve is ONLY adding the thumbnail if the post has it available.

My reason for this is because adding a thumbnail will make the div's height larger. Let's say the div with the thumbnail is 150px in height. I'd like to eliminate the height and have the div fit ONLY the text if the search result has no thumbnail.

HTML within search.php//

<?php get_header(); ?>

<div id="container" class="clearfix">
<div id="content-wrap">

<h1 class="heading1">Search Results</h1>
<div class="br"></div>

<div class="clear"></div>
<h2><?php echo 'Items Found ' . $wp_query->found_posts; ?></h2>
<div class="clear"></div>

<?php if(have_posts()): ?> <?php while(have_posts()) : the_post(); ?>


    <div class="s-res">
    <h3><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h3>
    <div class="search-thumb">
            <?php the_post_thumbnail('post-thumbnail', array( 'class'   => "search-thumb attachment-post-thumbnail")); ?>
        </div>
    <?php echo str_replace('[...]', '', get_the_excerpt()); ?>
    </div>

    <?php endwhile; ?>
    <?php else : ?>
    <i><?php _e('Sorry, but nothing matched your search criteria.<br> Please try again with different keywords.'); ?></i>
    <?php endif; ?>

</div>
</div>





<?php get_footer(); ?>

CSS to show height ect//

.s-res {
    height: 150px;
    margin-bottom: 10px;
}

img.search-thumb {
    float: left;
    background: url(images/diag_lines.png) repeat;
    height: 100px;
    padding: 10px;
}

SCREENSHOT//

解决方案

Just wrap your thumbnail div within a if ( has_post_thumbnail() ) {... conditional block. Here is how your code should look like when you make use of the function:

<?php get_header(); ?>

<div id="container" class="clearfix">
<div id="content-wrap">

<h1 class="heading1">Search Results</h1>
<div class="br"></div>

<div class="clear"></div>
<h2><?php echo 'Items Found ' . $wp_query->found_posts; ?></h2>
<div class="clear"></div>

<?php if(have_posts()): ?> <?php while(have_posts()) : the_post(); ?>

    <div class="s-res">
    <h3><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h3>
    <?php if ( has_post_thumbnail() ): ?>
        <div class="search-thumb">
            <?php the_post_thumbnail('post-thumbnail', array( 'class'   => "search-thumb attachment-post-thumbnail")); ?>
        </div>
    <?php endif ?>
    <?php echo str_replace('[...]', '', get_the_excerpt()); ?>
    </div>

    <?php endwhile; ?>
    <?php else : ?>
    <i><?php _e('Sorry, but nothing matched your search criteria.<br> Please try again with different keywords.'); ?></i>
    <?php endif; ?>

</div>
</div>

<?php get_footer(); ?>

I'd suggest that you first do a quick Google search before asking a question ;) This function is pretty easy to find, besides WordPress has a pretty good code documentation, so it's quite possible that you'll be able to find an answer to most of your questions there.

这篇关于仅当缩略图可用时才将缩略图添加到搜索结果中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
PHP最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆