I am currently trying to get a div or section of my template to hide or not display when a custom field on the backend is not filled in. The problem is, what works for single custom fields that are not nested, does not work for nested/grouped custom fields with one or two child groups inside the parent group.

Below is the code with custom field display. The display itself works fine. I just want to hide the whole <section> when one of the sub fields of the ACF group is not filled in. The group consists of a parent group, 3 child groups and each child group has a few fields.

<?php
      $werdegang = get_field('werdegang'); // werdegang parent group
      $station1 = $werdegang['station_1']; // ' child group 1
      $station2 = $werdegang['station_2']; // 'child group 2
      $station3 = $werdegang['station_3']; // 'child group 3

   ?>

  <section class="werdegang">

    <span class="werdegang-headline">Headline</span>
    <?php the_sub_field('jahr_station_1'); ?>
    <hr class="willkommen-divider"></hr>

    <div class="werdegang-container">
      <div class="timeline">
        <div class="timeline-nav">
          <div class="timeline-nav__item"><?php echo $station1['jahr_station_1'];?></div>
          <div class="timeline-nav__item"><?php echo $station2['jahr_station_2'];?></div>
          <div class="timeline-nav__item"><?php echo $station3['jahr_station_3'];?></div>
        </div>
        <div class="timeline-wrapper">
          <div class="timeline-slider">
            <div class="timeline-slide" data-year="<?php echo $station1['jahr_station_1'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station1['titel_station_1'];?></h4>
                <p class="timeline-text"><?php echo $station1['beschreibung_station_1'];?></p>
              </div>
            </div>
            <div class="timeline-slide" data-year="<?php echo $station2['jahr_station_2'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station2['titel_station_2'];?></h4>
                <p class="timeline-text"><?php echo $station2['beschreibung_station_2'];?></p>
              </div>
            </div>
            <div class="timeline-slide"  data-year="<?php echo $station3['jahr_station_3'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station3['titel_station_3'];?></h4>
                <p class="timeline-text"><?php echo $station3['beschreibung_station_3'];?></p>
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>


      <?php if( get_field('file') ): ?>
      <span class="lebenslauf-button profil-button"><a class="lebenslauf-link" href="<?php the_field('file'); ?>"> <span>Vollständigen Lebenslauf ansehen</span></a></span>
    <?php endif; ?>


  </section>

What I tried so far:

<?php
if ($station1['jahr_station_1'])) {
?>
  SECTION CONTENT

<?php
}
  ?>

And:

<?php
 $conditionalw = get_sub_field('jahr_station_1');
?>
<?php if ( $conditionalw ) : ?>
SECTION CONTENT
<?php endif; ?>

And:

 <?php
if( $werdegang ):
 ?>
SECTION CONTENT
<?php endif; ?>

But I can't seem to get the right combination to just hide the section. When trying the above code snippets I hide the section regardeless of the custom field filled out or not. With a group that only has one row of sub fields it at least displays but still no luck with hiding the whole div or section when it isn't filled out.

Maybe someone has pointers that can help me in figuring out how to hide a div or section when a nested group is not filled out in ACF.

I am currently trying to get a div or section of my template to hide or not display when a custom field on the backend is not filled in. The problem is, what works for single custom fields that are not nested, does not work for nested/grouped custom fields with one or two child groups inside the parent group.

Below is the code with custom field display. The display itself works fine. I just want to hide the whole <section> when one of the sub fields of the ACF group is not filled in. The group consists of a parent group, 3 child groups and each child group has a few fields.

<?php
      $werdegang = get_field('werdegang'); // werdegang parent group
      $station1 = $werdegang['station_1']; // ' child group 1
      $station2 = $werdegang['station_2']; // 'child group 2
      $station3 = $werdegang['station_3']; // 'child group 3

   ?>

  <section class="werdegang">

    <span class="werdegang-headline">Headline</span>
    <?php the_sub_field('jahr_station_1'); ?>
    <hr class="willkommen-divider"></hr>

    <div class="werdegang-container">
      <div class="timeline">
        <div class="timeline-nav">
          <div class="timeline-nav__item"><?php echo $station1['jahr_station_1'];?></div>
          <div class="timeline-nav__item"><?php echo $station2['jahr_station_2'];?></div>
          <div class="timeline-nav__item"><?php echo $station3['jahr_station_3'];?></div>
        </div>
        <div class="timeline-wrapper">
          <div class="timeline-slider">
            <div class="timeline-slide" data-year="<?php echo $station1['jahr_station_1'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station1['titel_station_1'];?></h4>
                <p class="timeline-text"><?php echo $station1['beschreibung_station_1'];?></p>
              </div>
            </div>
            <div class="timeline-slide" data-year="<?php echo $station2['jahr_station_2'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station2['titel_station_2'];?></h4>
                <p class="timeline-text"><?php echo $station2['beschreibung_station_2'];?></p>
              </div>
            </div>
            <div class="timeline-slide"  data-year="<?php echo $station3['jahr_station_3'];?>">
              <div class="timeline-slide__content">
                <h4 class="timeline-title"><?php echo $station3['titel_station_3'];?></h4>
                <p class="timeline-text"><?php echo $station3['beschreibung_station_3'];?></p>
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>


      <?php if( get_field('file') ): ?>
      <span class="lebenslauf-button profil-button"><a class="lebenslauf-link" href="<?php the_field('file'); ?>"> <span>Vollständigen Lebenslauf ansehen</span></a></span>
    <?php endif; ?>


  </section>

What I tried so far:

<?php
if ($station1['jahr_station_1'])) {
?>
  SECTION CONTENT

<?php
}
  ?>

And:

<?php
 $conditionalw = get_sub_field('jahr_station_1');
?>
<?php if ( $conditionalw ) : ?>
SECTION CONTENT
<?php endif; ?>

And:

 <?php
if( $werdegang ):
 ?>
SECTION CONTENT
<?php endif; ?>

But I can't seem to get the right combination to just hide the section. When trying the above code snippets I hide the section regardeless of the custom field filled out or not. With a group that only has one row of sub fields it at least displays but still no luck with hiding the whole div or section when it isn't filled out.

Maybe someone has pointers that can help me in figuring out how to hide a div or section when a nested group is not filled out in ACF.

• plugins
• php
• custom-field
• advanced-custom-fields

1 Answer 1

Hope this help how to figure out your request

<?php 
$werdegang = 'werdegang'; // werdegang parent group
$station1 = 'jahr_station_1'; // ' child group 1
$station2 = 'jahr_station_2'; // 'child group 2
$station3 = 'jahr_station_3'; // 'child group 3
$station1Jahr = 'jahr1';
$station2Jahr = 'jahr2';
$station3Jahr = 'jahr3';
$station1Title = 'jahr1_Title';
$station1Text = 'jahr1_Text';
$station2Title = 'jahr2_Title';
$station2Text = 'jahr2_Text';
$station3Title = 'jahr3_Title';
$station3Text = 'jahr3_Text';   
?>
<?php if(   
        (!empty($station1Title) && !empty($station1Text)) 
        && (!empty($station2Title) && !empty($station2Text)) 
        && (!empty($station3Title) && !empty($station3Text)) 
        && (!empty($station1) && !empty($station2) && !empty($station3))  
        && (!empty($station1Jahr) && !empty($station2Jahr) && !empty($station3Jahr))  
    ) { ?>
<section class="werdegang"> 
<span class="werdegang-headline">Headline</span>
<?php echo $station1; ?>
<hr class="willkommen-divider"></hr>
<div class="werdegang-container">
<div class="timeline">
    <div class="timeline-nav">
      <div class="timeline-nav__item"><?php echo $station1Jahr;?></div>
      <div class="timeline-nav__item"><?php echo $station2Jahr;?></div>
      <div class="timeline-nav__item"><?php echo $station3Jahr;?></div>
    </div>
        <div class="timeline-wrapper">
          <div class="timeline-slider">
            <?php if(  !empty($station1Title) && !empty($station1Text) ) { ?>
                <div class="timeline-slide" data-year="<?php echo $station1Jahr;?>">
                  <div class="timeline-slide__content">
                    <h4 class="timeline-title"><?php echo $station1Title;?></h4>
                    <p class="timeline-text"><?php echo $station1Text;?></p>
                  </div>
                </div>
            <?php }?>
            <?php if(  !empty($station2Title) && !empty($station2Text) ) { ?>
                <div class="timeline-slide" data-year="<?php echo $station2Jahr;?>">
                  <div class="timeline-slide__content">
                    <h4 class="timeline-title"><?php echo $station2Title;?></h4>
                    <p class="timeline-text"><?php echo $station2Text;?></p>
                  </div>
                </div>
            <?php }?>
            <?php if(  !empty($station3Title) && !empty($station3Text) ) { ?>
                <div class="timeline-slide" data-year="<?php echo $station3Jahr;?>">
                  <div class="timeline-slide__content">
                    <h4 class="timeline-title"><?php echo $station3Title;?></h4>
                    <p class="timeline-text"><?php echo $station3Text;?></p>
                  </div>
                </div>
               <?php }?>

              </div>
              </div>
              </div>
              </div>
              </section>


              <?php } else {
   echo 'some field are not filled';
 }
 ?>