I'm running into an issue with ACF, and I just can't figure out what's going on, and nothing on the internet is helping out.
I've added some fields to the Image Slider block:
But no matter what I try inside of our custom block code: image-slider.php
I cannot get the values of any of the auto_play
fields. get_field
always returns null. I know the value is there, because if I dump out get_fields( $postID )
, I can see the ['page_builder'][2]
element has the value I want. I could get to it that way, but I can't seem to determine which index I'm on (the 2) programmatically.
So if you know either, how I can access the field directly, or figure out my current 'page_builder' index, that would be extremely helpful.
It's super confusing, because the have_rows( 'slide_setting' )
call obviously knows where to look, and works as expected.
The custom block php looks like:
<?php
if(have_rows( 'slide_setting' ) ) {
$digits = 3;
$randID = rand(pow(10, $digits-1), pow(10, $digits)-1);
echo '<div class="container"><div class="row"><div id="swiper_'.$randID.'" class="col-md-12 wiche-swiper-top-navigation-wrapper">';
echo '<div class="swiper-container wiche-swiper-top-navigation">';
// var_dump( get_fields( get_the_ID() )['page_builder'][2] );
// var_dump( get_post_field( 'auto_play' ) );
// var_dump(get_field('image_slider_settings_auto_play'));
// var_dump(get_row_index());
// var_dump(get_field_objects( $post->ID ));
// var_dump( get_row_index() );
// var_dump( acf_get_field_group( 'slide_setting' ) );
// die();
if ( get_field( 'auto_play' ) ) {
echo '<div class="swiper-wrapper" data-swiper-autoplay="' . get_field( 'auto_play_delay' ) . '" data-swiper-disable-on-interaction="' . get_field( 'auto_play_disable_on_interaction' ) . '">';
} else {
echo '<div class="swiper-wrapper">';
}
while( have_rows( 'slide_setting' ) ) {
the_row();
$title = get_sub_field( 'title' );
$image = get_sub_field( 'image' );
$content = get_sub_field( 'content' );
if ( $image || $content ) {
echo '<div class="swiper-slide swiper-banner-slide swiper-no-swiping">';
if ( $title ) {
echo '<div class="text-center slider-top-title">';
echo $title;
echo '</div>';
}
if ( $image ) {
echo '<div class="banner-image">';
echo wp_get_attachment_image( $image, 'full', '', array( 'loading' => false ) );
echo '</div>';
}
if ( $content ) {
echo '<div class="banner-content">';
echo $content;
echo '</div>';
}
echo '</div>';
}
}
echo '</div>';
echo '</div>';
echo '<div class="swiper-button-next swiper-button-next-outsite">Next</div><div class="swiper-button-prev swiper-button-prev-outsite">Prev</div>';
echo '</div></div></div>';
}
So I wasn't able to get a perfect answer to my question, looks like the API to get what I want doesn't exist (dumb).
What I ended up with - I set up a new function in my theme's functions.php
file that looks like the following:
$post_slider_config_index = 0;
function get_the_slider_config( $post_id ) {
global $post_slider_config_index;
$page_builder = get_fields( $post_id )['page_builder'];
$slider_config = null;
foreach ($page_builder as $key => $value) {
if ( $value['acf_fc_layout'] === 'image_slider_settings' ) {
if ( $key > $post_slider_config_index ) {
$slider_config = $value;
$post_slider_config_index = $key;
break;
}
}
}
return $slider_config;
}
And then inside my image-slider.php
file I call it like so:
$slider_config = get_the_slider_config( get_the_ID() );
if ( $slider_config[ 'auto_play' ] ) {
echo '<div class="swiper-wrapper" data-swiper-autoplay="' . $slider_config[ 'auto_play_delay' ] . '" data-swiper-disable-on-interaction="' . $slider_config[ 'auto_play_disable_on_interaction' ] . '">';
} else {
echo '<div class="swiper-wrapper">';
}
The $post_slider_config_index
variable keeps track of the last index retrieved so that if there are multiple sliders on a page, it'll grab the right one as its rendered.
It's not perfect, it's not super efficient, but it does what I needed. Annoying WP doesn't just give you the information it obviously has already regarding where you are in the page.