Section-based page layout
In this guide, we’ll create a section-based template which provides the end user with multiple section types that they can mix and match to their desire to build a unique page layout.
Add the following to your theme’s functions.php
add_action( 'carbon_fields_register_fields', 'crb_attach_post_options' );
function crb_attach_post_options() {
Container::make( 'post_meta', __( 'Section Options', 'crb' ) )
->where( 'post_type', '=', 'page' )
->where( 'post_template', '=', 'template-section-based.php' )
->add_fields( array(
Field::make( 'complex', 'crb_sections', 'Sections' )
// Our first group will be a simple rich text field
->add_fields( 'text', 'Text', array(
Field::make( 'rich_text', 'text', 'Text' ),
) )
// Second group will be a list of files for users to download
->add_fields( 'file_list', 'File List', array(
Field::make( 'complex', 'files', 'Files' )
->add_fields( array(
Field::make( 'file', 'file', 'File' ),
) ),
) )
// Third group will be a list of manually selected posts
// used as a simple curated "Related posts" listing
->add_fields( 'related_posts', 'Related Posts', array(
Field::make( 'association', 'posts', 'Posts' )
->set_types( array(
array(
'type' => 'post',
'post_type' => 'post',
),
) ),
) ),
) );
}
Add the following to a new file and name it template-section-based.php
<?php
/*
Template Name: Section-based
*/
?>
<?php get_header(); ?>
<?php while ( have_posts() ) : the_post(); ?>
<?php
$sections = carbon_get_the_post_meta( 'crb_sections' );
foreach ( $sections as $section ) {
switch ( $section['_type'] ) {
case 'text':
?>
<div class="section-text">
<?php echo wpautop( $section['text'] ); ?>
</div>
<?php
break;
case 'file_list':
?>
<div class="section-file-list">
<h2>Resorces:</h2>
<ul>
<?php foreach ( $section['files'] as $file_item ) : ?>
<li>
<a href="<?php echo wp_get_attachment_url( $file_item['file'] ); ?>" target="_blank"><?php echo get_the_title( $file_item['file'] ); ?></a>
</li>
<?php endforeach; ?>
</ul>
</div>
<?php
break;
case 'related_posts':
?>
<div class="section-related-posts">
<h2>Related posts:</h2>
<ul>
<?php foreach ( $section['posts'] as $post_item ) : ?>
<li>
<a href="<?php echo get_the_permalink( $post_item['id'] ); ?>"><?php echo get_the_title( $post_item['id'] ); ?></a>
</li>
<?php endforeach; ?>
</ul>
</div>
<?php
break;
}
}
?>
<?php endwhile; ?>
<?php get_footer(); ?>
Note: This template is the simplest way to implement this functionality and can certainly be improved upon.
With these 2 snippets you now have a section-based page template that you can assign to any page.