Custom Thumbnails

时间:2016-10-22 作者:APDB

我想为WordPress安装的主页创建自定义缩略图对话。

这就是我想要实现的目标:image

这是上图的引导代码:

<div class="row">
    <div class="col-sm-6 col-md-4">
        <div class="thumbnail">
            <img src="..." alt="...">
            <div class="caption">
                <h3>Thumbnail label</h3>
                <p>...</p>
                <p>
                    <a href="#" class="btn btn-primary" role="button">Button</a>
                    <a href="#" class="btn btn-default" role="button">Button</a>
                </p>
            </div>
        </div>
    </div>
</div>
因此,到目前为止,我有下面的代码,我不能在一行中包含内容。

<div class="row">   
    <div class="col-sm-6 col-md-4">
        <?php // theloop
        if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>        

<?php// Define our WP Query Parameters ?>
<?php $the_query = new WP_Query( \'posts_per_page=3\' ); ?>

<?php// Start our WP Query ?>
<?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?>


<div class="thumbnail"><?php the_post_thumbnail(array(100, 100)); ?>
<div class="caption">            
<?php// Display the Post Title with Hyperlink?>
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>


<?php// Repeat the process and reset once it hits the limit
</div>    
</div>
</div>   
<?php
endwhile;
wp_reset_postdata();
?>
下面的屏幕截图反映了我当前代码的结果(不可取):image

我怎样才能做到?

2 个回复
最合适的回答,由SO网友:APDB 整理而成

我把它修好了。不过还是要谢谢大家。

        <div class="row">   
          <h4>Noticias Recentes</h4>
          <?php // theloop
        if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>


<?php// Define our WP Query Parameters ?>
<?php $the_query = new WP_Query( \'posts_per_page=3\' ); ?>

<?php// Start our WP Query ?>
<?php while ($the_query -> have_posts()) : $the_query -> the_post(); ?>

      <div class="col-sm-6 col-md-4">

<div class="thumbnail"><?php the_post_thumbnail(array(100, 100)); ?>
<div class="caption">            
<?php// Display the Post Title with Hyperlink?>
<h3><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h3>



<!--// Repeat the process and reset once it hits the limit-->
</div>    
</div>    
</div>  
<?php
endwhile;
wp_reset_postdata();
?>

SO网友:Florian

在您的代码中,它表示:the_post_thumbnail(array(100, 100));. 您正在使用the function the_post_thumbnail(); 获取100px*100px的图像或与媒体库中的图像尽可能接近的图像。

您可以使用不同的图像大小,即。the_post_thumbnail(\'medium\');.

你也可以register a new image size 更接近您的需求。

相关推荐

为什么我的主题的css在另一个网站上不起作用

我在Neve theme的基础上开发我的on theme。首先,我对脚本有问题,因为它不起作用,但我不得不从页脚更改它们的位置。php到标题。php的一切都很好。新的一些脚本无法工作,因为css根本没有加载。我尝试了5种不同的方法,但都失败了。标题中的。php我只是给他们<style> </style></我在函数中使用了寄存器样式。php,标题。php和页脚。php function my_theme_enqueue_styles() { &#x