基於特色圖像的頁面上的動態和響應式Wordpress圖像

Question

好吧，所以我瀏覽了這里，試圖找到一個解決方案，然后我發現一些php作為回答出現了兩次，但是它對我不起作用，所以這就是問題所在。

我有一個自定義的wordpress主題。 在導航欄下，我想基於該頁面的特色圖像放置一個動態圖像。 圖像需要具有響應性，並且需要在頁面的整個寬度上散布，就像您想像響應式標題圖像才能起作用一樣。 我可以處理響應式CSS位，並在將其拉出時將圖像放入div中，但是圖像甚至沒有拉出。

這是兩次有關堆棧溢出的答案的代碼：

  <img src="<?php $img=wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); echo $img[0]; ?>" alt="<?php the_title(); ?>"/>

它不起作用。 php字符串未提取縮略圖URL，控制台中唯一的輸出是包裝在img標簽中的alt信息。 我不知道它是否與header.php中的代碼有關，但是任何建議都很好。

Answer 1

<?php 
if ( has_post_thumbnail()) {
    $featureImage = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'feature' );
    $featureImage = $featureImage[0];
?>   
<div id="feature" style="background-image: url('<?php echo $featureImage; ?>')">
<? } else { ?>
<div id="feature">
<? } ?>

這就是我過去完成此任務的方式。

Answer 2

使用它在循環中顯示帖子縮略圖。 您也可以傳遞elseif語句以在沒有上載任何圖像時不顯示任何內容，或顯示一個占位符圖像。 希望有幫助！

<?php if ( has_post_thumbnail()) : ?>

    <?php the_post_thumbnail('PLACE-CUSTOM-SIZE-HERE-OR-OMIT-TO-USE-ORIGINAL-SIZE'); ?>

<?php endif; ?> 

Answer 3

我只是將其留在這里，以防引起您的問題。

在文檔頁面上： get_post_thumbnail_id（）

注意：要啟用特色圖片，請參閱發布縮略圖，當前主題必須包含add_theme_support（'post-thumbnails'）;