FlexSlider with WordPress Gallery

问题描述 投票:0回答:3

您如何让FlexSlider与WordPress画廊一起使用?

我正在创建一个自定义主题,理想情况下,我希望该主题中的每个画廊都可以自动转换为FlexSlider图像旋转器,而无需使用其他插件。

wordpress flexslider
3个回答
1
投票

[看t31os对类似问题的答案:How to customise the output of the WP image gallery shortcode from a plugin?

[您要做的是用返回的$output覆盖核心gallery_shortcode函数(wp-includes / media.php的702行),将其代码或类似代码放在主题中的functions.php中。


0
投票

我知道您说过您不想使用其他插件,但是我建议您尝试使用带有扩展库的高级自定义字段插件。

具有创建自己的标记的自定义图库非常容易。 Check it out here

它确实解决了我集成壁画灯箱的问题,就像我想要的那样。只是一些示例获取代码,向您展示如何使用自定义字段:

<div id="slider" class="flexslider">
    <ul class="slides">
        <?php foreach( $images as $image ): ?>
            <li>
                <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
                <p class="flex-caption"><?php echo $image['caption']; ?></p>
            </li>
        <?php endforeach; ?>
    </ul>

0
投票

我知道这已经有6年的历史了,但是最近我需要在WP 5.0+安装中执行此操作,并且由于块编辑器又名,事实证明它比预期的要难。古腾堡。

[我通过使用parse_blocksrender_block手动重新渲染the_content,可能对性能造成了重大影响(纠正我,如果我错了,请解决。)>

这在您主题的functions.php中出现:

<?php

function filter_gallery_blocks($content) {
    global $post;

    if ( has_blocks( $post->post_content ) ) {
        $blocks = parse_blocks( $post->post_content );
        $new_content = '';

        foreach ( $blocks as $key => $block ) {
            if ( $block['blockName'] === 'core/gallery' ) {
                $rendered_block = render_block($block);

                // do whatever replacement you like with the block HTML

                // in case of Flexslider I needed the following 3 lines
                $rendered_block = str_replace('<figure>', '', $rendered_block);
                $rendered_block = str_replace('</figure>', '', $rendered_block);
                $rendered_block = str_replace('wp-block-gallery', 'wp-block-gallery slides', $rendered_block);

                $new_content .= '<div class="gallery">'.$rendered_block.'</div>';
                continue;
            }

            // else just pass through
            $rendered_block = render_block($block);
            $new_content .= $rendered_block;
        }

        return $new_content;
    }
}
add_filter('the_content', 'filter_gallery_blocks', -5);

?>
© www.soinside.com 2019 - 2024. All rights reserved.