設置WordPress縮略圖文章的大小

我創建了按類別ID獲取文章縮略圖的函數。這是代碼：設置WordPress縮略圖文章的大小

<div class="row text-center"> 
    <?php 
     foreach ($wp_query->posts as $single_post) 
     { 
      $single_post_ID = $single_post->ID; 
      $url = wp_get_attachment_url(get_post_thumbnail_id($single_post_ID, 'medium')); 
    ?> 
    <div class="col-md-3 col-sm-6 hero-feature"> 
     <div class="thumbnail"> 
     <img src="<?php echo $url ?>" /> 
      <div class="caption"> 
       <h2><?php echo get_the_title($single_post_ID); ?></h2> 
       <p> 
       <a href="#" class="btn btn-primary">Commander</a> 
       <a href="#" class="btn btn-default">Plus Info</a> 
       </p> 
      </div> 
     </div> 
    </div> 
    <?php } ?> 
</div>

我想與WordPress的功能設置大拇指800像素的大小500像素。
謝謝

來源

2014-12-05 Boytun

從我什麼，你的WordPress功能輸出你的形象內.thumbnail。所以做這個事情

.thumbnail { 
width: 800px; 
height: 500px; 
overflow: hidden; /* Cuts off whatever goes beyond the given width */ 
} 


.thumbnail img { 
    width: 100%; /* 100% equals 800px as defined for .thumbnail */ 
    height: auto; /* Allows the image a breathing option so it doesn't deteriorate */ 
}

注：包含的元素已經具有規定的寬度（800像素），所以圖像不會超出800像素

來源

2014-12-05 15:16:44

這不是一個WordPress的功能做這樣問。如果你想在響應容器等圖像上使用100％的寬度，這是一個很好的解決方案。但是如果設計是靜態的，那麼爲什麼圖像要大一些呢？ – 2014-12-05 15:26:28

包含的元素已經有一個給定的寬度，所以圖像不會超過800像素 – 2014-12-05 15:28:02

是的，它會工作，但真正的圖像將被加載，它會更大，然後需要。如果響應速度更快，但如果沒有，則可以製作多種圖像大小以使頁面負載更輕，這是非常有用的。想象一下，100 +的圖像縮略圖太大了，沒有空... – 2014-12-05 15:29:19

使用add_image_size在你的functions.php：Wordpress documentation。

add_image_size('my-thumbnail', 800, 500, true);

或者使用插件來創建更多圖片尺寸，如this。

然後將媒體格式更改爲新格式。如果將更大的圖像設置爲較小的CSS（性能問題），那將會更好。之後，總是取決於您的網站是否響應或不使用更大的圖像，但這是另一個話題。

$url = wp_get_attachment_url(get_post_thumbnail_id($single_post_ID, 'my-thumbnail'));

更新：圖像必須被重新上載或者使用這個插件：Resize Image After Upload

來源

2014-12-05 15:21:16

它對我不起作用:( – Boytun 2014-12-05 15:33:04

我忘了提及你必須重新上傳你的文件或者使用這個插件來做到這一點： https://wordpress.org/plugins/resize-image-after-upload/ – 2014-12-05 15:34:31

閱讀插件說明，這是一個很好的評論關於整個圖像的事情！它也壓縮圖像。 – 2014-12-05 15:41:34

設置WordPress縮略圖文章的大小

回答

相關問題