在WordPress模板中顯示ACF字段的問題

Question

好吧，我遇到了最奇怪的問題。我有一個自定義的主頁模板，用於我正在處理的WordPress網站。

你可以在後臺here上看到我的ACF字段用於這個模板設置的截圖。

我遇到的問題是，當我嘗試顯示領域

<img src="<?php the_field('slide_1_thumb'); ?>" alt="" /> 

圖像不顯示在所有。我有返回值設置爲「圖片網址」，而奇怪的是，它顯示的圖像爲

<?php the_field('slide_1'); ?> 

就好了，沒有問題的。

我不確定我在這裏做錯了什麼，但根本沒有拼寫錯誤，由於某些原因，這些slide_1_thumb圖片不會顯示出來。我想這是奧卡姆的剃刀類型的情況之一，我錯過了這麼簡單的事情，但我已經忘了這一百萬次，沒有運氣。

下面你會找到我的home-page.php模板的PHP代碼的副本。

<?php 
/** 
* Template Name: Home Page 
* 
* A custom template for the home page. 
* 
* The "Template Name:" bit above allows this to be selectable 
* from a dropdown menu on the edit page screen. 
*/ 

get_header(); ?> 

<div id="slideshow-container"> 
<div id="slideshow" class="slideshow pcfcu-theme"> 
    <div class="slideshow-img" style="background-image: url(<?php  the_field('slide_1'); ?>);"> 
     <div class="slideshow-img-inner"> 
      <div class="slideshow-img-text"> 
       <h1><?php the_field('slide_1_title'); ?></h1> 
       <p><?php the_field('slide_1_description'); ?></p> 
      </div> 
     </div> 
    </div> 
    <div class="slideshow-img" style="background-image: url(<?php the_field('slide_2'); ?>);"> 
     <div class="slideshow-img-inner"> 
      <div class="slideshow-img-text"> 
       <h1><?php the_field('slide_2_title'); ?></h1> 
       <p><?php the_field('slide_2_description'); ?></p> 
      </div> 
     </div> 
    </div> 
    <div class="slideshow-img" style="background-image: url(<?php the_field('slide_3'); ?>);"> 
     <div class="slideshow-img-inner"> 
      <div class="slideshow-img-text"> 
       <h1><?php the_field('slide_3_title'); ?></h1> 
       <p><?php the_field('slide_3_description'); ?></p> 
      </div> 
     </div> 
    </div> 
</div> 
</div> 

<div id="content-container"> 
<div id="content-container-inner"> 
    <div id="recent-blog-entries-container"> 
     <div id="recent-blog-entries"> 
      <header><h1>Recent Blog Entries</h1></header> 
      <?php $postslist = get_posts('numberposts=2&order=DESC&orderby=date'); 
       foreach ($postslist as $post) : setup_postdata($post); 
      ?> 
       <h2 class="rbe-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
       <p class="rbe-posted-on">Posted on: <?php the_time(get_option('date_format')) ?></p> 
       <div class="rbe-excerpt"><?php the_excerpt(); ?></div> 
      <?php endforeach; ?> 
     </div> 
    </div> 

    <div id="features"> 
     <header><h1>Features</h1></header> 
     <a class="goTo1"><div class="feature-thumb"><img src="<?php the_field('slide_1_thumb'); ?>" alt="" /></div></a> 
     <a class="goTo2"><div class="feature-thumb"><img src="<?php the_field('slide_2_thumb'); ?>" alt="" /></div></a> 
     <a class="goTo3"><div class="feature-thumb"><img src="<?php the_field('slide_3_thumb'); ?>" alt="" /></div></a> 
    </div> 
</div> 
</div> 

<?php get_footer(); ?> 

另一個奇怪的事情是，如果你把工作ACF圖像，如

<?php the_field('slide_1'); ?> 

它完美的作品和圖像輸出，但是當你將其移動到了「功能」部分中的一個的代碼來查看它是否能夠代替這些小功能縮略圖中的某一個，它不會在代碼的這一部分中工作。就好像頁面底部的'Features'部分存在某種錯誤，但我在代碼中看不到任何錯誤。

換句話說，所有這些代碼一直工作到完美，直到它的最後部分與'功能'縮略圖圖像。你可以在網站here上看到這個。

Answer 1

使用get_posts（）創建新循環時，應該使用wp_reset_postdata（）函數結束它，以將循環數據重置爲get_posts（）之前的數據。所以試試這個：

<div id="recent-blog-entries"> 
    <header><h1>Recent Blog Entries</h1></header> 
    <?php $postslist = get_posts('numberposts=2&order=DESC&orderby=date'); 
    foreach ($postslist as $post) : setup_postdata($post); ?> 
     <h2 class="rbe-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2> 
     <p class="rbe-posted-on">Posted on: <?php the_time(get_option('date_format')) ?></p> 
     <div class="rbe-excerpt"><?php the_excerpt(); ?></div> 
    <?php endforeach; ?> 
    <?php wp_reset_postdata(); ?> 
</div> 

在你的循環之後添加wp_reset_postdata（）應該爲你解決這個問題。

Answer 2

好吧，我不知道發生了什麼事情，但是我必須做的所有事情都是刪除後端的ACF字段，然後使用與之前相同的EXACT名稱重新創建它們。果然，修復它。

所以，雖然我沒有確切的答案來解釋爲什麼會發生這種情況，但我只能說這肯定是某種奇怪的故障。