How do I create different editable sections within a WordPress page?

Question

I have been building my first theme on WordPress and have run into problem while adding content into different sections.

My HTML is somewhat like this,

&         


        

Answer 1

Unfortunately adding multiple editable fields in a single page is not particularly easy using WordPress by itself.

Many WP devs I know (myself included) rely on the Advanced Custom Fields Plugin for additional content fields.

The steps to make this happen:

1) Install the ACF the plug.
2) In the settings area for ACF create some new fields.
3) Assign the new fields to appear for a specific page or set of pages.
4) Update your page-template for the given page(s) so that the new fields are displayed.

For instance you might create a set of standard wysiwyg fields and then assign them to the 'overview' page. Let's call these fields: main_text, products_info and about_company. Once the fields have been created and assigned to a page, when you edit that page the additional fields will be available to edit.

For these new fields to be seen by visitors, they must be added to the page-template you use for your overview page. The code could be something like this:

   
   ' . get_field('main_text') . '
'; //display it
    } ?>


   
   ' . get_field('products_info') . '
'; //display it
    } ?>


   
   ' . get_field('about_company') . '
'; //display it
    } ?>

There are lots of good examples here. If you are feeling really ambitious, rather than install the plugin you could even include ACF directly in your theme.