0

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.

-2

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';
 }
 ?>
  • Hey there, thanks for the suggestion! Do you mean to echo the whole section or to echo a function that hides the section should the custom field be empty? – festgebaeck Jun 22 at 10:03
  • Just saw your edit! Thanks! I tried it and sadly, it does not work as I intended. It hides the whole section, but also if the fields are filled out, as well as empty. I don't know why someone gave you -1 on this. But I appreciate the suggestions! – festgebaeck Jun 22 at 10:22
  • Hey @Phosl, thanks again for the edit and suggestions, but so far it is not working. It helps in getting individual fields to not display when they are not filled with data! But what I wanted: To hide the whole <section> when one or more custom fields of the "werdegang" group is not filled in. Thanks again for your work! But I have yet to figure it out. – festgebaeck Jun 22 at 16:57
  • I just did some changes. Let me know if its works as you mean! – Phosl Jun 23 at 12:18
  • Thanks again, but still no luck. Now, instead of the ACF data, only the data you put into the php section above gets displayed ("jahr1_Title" instead of the real title for example). – festgebaeck Jun 24 at 8:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.