如何使用Bebuilder页面编辑器制作文章分类页模板

不管是B2C类型还是B2B类型的外贸企业站都需要有博客文章来丰富网站内容，本篇文章将学习如何使用Bebuilder页面编辑器制作外贸独立站的文章分类页。

前置要求

为了保证设计过程中的效果，需要增加 3 个文章分类和 10 篇文章，内容随意，文章可分布在任意文章分类中。如果你还不会这些操作的话，请学习 WordPress 教程内容中的《WordPress基础之操作界面初识》和《WordPress基础之内容管理》这 2 篇文章。

Bebuilder设计文章分类页框架

这部分内容其实不需要太多内容，只增加分类页 Tittle 和 Blog archive 元素即可，当然，如果你想要页面更加丰富的话，可以参考竞争对手的网站文章分类页是如何设计的。

以下为详细的设计步骤：

1. 打开 WordPress 后台 -> 点击左侧 Templates 。

2. 点击上方 Add New 添加新模板。

3. 选择模板类型为 Blog。

4. 输入模板名称，英文！这里的名称会转变为URL，编辑模版时可以把标题改回中文。

5. 新建 Section ，添加 1 个 Wrap ，里面再次添加 Title 和 Blog 元素。

以上内容都可以根据自己的设计喜好来改变。

自定义 Blog 元素的内容和样式

这里主要讲 Shop products 元素的样式设置，以下为调整示例：

• Posts number：设置显示文章数量

• Style：设置列表显示方式，我个人推荐使用 grid 样式

• Columns：设置文章列数，有时需要在上方的 Style 范围内才能有更好的显示效果。

• Title tag：文章标题H-tag标签，建议设置为：页面标题H-tag - 1，假如页面标题为 H2 ，那请将这里的标签设置为 H3，可保证搜索引擎更好的理解本页面。

• Post image：设置文章封面图。

• Category：设置文章显示区间，可自定义显示的目录。

• Multiple categories：可设置多个显示目录，需要输入URL中包含的完整关键词。

• Order by：设置排列方式，以日期、标题或者随机为准。

• Order：设置显示顺序，降序或升序。

• Sticky posts：固定显示文章

• Exclude posts：排除显示文章，需要输入文章URL中的关键词

• Use as related posts：作为相关文章显示。

• Filters：设置显示过滤器。

• Excerpt：设置显示文章摘要。

• Read more：设置显示显示更多按钮。

• Pagination：设置列表翻页按钮。

• Load more：设置加载更多按钮。

• Grayscale：这个功能基本不用。

• Margin：设置外边距，保持默认。

Style 中是对 Settings 中各项的详细设置，包括颜色、边框、图片、过滤器等等内容，具体操作可以看这篇文章：《Bebuilder各模块元素的样式设置与Advanced选项设置教程》

所有设置完成后保存更新即可。