如何在jQuery Cycle2图像滑块中显示文本并应用链接

Question

我正在为WordPress开发jQuery cycle2图像滑块。 我在数据库中添加图像及其相对名称，描述和图像上的链接。

因此，我添加了jQuery cycle2代码，并通过foreach循环获取了所有图像。

<div class="cycle-slideshow"
     data-cycle-fx="fade"
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
>
   <?php
      global $wpdb;

      $result = $wpdb->get_results("SELECT * FROM wp_images");

      foreach ($result as $row) {
   ?>
         <img src="<?php echo $row->img_path ?>">
   <?php
      }     
   ?>

</div>

它的工作完美。 现在，我想显示数据库中的标题，因此我搜索了该代码，它也可以工作。

<div class="cycle-slideshow"
     data-cycle-caption=".img-title"
     data-cycle-fx="fade"
     data-cycle-caption-template="{{cycleTitle}}"
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
>
    <?php
      global $wpdb;

      $result = $wpdb->get_results("SELECT * FROM wp_images");

      foreach ($result as $row) {
   ?>
         <img src="<?php echo $row->img_path ?>" data-cycle-title="<?php echo $row->img_title; ?>">
   <?php
      }
          echo "<h2 class='img-title'></h2>";
   ?>
</div>

仅当数据库中有针对图像的标题时，才显示标题。

现在，当我添加<a> ，标题未显示。

<div class="cycle-slideshow"
     data-cycle-caption=".img-title"
     data-cycle-fx="fade"
     data-cycle-caption-template="{{cycleTitle}}"
     data-cycle-timeout="0"
     data-cycle-speed="5"
     data-cycle-prev="#prev"
     data-cycle-next="#next"
     data-cycle-slides="> a"
>
    <?php
        global $wpdb;

        $result = $wpdb->get_results("SELECT * FROM wp_images");

        foreach ($result as $row) {

                if(!empty($row->img_link)) {
    ?>
                    <a href="<?php echo $row->img_link ?>" target="_blank">
            <?php
                }
            ?>
                        <img src="<?php echo $row->img_path ?>" data-cycle-title="<?php echo $row->img_title; ?>">
            <?php
                if(!empty($row->img_link)) {
            ?>
                    </a>
            <?php
                }     
        }

        echo "<h2 class='img-title'></h2>";
    ?>
</div>

我也想显示说明，但没有任何提示。 为什么输入锚点时标题没有显示。 但是还存在另一个问题，如果其中一个滑块没有链接，则其图像显示在滑块之外，也不会滑动。

所以请指导我。 希望你理解我的问题。