Wordpress - Show sections of content

Question

I have a problem with my custom Wordpress theme and need a solution. The goal is to create an about us page which has multiple sections. Let's say the page has to have 4 sections.

1. Short info about the company
2. Short info about the company history
3. Info about how the company works with clients
4. Section about the team.

I want this info to come from the Wordpress "page" itself.

The dream scenario for the "client" would be that in the "pages" -> editor, there would be 4 different sections with content that can be dynamically changed at any point. How do i do that? There has to be content between the different sections. Different HTML containers to each section so they can be seperately styled with CSS. But at this point all i see is the_content(), which can show the content on the "page" itself.

But obviously the code can't be like this. But you get the idea i hope =D

<div class="section1">
<?php the_content();?>
</div>
<div class="between-sections"></div>
<div class="section2">
<?php the_content();?>
</div>

So how do i show different sections of the content on the page itself on specific places. So the only thing an admin has to do is go to "pages" -> the page -> edit the different sections.

I know a solution would be to make the pages empty and instead show the content with customize settings and sections. I could add a Section in Wordpress with the name "About us" and there have the different content / images that can be changed at any point. The problem might be that it's not located in the pages where people might expect all the content to be.

Another solution is different meta boxes where you would show the different meta boxes under the editor and have them named after their places on the page. Then show the different meta boxes on the page. But i feel like meta boxes is more for shorter stuff like email / phone number / or smaller one sentenced data.

Another solution might be custom fields but again i feel like it should be smaller stuff instead of large amount of text. But this is the solution i am leaning towards.

So is there any way of doing this in the custom theme without page builders? Or maybe a whole other solution. I am not 'new' to Wordpress but this has been on my mind for a while now and i can't seem to find a solution that makes sense.

The only sensible solution in my head would be to create custom fields to the pages with first_section, second_section etc. and then post the content there.

Answer 1

Follow the following steps: 1. create the Template and inside the template create the four different section http://prntscr.com/pzi0io

2. Use ACF to create four Content Editor for the different section https://www.advancedcustomfields.com/

Answer 2

By default wordpress supports only one content edit block for pages, articles etc. I'd say the easiest solution is to add the other edit blocks as custom fields. And the easiest tool for this is Advanced Custom Fields plugin which has long list of different content type fields (including WYSIWYG like default edit block) and you can define where to add them, ie. in this case for the default page template.

To make it dynamic I would use the ACF Repeater field with predefined classes-dropdown and a WYSIWYG. So the end user can add as many content blocks as they want with different predefined styles. You just need to loop through the repeater field in the template and add the selected style class & content to the page.

End user view on the edit page:

• Default edit block
• Repeater field >> Add row -- Select class (like "black", "white", "blue") & type content

The idea on the page template:

foreach($repeater as $row) {
    echo '<div class="content-block content-'.$row->class.'">'.$row->content.'</div>';
}

And the result code would be like (with two rows created):

<div class="content-block content-black">
    Test text, images, links, stuff
</div>
<div class="content-block content-blue">
    Test text2, images2, links2, stuff2
</div>

It's also possible to create the custom fields with code by yourself on the theme but with ACF it's so much easier so I'd recommend using it.