网站管理-执行操作-编辑网站,进入网站的可视化编辑界面。
中间部分是可视化的编辑区域,指向头部,可以打开一个新页面编辑头部,中间是页面的主体部分,指向底部就可以单独编辑底部。
左侧是一个功能菜单:
树视图:一种架构的方式,看到页面的结构和元素,实现精准的选择和编辑。
点击具体的元素,会出来元素的编辑功能菜单。可以编辑文字、设置链接、设置大小、对齐方式,还有设置样式。
具体的组件不一样,可以编辑的样式也不同。
常规是他的一个功能区,样式就是样式区,高级,就会设置一些,改元素名字、ID,小的动画效果(比如这个文字让他跳一下出来)、自定义CSS,启用重复,调动态数据,实现一个循环。
设置样式:
每个元素都有一个包装器,就是它最外边的区域,内部会有内容、图标、按钮、文字、标题等可以分别设置样式。
每一个可设置的样式基本一致:
背景:可以设置颜色、渐变、背景图背景视频
字体排版:设置字体、粗细,大小,颜色,行高
尺寸和间距:设置内外间距、宽度高度
边框和阴影:设置边框的粗细,颜色,样式,还可以设置圆角,或者说设置整体的一个阴影
显示:设置层级,比方说我想让他悬浮,或者是像阿拉伯的话从右到左,设置直接隐藏(可见性,设置成无,不加载也不显示;可见性设置隐藏,会加载但是不显示),溢出隐藏,定位(可以设置元素固定在顶部,或者右侧,可以用定位实现,用相对定位,绝对定位,固定定位,然后距离顶多少底多少)
过渡效果:设置元素变大变小,持续时间等,是比较复杂的那种动效
库,分为本地库和在线库。
本地库:页面上的元素,可以右击保存到本地库,或者页面保存到本地库,方便在本站内重复使用。
在线库:丝路赞建站中提供给用户的一些页面、板块,可以直接用于当前编辑的网站。
所有页面:模板里边包含的页面,每一个模板都会包括首页,产品列表页面(product list对应导航上的products),产品详情页面,新闻列表页面,新闻详情页面,产品分类页面(product cat,对应每个产品类别的页面)。
另外模版中还预设了关于我们和联系我们页面,点页面列表进入后台页面列表,就可以看到这两个页面,指向标题,点edit with 丝路赞建站,我们在新页面打开,这样的话就可以编辑我们的关于我们和联系我们页面,它的编辑方式是一样的,这里边的这个内容都弄好了的,直接修改就可以。
添加自定义页面:
在页面管理这里点新建,输入个名字,发布一下,然后再点击使用丝路赞建站这样的话就可以直接进入到我们的可视化的界面去直接创建这个自定义页面了。创建好后可以通过 网站设计-菜单,把这个页面添加入导航。
历史:就是我们的操作的历史记录,就你每一步操作它都有历史记录啊,如果操作错误,想回撤,可以直接点这或者直接点Ctrl z退回。允许用户误操作了,还能撤回。
帮助中心:里边有很多操作流程步骤,在使用的过程中,如果说不会操作的话,可以直接进到我们的帮助中心去看。
适配:系统支持编辑四端适配,一般情况下我们编辑PC及平板,这样页面会自动向下兼容,达到四端都适配的效果。
我们默认看到的是桌面端的一个效果,我们可以直接把它切换到笔记本,那它就会是笔记本上看到的样子,然后我们可以直接就跟编辑PC端似的进行编辑。
注意:我们在设置的时候,对于宽度,尽量不要去设置具体的多少像素,我们用百分比的这种方式,它的兼容性会更高。
模版上适配都是设置好的,如果调整了网站结构,适配需要重新调整下。
页面编辑好后,适配和需要查看确认下。文章预览时可以这样看适配:
浏览器中打开页面,按 F12,然后点左上角手机小图标,看到就是手机端的样子,可以直接拖动,查看各个尺寸的适配。