How do I create different editable sections within

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,

<div id="maintext">
   <-- Text -->
</div>
<div id="products">
   <-- Text and Images -->
</div>
<div id="about_company">
   <-- Text boxes -->
</div>

How do I make sure the content added via the wordpress editor falls under the respective divs ? For the "maintext" div I'll load the content from the page itself but how do I add content to the other 2 divs dynamically ?

I searched on a couple of forums and many suggested to add content using widgets, is there any way it can be done without using widgets ?

Any help will be gladly appreciated.

Answer 1

Was struggling with this, and did not want to use a plugin. The only Wordpress native option I found was to use Custom Fields. This works, but only for text, and is rather cumbersome.

The other non-plugin option is to simply use HTML in the Wordpress editor, but this is of course far from ideal either.

Finally I gave up, and opted for the Advanced Custom Fields plugin as well.

Answer 2

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:

<div id="maintext">
   <!-- Text -->
   <?php if(get_field('main_text')){ //if the field is not empty
        echo '<p>' . get_field('main_text') . '</p>'; //display it
    } ?>
</div>
<div id="products">
   <!-- Text and Images -->
   <?php if(get_field('products_info')){ //if the field is not empty
        echo '<p>' . get_field('products_info') . '</p>'; //display it
    } ?>
</div>
<div id="about_company">
   <!-- Text boxes -->
   <?php if(get_field('about_company')){ //if the field is not empty
        echo '<p>' . get_field('about_company') . '</p>'; //display it
    } ?>
</div>

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.

Answer 3

I've run into this issue several times now, and while the question is 3 years old, I think it's still rather current. I've succesfully used the Multiple Content Blocks plugin sometimes now:

https://ltz.wordpress.org/plugins/multiple-content-blocks/

After installing the plugin, you can just include the_block in your template:

<div id="maintext">
   <?php the_content(); ?>
</div>
<div id="products">
   <?php the_block('products') ?>
</div>
<div id="about_company">
   <?php the_block('company') ?>
</div>

Answer 4

<div id="maintext">
   <?php the_content(); ?>
</div>
<div id="products">
   <?php // echo wp function to get product data; ?>
</div>
<div id="about_company">
   <?php // echo wp function to get about companydata; ?>
</div>

Answer 5

hi im currently developing a theme with that set up. there are two ways to achieve this:

widgetized and fixed admin panel (customizer options)

i am using the two in my themes if widgets create a .php file that includes the widgets sections create a widget for that section

if fixed in admin panel you have to include the .php section in your functions.php

edit * advantage of widgetized is you can arrange them just like in a regular sidebar

Answer 6

You've got three options I believe:

1. Create a widget area where you can then display the content in a text widget: http://codex.wordpress.org/Function_Reference/register_sidebar
2. Create a template where you then get the content of a different page: http://codex.wordpress.org/Page_Templates#File_Folders
3. Create a new meta box for all your pages: http://codex.wordpress.org/Function_Reference/add_meta_box

I believe that the thing you are looking for is option 2. The others are more full-site oriented, if you want the extra content to show up on every single page.