Flatsome是wordpress中的一种商城主题,后台使用UXbulider编辑器进行搭建。支持在线模板导入及元素导入。

2.3UX Builder可视化编辑器 – 内容元素设置

内容元素设置 – Banner

Banner – 图文元素

能够设置高度,背景图/视频,颜色覆盖,背景链接。

效果如下:

内容元素设置 – Text Box

Text Box – banner中自带的文本编辑框。

可以设置文本框的相对宽度及整体字体大小。
通过位置设置定位文本框在banner中的位置。

效果如下:

内容元素设置 – Icon Box

Icon Box – row内的内容元素。

可以添加ICON及文本内容。
ICON格式可以是PNG或SVG,SVG可在flatsome中更换颜色,但无法在媒体库预览缩略图。
可以随意更改ICON宽度、位置;文本字体的大小等。

效果如下:

内容元素设置 – Gap

Gap – section内的内容元素。

可以随意设置Gap的高度,但无法单独设置Gap的颜色,但可以套用在section中。

效果如下:

内容元素设置 – Image

Image – 图像元素。

插入图像,可以随意设置图像的宽度、高度、overlay,也可以给图片附上跳转链接。

效果如下:

内容元素设置 – Tabs

Tabs – 标签元素。

可以更改标签数量、标签title、样式、文字大小、对齐方式等。

效果如下:

内容元素设置 – Text

Text – 文本元素。

可以更改文本内容、字体大小、颜色、添加链接等等。

效果如下:

内容元素设置 – Button

Button – 按钮元素。

可以更改按钮文本、文本大小写、按钮颜色、样式、链接等等。

效果如下:

2.4UX Builder可视化编辑器 – 调用元素设置

调用元素设置 – Blog Posts

首先在后台添加好文章(包括标题、正文内容、特色图片、摘要、分类)

在想要调用的页面插入Blog Posts

插入后显示为默认样式。

更改样式

在样式中选择你想要的样式类型。

更改布局

在布局-type中选择想要的布局类型。

更改栏目数

在布局-columns中选择你想要的栏目数,即一行显示多少个blog。

更改显示的blogs

在文章中可以选择你想要显示的具体文章,或按文章分类显示,以及显示的文章数量。

更改特色图片的样式

在图像中,可以更改特色图片的尺寸、宽度、overlay等等。

更改文本样式

在文本中,可以更改文本的尺寸、对齐方式、背景颜色等等。

根据自己的需要更改参数可以得到想要的Blog样式:

调用元素设置 – 作品集

首先在后台添加好Portfolio(包括标题、正文内容、特色图片、摘要、分类)。

在想要调用的页面插入作品集

插入后显示的是默认样式。

更改样式及显示的Portfolio

在Options中选择你想要的样式类型。
如果category不选择,默认显示全部,也可以选择或按Portfolio分类显示。
还可以更改Portfolio的排序方式,以及显示的数量。

更改Portfolio的布局

在布局-type中选择想要的布局类型。
在布局-columns中选择你想要的栏目数,即一行显示多少个blog。

更改特色图片的样式

在图像中,可以更改特色图片的高度、宽度、overlay等等。

更改文本样式

在文本中,可以更改文本的尺寸、对齐方式、背景颜色等等。

根据自己的需要更改参数可以得到想要的Portfolio样式:

专业网站开发网页设计公司

深度阅读:

如何编辑flatsome主题的footer模块——添加Blocks 今天给大家介绍一种编辑footer模块最为便捷的方法——通过添加“Blocks模块”,进而再通过UX Build可视化工具进行编辑,操作简单的同时也方便调整元素位置。 1.首先,新建Blocks在空白框处可填写Blocks名称,而后点击UX Builder进...
WordPress的Flatsome 主题使用教程:1 主题选项设置 Flatsome是wordpress中的一种商城主题,后台使用UXbulider编辑器进行搭建。支持在线模板导入及元素导入。主题选项中的设置修改为整个网站的全局设置。许多页面中的元素模块例如按钮等,都是继承了主题选项中的button设置。 1.1主题选项设置 — Header修改 ...
WordPress的Flatsome 主题使用教程:2 UX Builder可视化编辑器 Flatsome是wordpress中的一种商城主题,后台使用UXbulider编辑器进行搭建。支持在线模板导入及元素导入。  2.1UX Builder可视化编辑器 - 导入模块 点击ux builder进行可视化编辑 点击Flatsome ...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.