WordPress的 - 使用Featherlight.js

Question

我試圖代碼我的wordpress主題儘可能簡單，但我真的不明白，爲什麼我不能顯示從高級定製字段中的圖像進入模式對話框打開一個高級自定義字段圖像使用Featherlight.js一個模式對話框（http://noelboss.github.io/featherlight/）

這是我在網上http://www.skuar.com頁面

這是我的single.php代碼，它只是顯示圖像的自定義字段

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

<?php 

$image = get_field('image'); 

if(!empty($image)): ?> 

    <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" /> 

<?php endif; ?> 

    <?php endwhile; ?> 
    <?php endif; ?> 

，這是wp循環c ontent

<div id="post"> 
    <a href ="<?php the_permalink(); ?>"> 

    <div class="img" href="<?php 

$image = get_field('image'); 

if(!empty($image)): ?> 

    <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" /> 

<?php endif; ?>" data-featherlight="image"> 
<?php 

$image = get_field('image'); 

if(!empty($image)): ?> 

    <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" /> 

<?php endif; ?> 
    </div> 

    </a> 

</div> 

我只是想在燈箱打開圖像... 是這樣有意義嗎？

謝謝！

Answer 1

代碼中的無效雙引號。試試這個代碼：

<div id="post"> 
     <a href ="<?php the_permalink(); ?>"> 
      <div class="img" href="<?php $image = get_field('image'); 
       if(!empty($image)): ?> 
       <?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?> 
       <?php endif; ?>" data-featherlight="image"> 
      </div> 
     </a> 
    </div>