每一次网站优化,都是在为你的客户体验和转化铺路。

添加通栏模块并添加内容(全)

新手入门 浏览 26632 次 2026-01-28 15:15


添加通栏模块并添加内容

通栏是一个横贯左右两边的栏目,很多时候,通栏都会用于突显一些视觉效果并形成与页面背景或者站点背景形成鲜明的对比,以求达到网站吸引眼球的效果。常用的位置:网页顶部、中上部位、底部

 

1. 进入编辑页面点击左侧的添加按钮,然后会看到通栏模块:

1574750579925136.png

2.用鼠标把这个模块拖动到页面上然后会看到灰色部分就是通栏了,新添加的通栏是没有内容的,您可以直接在里面新增模块,或者将原有的模块拖入这个通栏中成为通栏中的元素并且可以一起拖动:



1578453991486409.png

3.上图的通栏是还没有添加任何模块的,用户可以自行将一些文字,或者图片模块添加到通栏(限内容区),如下图:通栏里面可以添加文本、图片模块或者其它模块,图示中已经添加一个模块。


如图,当拖动一个模块到通栏中,只要见到通栏的内容区有橙色虚线,意味着这个模块已经在通栏区域中,放手后,就可以直接拖动通栏来将整个通栏和内部的元素移动。

1569720665777941.png

4.通栏的大小可以通过拖动边框调整大小,点击属性功能 按钮可以更换通栏背景,背景和其它的任何模块的背景一样,可以是颜色的填充,也可以是一张水平或者垂直重复的图片。调整的方式也和文本模块、图片模块等的背景是完全一样的。

1569720646805089.png

 
5.使用背景视频,
   
 点击属性后勾选使用背景视频,然后录入视频地址即可

1574751223283306.png

自动播放:不勾选,视频将出现控件,需手动控制播放

循环播放:不勾选,视频只播放一次即自动停止

透明度:可以调整视频的透明度,并且可设置遮罩颜色

背景:设置通栏的背景,原本的设置项

在Chrome 66 版本及之后版本,谷歌已经将带声音的视频自动播放默认禁止。 如果勾选打开声音Chrome下将无法自动播放视频

FAQ

Q.背景视频透明度设置无效。

A .必须用背景视频后,透明度设置才有效,如果没有视频变通的方式是图片链接然后设置 透明度


6、固定显示 

一、在编辑界面点击添加-》选中通栏模块拖拽到需要的位置



二、选中模块,点击属性 设置固定显示 (勾选)

1578453971135194.png

三、选中模块拖拽到通栏中直到出现 橙色边框 然后保存即可



四、如果预览没有能固定的处理

把模块移出通栏,然后再移回通栏直至出现橙色边框 然后保存即可。

五、如果需要固定在底部需要把模块放在底板中,勾选时会显示底部。




六、如果需要悬停后更换通栏背景 ,在通栏中点击属性  设置 鼠标经过的颜色及透明度。


1629945550136860.png
不设置 透明度效果如下


1629946048142604.png


1629945963281652.png


如果设置了透明度效果如下

1629946029599418.png

1629946007133697.png

 





相关文章

添加页面和页面管理

1.什么是页面:我们用不同的页面对需要展示的内容进行分类以求达到整洁完整的展示效果。下面的导航图中“首页”是一个页面,“关于我们”等等都各是一个页面。 2.页面的类型:底版:一般网页中,多个页面均共享同一个公司logo,banner图,语言栏目,页面/站点背景等等元素,在这个情况下,就可以把这些元素放在底版页中,然后在建立普通页面的时候,选择“应用底版”。每个网站可以有多个底版,也可能只是用同一个...

页面中添加图片模块并编辑

如何新增图片模块、如何更换原有的图片、如何线上调整图片的尺寸、如何为图片添加链接、如何为图片模块添加边框背景等等提示:,每张图的大小不超过1MB(一般网页图片,小图40KB、大图100KB已经非常清晰);上传前,请根据个人需要先调节好图片的尺寸比例(如正方形图1:1,长方形图3:2或者4:3或其它比例)以节省时间。请不要删除正在使用的任何一张图片,否则可能会造成页面模块无法显示等现象。1. 添加图...

底版的原理和使用

视频指导讲解教程图片指导讲解教程 视频指导讲解:建站系统--如何使用模板修改完成网站建设制作在底版上的内容,页面套用后请勿解锁否则底版修改后页面不会同步 底版的原理和使用 -----知道如何使用底版,会减少您50%的网站制作时间!什么是底版?简单的说就是将网站中每页都重复出现的内容做在一张页面上并保存下来,以后在添加新页面时,将这个页面做为新页面的背景,这些重复的内容就不用再重新去做了,我们只需要...

导航栏的添加和管理

通过编辑页面左侧的“添加模块”按钮, 将导航栏模块拖到编辑页面上。拖放成功后, 导航栏出现在页面上,您可以随时自行调节导航条的位置。导航条添加成功后,如果不喜欢默认的样式或者颜色,您可以对这些进行调整。导航条的工具条上有多个功能,我们会重点说一下第3个至6个功能:a.导航类型:本地导航/自定义导航本地导航/超大屏自定义导航--我们事先已经设置好的导航的样式,具体的挑选可以在“样式”功能处选择。自定...

页面管理-设置栏目链接

页面管理设置栏目链接 添加页面这里支持设定 链接至:1默认链接 2站外链接 3文件 4电子邮件 5文章列表 6文章详情 7产品列表 8产品详情(1) 依次点击 页面管理-》创建新页面 录入页面名称、地址等后点击 “设置链接” (2)选择栏目的链接类型。下图以产品列表为例,先选择链接类型,然后选择产品列表页,再选择需要的产品分类 点击确定即可点击选择后 可以选择具体的分类。1 默认链接:相当于链接到...