Fancybox (on Wordpress) Следующая и предыдущая кнопки

Question

Я использую сценарий Fancybox на моем веб-сайте Wordpress, чтобы отобразить мое портфолио. Вот как это делается:

Пользователи переходят на мою страницу с портфолио архива, где они могут видеть все мои работы. Когда они нажимают на один из наших элементов портфеля, вместо того, чтобы перевести вас на страницу с одной почтой, он просто показывает информацию о одном сообщении в fancybox для элемента, который они нажали.

Все это отлично работает, но я хотел бы использовать стрелку Previous и Next для перемещения между работами, пока отображается fancybox.

Я думал, что я мог бы уйти с использованием встроенного в WP функции следующей и предыдущей в петле, как так:

<?php previous_post(); ?> <?php next_post(); ?> 

Но это не работает, и я предполагаю, что это потому, что одной страницы с постом никогда не отображается.

Anyways here is a link I found on the callbacks for it, но мои навыки JS почти отсутствуют.

и, наконец, вот как выглядит мой шаблон архива и как я его использую.

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

       <?php $counter = 1 ?> 

      <!-- START LOOP --> 
      <?php while (have_posts()) : the_post(); ?> 

         <div class="three columns portfolio-piece"> 
          <a href="#more-info<?php echo $counter ?>" class="fancybox"> 

           <?php 
            if (has_post_thumbnail()) { 
             the_post_thumbnail('custom-archive-size'); 
            } else { 
             echo 'No Preview Available'; 
            } 
           ?> 

          <div class="cover boxcaption"><?php echo the_title(); ?></div> 
          </a> 
         </div> 

         <div id="more-info<?php echo $counter ?>" style="display:none;width:auto;"> 
          <div class="twelve columns"> 

           <div class="four columns portfolio-image"> 
          <?php 
            if (has_post_thumbnail()) { 
             the_post_thumbnail('medium'); 
            } else { 
             echo 'No Preview Available'; 
            } 
           ?> 
           </div> 

           <div class="eight columns portfolio-listing" style="max-width:720px !important;"> 

           <h3 class="portfolio-heading" ><?php the_title() ?></h3> 
           <p><?php the_content() ?></p> 

            <strong>Website: </strong> 
         <a href="<?php echo esc_html(get_post_meta(get_the_ID(), 'portfolio_website', true)); ?>" target="_blank"><?php echo esc_html(get_post_meta(get_the_ID(), 'portfolio_website', true)); ?></a></strong> 
           </div> 

          </div> 

        </div><!-- more info --> 

         <?php if ($counter % 4 == 0){echo '</div><div class="twelve columns" style="margin:15px 0;">';} ?> 

        <?php $counter++ ?> 

      <?php endwhile; ?> 

Любая помощь здесь будет весьма признателен :) Спасибо

Answer 1

Оказывается, проблема была в моей таблице стилей, у меня был г-индекс фантазии бокс-обертку из-за некоторых проблем с моим поле выбора но, удалив, что стрелки действительно появились.