Adding Content Areas to Custom Page Template

Question

I am not sure how to ask this, which is why I have been having trouble finding anything via google searches. I am hoping someone here will understand what I am looking for and be able to direct me to information about how to implement it.

I am working on a custom theme. What I want to do is have on my template page, several areas that the client can add text. Each area would be in a different div. On the admin edit page, when the template page is selected, there would be a field for the client to add content for each div.

<div id="div1">
   Content brought in by admin
</div>
<div id="div2">
   Content brought in by admin
</div>
<div id="div3">
   Content brought in by admin
</div>

I would like to do this via the admin edit page, rather than widgitize the content.

In the template is:

<?php the_content(); ?>

Is there way to create more than one which, combined with some magic in the functions.php would create the field to edit on the admin edit page?

In advance I thank you for your time in assisting me with this. Please let me know if you need more information. I am just looking for direction, I did try to figure this out on my own but my searches do not bring anything relevant up so I think I am not using the correct language.

Answer 1

Thank you all for your help and direction. I decided to go a different route, using a post category for the home page sections. It is not exactly what I wanted to do but seemed the most expedient way to achieve the end result I was looking for. It is easy for the client to update, although not as easy as if I had been successful in achieving my initial goal of updating the template page editor to add three sections. I am still going to work on that and your information will get me started so thank you.

In the meantime, I am calling to each post category in the template page. I am using the code below, I am sure there is a way to fine tune the code so that it is not as bulky. (please feel free to educate me if you have some suggestions)

Either way it seems to work well.

<!--Header Home Part One-->
<div class="home1">
<?php
$my_query = new WP_Query( 'cat=9' );
$args = array( 'posts_per_page' => 1 );
if ( $my_query->have_posts() ) { 
while ( $my_query->have_posts() ) { 
    $my_query->the_post();
}
}
?>
<h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
<?php the_content(); ?>
<?php wp_reset_postdata(); ?>
<!--/home1--></div>
<!--Header Home Part two-->
<div class="home2">
<?php
$my_query = new WP_Query( 'cat=10' );
$args = array( 'posts_per_page' => 1 );
if ( $my_query->have_posts() ) { 
while ( $my_query->have_posts() ) { 
    $my_query->the_post();
}
}
?>
<h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
<?php the_content(); ?>
<?php wp_reset_postdata(); ?>
<!--/home2--></div>
<!--Header Home Part Three-->
<div class="home3">
<?php
$my_query = new WP_Query( 'cat=11' );
$args = array( 'posts_per_page' => 1 );
if ( $my_query->have_posts() ) { 
while ( $my_query->have_posts() ) { 
    $my_query->the_post();
}
}
?>
<h1><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
<?php the_content(); ?>
<?php wp_reset_postdata(); ?>
<!--/home3--></div>

Thank you again and please, do not hesitate to educate me if you think the above code could be better written. I am learning as I go and appreciate any and all help!

Answer 2

I ended up using Advanced Custom Fields plugin. Using your example, you want to create 3 sections on a home page. First install the ACF plugin. Then create your custom fields and add them to your home page template. In the set up area you give each field a specific title. Then in your home page template you would write something like this:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
    <div class="container">

        <div class="home1">
            <p><?php the_content(); ?></p>
        </div>

        <div class="home2">
            <?php the_field( 'home2-custom-field' ); ?>
            <p><?php the_content(); ?></p>
        </div>

        <div class="home3">
            <?php the_field( 'home3-custom-field' ); ?>
            <p><?php the_content(); ?></p>
        </div>

    </div>
<?php endwhile; endif; ?>

.home1 would be the default WordPress content editor area, and .home2 and .home3 are your two new ACFs. the_field() goes and gets the specific custom content and then just use the_content() as usual to display it. I'm new enough to WordPress theme development, so am not 100% that this is the best way, but it worked perfectly for me. :)

Answer 3

I would second Howdy_McGee suggestion. Before you start thinking about creating custom templates you need to understand the loop. Look for simple solutions to the problem before digging into themeing.