# Halo 首个支持可视化编辑的主题，Publica 公共门户正式发布！

原文：<https://www.halo.run/archives/theme-publica>

在 Halo 原有的内容体系中，主题模版控制着全站样式与公共区域，文章和页面编辑器负责具体内容。

有时，管理员为改变页面结构，需不断增加配置选项；进行改动时，需保存修改再回到前台确认效果。

对于一个网站层级较多、页面内容变更相对频繁的大型门户主页，如何在贯彻页面风格的前提下，又好又快地配合业务需要更新站点成为一个难题。

全新的主题页面编排功能正是为应对该项挑战。

此次更新中，主题页面编排功能跟随 **Publica 公共门户**主题同步上线。它首次在 Halo 主题中引入可视化模块编排能力：内置丰富页面模块，支持自由组合，自定义构建页面，并为模块编辑提供实时预览。

该主题广泛适用于企业、高校、组织机构和各类门户主页，支持对首页与自定义页面进行直接编排。无惧网站更新，无需一行代码即可上线全新页面、模块或内容变更。

![Halo Publica 可视化编辑页面](https://www.halo.run/upload/posts/JirHuGFKSpMrLUmkhmNbTSbsNTPrcihR.jpeg)

## 首页模块编排

首页由模块组成。模块可以添加、移除和排序，选中模块后，下方会显示对应的设置表单。

目前提供 12 类首页模块：

-   首屏横幅
    
-   数据概览
    
-   新闻动态
    
-   服务入口
    
-   资源中心
    
-   介绍模块
    
-   重点内容
    
-   通知公告
    
-   专题聚焦
    
-   开放机会
    
-   合作伙伴
    
-   联系信息
    

新闻动态、资源中心等模块可以关联 Halo 文章分类；按钮和链接可以直接选择文章、单页或分类。

![Halo Publica 可视化编辑页面-编辑文字](https://www.halo.run/upload/posts/NvaXdHuKbsFyeFQyorIEhLwxEsgzVvSN.jpeg)

## 添加模块前可以查看实际效果

点击「添加模块」会打开模块选择窗口。每个模块使用主题的真实样式和默认内容渲染，可以先查看版式，再决定是否添加。

![Halo Publica 可视化编辑页面-选择模块](https://www.halo.run/upload/posts/FYWxmpuSIFSHAfvHJXUxadMOkAKOlXbh.png)

首页还提供三套预设：

-   完整门户
    
-   内容资讯
    
-   服务展示
    

预设窗口会显示整套页面包含的模块和完整预览。应用后仍可继续修改、排序或删除模块。

![Halo Publica 可视化编辑页面-选择预设布局](https://www.halo.run/upload/posts/twskktYZUqjORcNRCgZwAcLOeIONycRo.jpeg)

## 自定义页面可视化编辑

除了对首页进行编排，也支持用户创建自定义页面进行可视化编辑。

编辑器顶部可以切换首页和已有的可视化页面，也可以填写标题、Slug 并选择预设来新建页面。新页面先保存为草稿，首次保存后发布。

![Halo Publica 可视化编辑页面-页面切换](https://www.halo.run/upload/posts/mDdDOhsbkHSeSwBCHGUkyrCarRKAGaik.jpeg)

![Halo Publica 可视化编辑页面-新建可视化页面窗口](https://www.halo.run/upload/posts/DXiEymlQYcfeCAIWelWmywPLGqnIunAP.png)

单页提供 16 类模块组件：

-   图文介绍、标题与介绍
    
-   数据指标、内容卡片、图标卡片
    
-   时间线、步骤流程
    
-   团队成员、组织架构、合作伙伴
    
-   常见问题、资源下载
    
-   服务地点、招聘职位
    
-   联系信息、行动号召
    

内置预设包括关于介绍、产品服务、人才招聘、活动专题和联系我们。预设用于生成初始结构，之后可以逐项修改。

需要注意，普通自定义页面仍使用 Halo 原有编辑器，只有可视化页面会进入主题编排器。

![Halo 页面显示可视化页面标记](https://www.halo.run/upload/posts/dfkgzmzwGwLFWoMVCuozfJUQpsvOHrtK.png)

![Halo Publica 关于页面模板](https://www.halo.run/upload/posts/LLdwImgOQCnTVAeUrXXWtOFxTbsRWkuF.png)

## 使用实时主题预览

右侧预览直接加载当前主题页面，修改表单后，页面预览将同步更新。

预览支持：

-   桌面、平板和手机尺寸
    
-   缩放与自动适应
    
-   点击页面模块并定位到对应设置
    
-   访客模式下测试链接、滚动和页面交互
    

![Halo Publica 可视化编辑页面-切换分辨率](https://www.halo.run/upload/posts/TNYcHvamzIoGLuxGTJlJsbsBFYvnURPt.png)

## 页面内容与全局设置分开管理

主题设置继续承担全局样式管理功能，支持配置站点颜色、顶部公告、联系方式和页脚等内容。

具体页面（包含首页和自定义页面）的内容与结构则在可视化编辑器中统一管理。

![Halo Publica 主题设置](https://www.halo.run/upload/posts/QohqXtLGLlpqxwikExhcFQKlMeJYHDaz.png)

## 立即体验

主题地址：[https://www.halo.run/store/apps/app-ifci1oro](https://www.halo.run/store/apps/app-ifci1oro)

演示站：[https://demo.halocms.site/?preview-theme=theme-publica](https://demo.halocms.site/?preview-theme=theme-publica)