JooLun Plus 百科 ⬇ 源码下载

09.22 商城装修页面与操作流程

102353 于 2026-10-17 14:14:33 +08:00 修改了此页面

# 商城装修页面详解以及装修操作流程

装修页面详解

  • 进入装修模块，选择需要装修的端口（端口分为小程序端、公众号H5、普通H5、APP端、PC端），进入装修页面

  • 图1所示处为切换应用端口（端口分为小程序端、公众号H5、普通H5、APP端、PC端）

  • 图2所示处为装修页面（页面包括商城分类页、个人中心页、商品详情页以及自定义页面）与装修组件切换Tab

  • 图3所示处装修画布展示窗口

  • 图4所示处为装修模版库（可直接选择模版库模版应用）、预览（装修时页面实时预览）和保存（下拉可将此页面复制至其他页面及初始化操作）

  • 图5所示处为装修组件编辑区域，编辑设置组件内容和样式

装修流程详解（以普通H5商城为例）

  • 1、首先需新增一个装修页面（无装修页面时为默认商城页面，可以新建多个商城页面，打开开启按钮，则前端展示该页面）

  • 2、新增页面后，展示为空白页面，可开始进行页面装修，可以直接从模版库中挑选合适模版，一键应用，也可自行从“0”开始装修

  • 3、左侧选择装修组件，点击组件即可添加至页面中

  • 4、展示在页面中选中组件，可在右侧编辑区域进行内容、样式编辑和显示层级调整

  • 5、编辑完成后保存，前端刷新页面即可看到最新装修的页面了

  • 7、模版库中选择合适装的修模版并应用

装修组件样式详解

页面导航配置（即页面顶部导航栏配置），可编辑内容为：

  • 1、导航栏标题，可设置标题是否显示以及标题文字颜色

  • 2、导航栏背景颜色，可设置页面滑动前与滑动后的背景颜色，可将页面内容固定到顶部（页面内容减去导航栏高度）

  • 3、可以设置两张图片（页面滑动前和页面滑动后），可以是商城logo或者其他商城活动图片

  • 4、可以给整个页面设置一张背景图片

商城主题颜色配置，可编辑内容为：

  • 1、主题颜色设置：主要应用于页面图标颜色、按钮背景色、标签颜色以及金额颜色等

  • 2、主题文字颜色设置：主要应用于按钮文字颜色，标签中文字颜色等

  • 3、背景颜色设置：主要应用于导航栏背景颜色、模块背景色等

  • 4、背景文字颜色设置：主要应用于导航栏标题文字颜色、模块文字颜色等

  • 5、状态栏颜色设置：主要应用于导航栏时间状态栏颜色等

商城装修模板数据复制