How to use a shortcode with ACF?

• elbsurfer

• November 3, 2014 at 7:46 am

I installed the ACF Plugin for WordPress and I use OWL Carousel for WP to add sliders in my Installation. I want to enable the user to use the shortcode OWL carousel provides within ACF.

In my template file I do:

<div class="slider">
    <?php 
    $slider = get_field('stadium_slider');
    echo do_shortcode( $slider );
    ?>
</div>
<div class="stadium-text-footer">
<?php the_field('stadium_footer_text'); ?>

<?php the_field('stadium_link'); ?>
</div>

The problem I know face is, that the shortcode is taken into consideration and the output is good – however the next div stadium-text-footer is empty. When i remove the do_shortcode from the template, the footer text and the link are being displayed. It seems that all custom fields are empty / not retrievable when I place the do_shortcode before the retrievals in my template (var_dump results in empty/false). If i place the do_shortcode at the end of my template it’s fine.

Does anybody know what’s wrong here?

Thanks!

• LingoSam

• November 3, 2014 at 9:54 pm

The problem lies with the Custom Field / Shortcode combo you’ve crafted. The other fields are working fine and are not part of the issue.

Let’s assume stadium_slider is a ‘Gallery Field’, look at the Gallery Field Docs here.

The bottom example pretty much shows exactly what you’re attempting.

<?php 
$image_ids = get_field('gallery', false, false);
$shortcode = '[gallery ids="' . implode(',', $image_ids) . '"]';
echo do_shortcode( $shortcode );
?>

Use this example code, replace get_field('gallery', false, false); with get_field('stadium_slider', false, false);.
This should dump a basic WordPress gallery with the images that have been selected in the back end.

Now we need Owl Carousel to take over. According to the owl-carousel plugin, there should be a setting to override the default galleries with it instead, take a look in it’s settings for something that sounds like this.

Find this setting and you are away.

A good help would be to turn on debug mode if you haven’t already in wp-config. If the code is already there, set it to true like so.

define( 'WP_DEBUG', true );

Hope this helps!

• zubairkhan

• June 23, 2020 at 5:04 pm

Hay, I am thinking to install ACF plugin in my woocommerce store, But I mostly use woocommerce shortcodes for customization, So, Does ACF plugin compatible with woocommerce shortcodes?

• Sweriss

• June 25, 2020 at 8:10 pm

If the code is already there, set it to true like so.