Wordpress WP:acf图像字段&;简单lightbox插件集成

Wordpress WP:acf图像字段&;简单lightbox插件集成,wordpress,advanced-custom-fields,imagefield,Wordpress,Advanced Custom Fields,Imagefield,我正在尝试将简单的Lightbox插件集成到高级自定义字段图像字段中 基本上,我希望页面上的任何图像(通过acf图像字段填充)在单击时在lightbox中打开,并且与lightbox中的所有其他图像一起分组,以便它们可以像幻灯片一样导航。这是Simple Lightbox插件的内置功能,但我不知道如何将其与图像字段的模板代码集成 对于acf所见即所得字段,我使用此 <?php $content = get_field('wysiwyg'); if ( function_ex

我正在尝试将简单的Lightbox插件集成到高级自定义字段图像字段中

基本上,我希望页面上的任何图像(通过acf图像字段填充)在单击时在lightbox中打开,并且与lightbox中的所有其他图像一起分组,以便它们可以像幻灯片一样导航。这是Simple Lightbox插件的内置功能,但我不知道如何将其与图像字段的模板代码集成

对于acf所见即所得字段,我使用此

<?php
    $content = get_field('wysiwyg');
    if ( function_exists('slb_activate') )
    $content = slb_activate($content);
    echo $content;
?>

…效果很好,但我无法将其应用于图像领域

以下是我的图像字段模板代码(没有任何尝试集成简单Lightbox):



使用php输出缓冲将模板存储在变量中。将ob_start()放在顶部,然后在底部ob_get_clean()将停止输出缓冲,您可以将返回值保存到变量。然后将其传递给slb_激活

<?php
    ob_start();

    $image = get_field( 'img' );
    if( ! empty( $image ) ) {
    $url    = $image['url'];
    $alt    = $image['alt'];
    $caption = $image['caption'];
    $size   = 'large';
    $thumb    = $image['sizes'][ $size ];
    $width  = $image['sizes'][ $size . '-width' ];
?>
<?php if( $caption ): ?>
    <div class="wp-caption" style="width: <?php echo $width; ?>px">
<?php endif; ?>
<a href="<?php echo $url; ?>">
    <img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" />
</a>
<?php if( $caption ): ?>
        <p class="wp-caption-text"><?php echo $caption; ?></p>
    </div>
<?php endif; ?>
<?php } ?>
<?php $content = ob_get_clean(); ?>
<?php echo slb_activate($content); ?>


非常感谢,但不幸的是,使用此代码时html输出没有变化。输出看起来与使用上面的原始代码时完全相同。还有其他想法吗?在最后一行中出错了。以前我们是在重复未更改的$content。现在应该可以了。
<?php
    ob_start();

    $image = get_field( 'img' );
    if( ! empty( $image ) ) {
    $url    = $image['url'];
    $alt    = $image['alt'];
    $caption = $image['caption'];
    $size   = 'large';
    $thumb    = $image['sizes'][ $size ];
    $width  = $image['sizes'][ $size . '-width' ];
?>
<?php if( $caption ): ?>
    <div class="wp-caption" style="width: <?php echo $width; ?>px">
<?php endif; ?>
<a href="<?php echo $url; ?>">
    <img src="<?php echo $thumb; ?>" alt="<?php echo $alt; ?>" />
</a>
<?php if( $caption ): ?>
        <p class="wp-caption-text"><?php echo $caption; ?></p>
    </div>
<?php endif; ?>
<?php } ?>
<?php $content = ob_get_clean(); ?>
<?php echo slb_activate($content); ?>