如何添加区块?

浏览数量: 2     作者: 本站编辑     发布时间: 2021-11-22      来源: 本站

如何添加区块?(区块添加方式):

第1步:在页面上单击“+”号图标展开添加区块的层,如下截图所示:

tianjiaquk1


第2步:所有的区块都会列在这里,选择要添加的一个区块分类;


添加区块.jpg


第3步:此时页面上可以快速选择区块,页面右侧既可实时预览。选择的这个区块分类下所有的排版版式都会列出来,单击选中其中一个,然后单击点击右上角“应用按钮”,页面立即添加选中的区块。点击右上角“取消”,即取消当前操作。

区块.jpg

区块添加后效果如下,直接把以下信息替换为自己的信息就可以。

区块添加效果.jpg

新增多套页头区块 & Banner区块(2018-12-18更新)

【应用场景】为了让客户网站的首屏更美观,多终端的响应更完美,我们最近重点开发了多套页头区块和Banner区块,应用在网站页头或者页头下方首屏区域是再适合不过了。

【应用效果】应用效果如下截图所示:

1

新增功能:(2018-12-25更新)

1、新增多套页头区块和banner区块。

【应用场景】为了让客户网站的首屏更美观,多终端的响应更完美,我们最近重点开发了多套页头区块和Banner区块,应用在网站页头或者页头下方首屏区域是再适合不过了。

【应用效果】应用效果如下截图所示:

6


页头区块效果展示二:

7


功能优化:(2019-1-15更新)

1、优化证书展示区块,添加默认图片展示,解决了鼠标难以移出区块的问题,使区块交互更加合理;

【应用效果】当浏览该组件时,若鼠标置于区块内部,滚动鼠标滚轮则切换展示证书,若鼠标置于区块外部,滚动鼠标滚轮则继续向下浏览其他内容。应用效果如下截图所示:

新增区块


新增功能:(2019-1-25更新)

1、新增高级幻灯片组件文字层的打字机效果;

【应用场景】为了满足不同用户的个性化需求,丰富网站的展现效果,我们在高级幻灯片组件的文字层增加了一个“打字机效果”,使得文字可以在幻灯片上逐一展现。

【演示示例】首先添加高级幻灯片组件,添加图片后点击编辑按钮,然后点击添加文字层,在动画效果一栏选择打字机效果,就可以在幻灯片中应用打字机效果了。操作步骤如下:

1

【应用效果】打字机的应用效果如下:

dazijixiaoguo2


2、新增一个首屏区块;

【应用场景】为了给用户提供更多样化的选择,我们新增了一个首屏区块用于展示多层级的产品信息,以满足不同用户的需要。

【应用效果】区块左侧展示产品的一级分类,当鼠标划过一级分类时,右侧出现二级分类,当鼠标划过二级分类时,右侧出现三级分类。应用效果如下:

2

3.新增两个文章展示区块;

【应用场景】此次新增了两个文章展示区块,给用户更加丰富的选择空间,网站建设越来越称心如意。

【应用效果】区块的展示效果如下:

3


4

4.新增一个图文展示区块。

【应用场景】增添了一个图文展示区块,区块形式更加多样化。

【应用效果】区块的展示效果如下:

5


5.新增多个区块:(2019-3-28优化)

【应用场景】为了大家的网站可以有多样化的选择,我们本次又增加了3个区块。

【应用效果】本次新增了两个图文展示区块和一个页脚区块,各区块位置和应用效果如下:

1)图文展示区块一的位置及应用效果如下图所示:

图文展示区块


2)图文展示区块二的位置及应用效果如下图所示:

图文展示区块


3)页脚区块的位置及应用效果如下图所示:

页脚区块



6.新增自动轮播图文展示区块(2019-4-25优化)

【应用场景】自动轮播图文展示区块采用大图的方式展示产品,使产品细节展示更加到位,同时自动轮播的形式使网页富于活力,更能够吸引用户。

【应用效果】自动轮播图文展示区块的应用效果如图所示:

轮播展示2


7、新增图文展示区块;(2019-5-23优化)

【操作方法】点击添加区块按钮后选择“图文区块”,具体新上的两个区块见下图:

新增区块


【应用效果】新增区块的展示效果分别如下所示:

区块一:

变色区块


区块二:

区块2


 8、区块增加“编号”和“标签”的显示,并支持搜索;(2019-6-25优化)

【应用场景】为了方便客户快速识别区块和搜索区块,给每个区块增加一个“编号”和“标签”,并支持用户进行搜索。

【操作指导】点击新增区块,在左侧区块详情的搜索栏中输入区块“编号”或“标签”就可以搜索到相应的区块,如下图所示:


1122

9、新增查看已有区块ID功能;(2019-7-23优化)

【应用场景】为了解决在网站编辑页面中难以查看已添加区块ID的问题,我们将每个区块的ID展示出来,方便用户快速定位区块ID;
【操作指导】在网站编辑页面中点击某一区块,将光标移动到右侧出现的“ID”图标上即可展示区块ID,如下图所示:

查看区块ID


10、网站的区块增加切换版本的按钮;(2019-8-6优化)

【应用场景】为了减少新版本的区块上线时对用户网站页面的影响,我们在旧版本区块上增加了切换新版本的按钮,用户可以选择是否切换为最新的版本的区块;

【应用效果】如下图所示:qukuaibanbengenghuan1


11、新增图文展示区块(2019-11-07优化)

新增若干区块,以“图文展示”区块(ID:5649)为例演示。


【操作指导】进入“编辑网站”界面,点击添加区块,输入本区块ID5649,点击“应用”区块,如下图所示:

区块5649-1


点击区块图片中央的“编辑”按钮,可进行区块内容编辑,如下图所示:

9


在弹出的区块编辑界面中,可进行添加/删除图片集操作,也可针对每个图片进行更换图片、设置图片标题、编辑图片描述、添加图片链接等操作,如下图所示:99

【应用效果】如下图所示:

区块5649



12、新增图文展示区块(2019-11-28优化)


新增若干区块,以“图文展示”区块(ID:6009)为例演示。


【操作指导】进入“编辑网站”界面,点击添加区块,输入本区块ID6009,点击“应用”区块,如下图所示:

区块1


点击区块图片中央的“编辑”按钮,可进行区块图文编辑,如下图所示:z

在弹出的区块编辑界面中,可进行添加/删除图片集操作,也可针对每个图片进行替换图片、编辑图片、编辑图片描述、图片标题、添加图片链接等操作,如下图所示:

z1


【应用效果】如下图所示:

Untitled




13、新增图文展示区块(2020-1-2优化)


新增若干区块,本次以“产品展示”区块(ID:7869)和“首屏模块”区块(ID:7939)为例演示。


1)“产品展示”区块(ID:7869)

【操作指导】进入“编辑网站”界面,点击添加区块,输入本区块ID7869,点击“应用”区块,如下图所示:

区块7869-1


点击区块图片中央的“编辑”按钮,可进行区块产品分类选择,如下图所示:


z2

【应用效果】如下图所示:

区块演示


2)“首屏模块”区块(ID:7939)

【操作指导】进入“编辑网站”界面,点击添加区块,输入本区块ID7939,点击“应用”区块,如下图所示:

区块7939-1


点击区块图片中央的“编辑”按钮,可进行区块图文编辑,如下图所示:


z3

在弹出的区块编辑界面中,可进行添加/删除图片集操作,也可针对每个图片进行替换图片、编辑图片、编辑图片描述、图片标题、添加图片链接等操作,如下图所示:


z4

【应用效果】如下图所示:

区块演示1


14、新增功能:

1)全站移动端优化提速

【应用场景】网站访问速度是一个很重要的指标,不仅影响用户浏览体验,更重要的是会影响网站的搜索引擎排名,特别是外贸网站。

【速度优化】本次针对响应式网站,通过图片智能压缩异步js/css文件加载移动端智能计算首屏内容Google字体本地化网页静态化缓存混合CDN(境内使用阿里云CDN、境外使用AWS CDN)、全球五大洲自建CDN边缘节点200+(保证网站首次访问速度)等多种技术进行全站优化提速,大幅提升网站访问速度,提高Google测速评分,优化效果如下图所示:

-1


2、新增移动端组件&区块隐藏功能

【操作指导】移动端隐藏功能,可自定义隐藏移动端组件&区块,提高网页加载速度,打造精美移动端网站。进入“编辑网站”界面,点击“手机”图标进入移动端编辑,如下图所示:


-2

在移动端编辑页面,鼠标悬停在页面各组件上,显示“编辑”功能,如下图所示:-3

点击“编辑”按钮进行该组件编辑,可修改该组件在移动端的“显示/隐藏”状态(此处以隐藏“高级幻灯片”组件为例),如下图所示:

注:在移动端进行的编辑操作,仅会在移动端生效,并不会影响PC端的显示效果。-4

隐藏后的组件在移动端前台将不会显示(PC端正常显示),如下图所示:

-5


-6