如何在 WordPress 页面中创建不同的可编辑部分？

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

提问by Vinith Almeida

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

我一直在 WordPress 上构建我的第一个主题，但在将内容添加到不同部分时遇到了问题。

My HTML is somewhat like this,

我的 HTML 有点像这样，

<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 ?

如何确保通过 WordPress 编辑器添加的内容属于相应的 div ？对于“maintext”div，我将从页面本身加载内容，但如何将内容动态添加到其他 2 个 div？

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.

任何帮助将不胜感激。

回答by metaColin

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

不幸的是，单独使用 WordPress 在单个页面中添加多个可编辑字段并不是特别容易。

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

我认识的许多 WP 开发人员（包括我自己）都依赖高级自定义字段插件来获取其他内容字段。

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.

1) 安装 ACF 插头。
2) 在 ACF 的设置区域中创建一些新字段。
3) 分配要为特定页面或一组页面显示的新字段。
4) 更新给定页面的页面模板，以便显示新字段。

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.

例如，您可以创建一组标准的所见即所得字段，然后将它们分配到“概览”页面。让我们称这些字段为：main_text、products_info 和 about_company。创建字段并将其分配给页面后，当您编辑该页面时，其他字段将可供编辑。

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.

这里有很多很好的例子。如果您真的很有雄心，您甚至可以将 ACF直接包含在您的主题中，而不是安装插件。

回答by user2019515

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

1. 创建一个小部件区域，您可以在其中显示文本小部件中的内容：http: //codex.wordpress.org/Function_Reference/register_sidebar
2. 创建一个模板，然后在其中获取不同页面的内容：http: //codex.wordpress.org/Page_Templates#File_Folders
3. 为所有页面创建一个新的元框：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.

我相信您正在寻找的是选项 2。如果您希望额外的内容显示在每个页面上，则其他选项更面向全站点。

回答by Page Carbajal

If you are writing the theme, maybe you would like to consider using a WordPress Framework so you don't have to start from scratch.

如果您正在编写主题，也许您想考虑使用 WordPress 框架，这样您就不必从头开始。

If that is not the case, think of the end user. How will they add sections to pages and posts? Will they have to move across places within the WordPress UI, or would they rather user short codes?

如果情况并非如此，请考虑最终用户。他们将如何向页面和帖子添加部分？他们是否必须在 WordPress UI 中的各个地方移动，还是宁愿使用短代码？

My recommendation is to build a plugin that render the section within the document content. Or widget content if that is the case.

我的建议是构建一个插件来呈现文档内容中的部分。如果是这种情况，或者小部件内容。

I wrote a little piece of code to illustrate how you can accomplish such a thing, and also because I kind of need it right now :D. You can find it on github here https://github.com/lionpage/Front-Office-Document-Sections

我写了一小段代码来说明如何完成这样的事情，也因为我现在有点需要它：D。你可以在 github 上找到它https://github.com/lionpage/Front-Office-Document-Sections

Hope this helps

希望这可以帮助

回答by Manish

<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>

回答by Grimace of Despair

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:

我现在已经多次遇到这个问题，虽然这个问题已经有 3 年的历史了，但我认为它仍然是最新的。我现在有时成功地使用了多内容块插件：

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

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

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

安装插件后，您可以the_block在模板中包含：

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

回答by kregus

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.

正在为此苦苦挣扎，不想使用插件。我发现的唯一 WordPress 本机选项是使用Custom Fields。这有效，但仅适用于文本，并且相当麻烦。

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

另一个非插件选项是在 WordPress 编辑器中简单地使用 HTML，但这当然也远非理想。

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

最后我放弃了，并选择了 Advanced Custom Fields 插件。

回答by delbrosit

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

如果小部件创建一个 .php 文件，其中包含小部件部分，我将在我的主题中使用这两个文件，为该部分创建一个小部件

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

如果在管理面板中修复，则必须在 functions.php 中包含 .php 部分

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

编辑 * widgetized 的优点是您可以像在常规侧边栏中一样排列它们