Snippets

Rik Kendell Accordion list using ACF

You are viewing an old version of this snippet. View the current version.
Revised by Rik Kendell 49ee8e7
page.php
Raw 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
    <?php if ( have_rows( 'question_list' ) ) : ?>
    
		<dl class="accordion-list">
        
			<?php while ( have_rows( 'question_list' ) ) : the_row(); ?>

				<dt><a href="javascript:void(0);"><?php echo get_sub_field('question'); ?></a></dt>
				<dd>
					<?php echo get_sub_field('answer'); ?>
				</dd>

			<?php endwhile; ?>
            
		</dl>
        
	<?php endif; ?>
scripts.js
Raw 
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
$(document).ready(function(){

// FAQs Accordion
	accordionList = function() {
		var allPanels = $('.accordion-list > dd').hide();

		$('.accordion-list > dt > a').click( function() {
			allPanels.slideUp();
			$(this).parent().next().slideDown();

			return false;
		})
	}
    
	accordionList();
    
});
HTTPS SSH

You can clone a snippet to your computer for local editing. Learn more.