在WordPress檔案循環中添加貓頭鷹傳送帶而不是帖子縮略圖

我正在爲每個帖子的內容實施圖庫元域的Wordpress主題。我想使用此圖庫中的圖片在歸檔頁面上添加貓頭鷹傳送帶，而不是郵件的縮略圖。在WordPress檔案循環中添加貓頭鷹傳送帶而不是帖子縮略圖

主要問題是在我的循環中，我會將我的傳送帶包裹在貓頭鷹div中並動態給它一個id，它將與當前帖子的編號id="owl-archive-<?php the_ID();?>"相關，因此它對於存檔中出現的每個帖子都是唯一的。然後，我必須在我的js文件中爲這些id中的每一個動態地調用owl-carousel函數，這是我的問題。

if (have_posts()) { 
while (have_posts()) { 
    the_post(); 
    //carousel starts 
    <div id="owl-archive-<?php the_ID();?>" class="owl-carousel owl-theme"> 
    <?php foreach ($gallery_ids as $gallery_id): $gallery_image = wp_get_attachment_image_src($gallery_id,'full'); ?> 
     <div class="item"> 
     <a class="noo-lightbox-item" data-lightbox-gallery="gallert_<?php the_ID()?>" href="<?php echo $gallery_image[0]?>"><?php echo wp_get_attachment_image($gallery_id, 'full'); ?></a> 
     </div> 
    <?php endforeach;?> 
    </div> 
//carousel ends 
} 
}

我怎麼能動態調用我的ID從owl-archive-<?php the_ID();?>而不是#owl-archive

$("#owl-archive").owlCarousel({ 
     navigation : false, 
     slideSpeed : 300, 
     paginationSpeed : 400, 
     singleItem:true, 
     autoPlay:true, 
    });

來源

2016-12-07 sokostas

我設法用最簡單的方法解決它。 data attr。

<div data-archive="<?php the_ID();?>" id="owl-archive-<?php the_ID();?>"

然後我的JS

$('.owl-carousel').each(function(){ 
    var the_id = $(this).data('archive') 
    $('#owl-archive-' + the_id).owlCarousel({ 
     navigation : false, 
     slideSpeed : 300, 
     singleItem:true, 
     autoPlay:false, 
     navigation:false, 
     pagination:false, 
     lazyLoad : true, 
     autoHeight : true 
    }); 
});

來源

2016-12-08 09:49:47 sokostas

您可以使用wp_localize_script()，這個功能是用來處理在js文件的PHP變量。

你可以閱讀更多並找到所有你所需要的here

希望它能幫助！

來源

2016-12-07 19:14:11 Benoti

在WordPress檔案循環中添加貓頭鷹傳送帶而不是帖子縮略圖

回答

相關問題