Genesis Flexible ACF Pages

page_flexible.php

<?php
/**
 * Genesis Framework.
 *
 * WARNING: This file is part of the core Genesis Framework. DO NOT edit this file under any circumstances.
 * Please do all modifications in the form of a child theme.
 *
 * @package Genesis\Templates
 * @author  StudioPress
 * @license GPL-2.0+
 * @link    http://my.studiopress.com/themes/genesis/
 */
 
/*
Template Name: Flexible Page
*/

// Function displaying Flexible Content Field
function su_display_terminal_fc() {
	// loop through the rows of data
	while ( have_rows('terminal_page_flexible_content') ) : the_row();
		// "Hero" Layout
		if( get_row_layout() == 'image_-_text' ) { // "Image - Text" Layout
			$left_image = get_sub_field( 'left_image' ); 
			$background_image = get_field( 'background_image' ); ?>
			<section style="background-image: url('<?php echo $background_image ?> ');" class="row image-text <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="left-half"><img src="<?php echo $left_image['url'] ?>" alt="<?php echo $left_image['alt'] ?>" /></div>
				<div class="right-half"><?php if( get_sub_field( 'headline_image_text' ) ) { ?>
					<h4><?php the_sub_field( 'headline_image_text' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( 'right_text' ); ?></div>
			</div>
			</section>
			
		<?php } elseif( get_row_layout() == 'text_-_image' ) { // "Text - Image" Layout
			$right_image = get_sub_field( 'right_image' );
			$background_image = get_field( 'background_image' ); ?>
			<section style="background-image: url('<?php echo $background_image ?> ');"  class="row text-image <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="left-half">
				<?php if( get_sub_field( 'headline_text_image' ) ) { ?>
					<h4><?php the_sub_field( 'headline_text_image' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( 'left_text' ); ?></div>
				<div class="right-half"><img src="<?php echo $right_image['url'] ?>" alt="<?php echo $right_image['alt'] ?>" /></div>
			</div>
			</section>

		<?php } elseif( get_row_layout() == 'one-column-flex' ) { // "Text - Image" Layout
			$one_column_flex = get_sub_field( 'one-column-flex' );  
			$background_image = get_field( 'background_image' ); ?>

			<section style="background-image: url('<?php echo $background_image ?> ');" class="row one-column-flex <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="full-width">
				<?php if( get_sub_field( 'headline_1_col_1' ) ) { ?>
					<h4><?php the_sub_field( 'headline_1_col_1' ); ?></h4>
				<?php } ?>	
				<?php the_sub_field( '1_col_column_1' ); ?></div>
				<?php
				if( get_sub_field( 'display_cta_button' ) ) { ?>
							<a href="<?php the_sub_field( 'hero_cta_button_url' ) ?>" class="button red"><?php echo the_sub_field( 'hero_cta_button_text' );?></a>
						<?php } ?>
			</div>
			</section>

		<?php } 
			
		elseif( get_row_layout() == 'two-column-flex' ) { // "Text - Image" Layout
			$two_column_flex = get_sub_field( 'two-column-flex' );
			$background_image = get_sub_field( 'background_image' ); ?>
			<section class="row two-column-flex <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="one-half first">
				<?php if( get_sub_field( '2_col_column_1_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_1_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_1' ); ?></div>
				<div class="one-half">
				<?php if( get_sub_field( '2_col_column_2_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_2_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_2' ); ?></div>
			</div>
			</section>
		
		<?php }
			
		elseif( get_row_layout() == 'two-column-two-thirds-left-flex' ) { // "Text - Image" Layout
			$two_column_flex = get_sub_field( 'two-column-two-thirds-left-flex' );
			$background_image = get_sub_field( 'background_image' ); ?>
			<section class="row two-column-flex <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="two-thirds first">
				<?php if( get_sub_field( '2_col_column_1_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_1_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_1' ); ?></div>
				<div class="one-third">
				<?php if( get_sub_field( '2_col_column_2_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_2_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_2' ); ?></div>
			</div>
			</section>
		
		<?php }

		elseif( get_row_layout() == 'two-column-two-thirds-right-flex' ) { // "Text - Image" Layout
			$two_column_flex = get_sub_field( 'two-column-two-thirds-right-flex' );
			$background_image = get_sub_field( 'background_image' ); ?>
			<section class="row two-column-flex <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="one-third first">
				<?php if( get_sub_field( '2_col_column_1_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_1_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_1' ); ?></div>
				<div class="two-thirds">
				<?php if( get_sub_field( '2_col_column_2_headline' ) ) { ?>
					<h4><?php the_sub_field( '2_col_column_2_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '2_col_column_2' ); ?></div>
			</div>
			</section>
		
		<?php }

			
		elseif( get_row_layout() == 'three-column-flex' ) { // "Text - Image" Layout
			$three_column_flex = get_sub_field( 'three-column-flex' );
			$background_image = get_sub_field( 'background_image' ); ?>
			<section class="row three-column-flex <?php the_sub_field( 'css_class' ); ?>">
			<div class="wrap">
				<div class="one-third first">
				<?php if( get_sub_field( '3_col_column_1_headline' ) ) { ?>
					<h4><?php the_sub_field( '3_col_column_1_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '3_col_column_1' ); ?></div>
				<div class="one-third">
				<?php if( get_sub_field( '3_col_column_2_headline' ) ) { ?>
					<h4><?php the_sub_field( '3_col_column_2_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '3_col_column_2' ); ?></div>
				<div class="one-third">
				<?php if( get_sub_field( '3_col_column_3_headline' ) ) { ?>
					<h4><?php the_sub_field( '3_col_column_3_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '3_col_column_3' ); ?></div>
			</div>
			</section>
		
		<?php }
			
		elseif( get_row_layout() == 'four-column-flex' ) { // "Text - Image" Layout
		$four_column_flex = get_sub_field( 'four-column-flex' ); 
		$background_image = get_sub_field( 'background_image' ); ?>
		<section class="row four-column-flex <?php the_sub_field( 'css_class' ); ?>">
		<div class="wrap">
			<div class="one-fourth first">
				<?php if( get_sub_field( '4_col_column_1_headline' ) ) { ?>
					<h4><?php the_sub_field( '4_col_column_1_headline' ); ?></h4>
				<?php } ?>
				<?php the_sub_field( '4_col_column_1' ); ?></div>
			<div class="one-fourth">
			<?php if( get_sub_field( '4_col_column_2_headline' ) ) { ?>
				<h4><?php the_sub_field( '4_col_column_2_headline' ); ?></h4>
			<?php } ?>
			<?php the_sub_field( '4_col_column_2' ); ?></div>
			<div class="one-fourth">
			<?php if( get_sub_field( '4_col_column_3_headline' ) ) { ?>
				<h4><?php the_sub_field( '4_col_column_3_headline' ); ?></h4>
			<?php } ?>
			<?php the_sub_field( '4_col_column_3' ); ?></div>
			<div class="one-fourth">
			<?php if( get_sub_field( '4_col_column_4_headline' ) ) { ?>
				<h4><?php the_sub_field( '4_col_column_4_headline' ); ?></h4>
			<?php } ?>
			<?php the_sub_field( '4_col_column_4' ); ?></div>
		</div>
		</section>
		
		<?php }
	
	endwhile;
}
add_action( 'get_header', 'su_fc_terminal_check' );
function su_fc_terminal_check() {
	// If "Flexible Content" field has rows of data
	if( have_rows( 'terminal_page_flexible_content' ) ) {
		add_action( 'wp_enqueue_scripts', 'su_flexbox_support_check' );
		// Show Flexible Content field in the content area
		add_action( 'genesis_entry_content', 'su_display_terminal_fc', 12 );
	
		// Add custom body class
		add_filter( 'body_class', 'su_terminal_body_class' );
	}
}
function su_flexbox_support_check() {
	wp_enqueue_script( 'modernizr', get_stylesheet_directory_uri() . '/js/modernizr-custom.js' );
}
function su_terminal_body_class( $classes ) {
	$classes[] = 'flexible-content terminal';
	return $classes;
}

// This file handles pages, but only exists for the sake of child theme forward compatibility.
genesis();