iPortal 首页的头部（header）、内容（body）、底部（footer）均支持可视化定制。其中头部和底部作用于门户全站。
- 头部（header）：支持修改门户 Logo、站点名称、导航栏模式、控制在线帮助的显示与隐藏，这些内容的修改均在定制功能的常规内容面板进行。其中导航栏模式除默认模式外，支持天地图风格的导航栏。导航栏各项内容的增减、移动等修改在导航栏的编辑面板进行。
- 内容（body）：页面内容的主体区。首页内容区支持添加横幅、快捷链接、资源卡片、地图、内联框架等 13 种组件。这些组件支持以拖拽或单击的方式添加到编辑区，且组件采用了行布局。添加到编辑区的组件支持编辑组件属性和所在行的设置。详见本节布局和组件的介绍。
- 底部（footer）：支持切换 footer 样式、显示或隐藏语言切换功能、修改版权信息等；不同样式的 footer，可编辑的内容也将有所不同，详见本节 footer 介绍 。若将导航栏模式设置为天地图风格，footer 也将采用天地图风格模式。
以管理员身份登录 iPortal 后，进入“首页”>“管理”>“站点配置”>“站点定制”，点击“首页定制”链接，或直接访问 http://<server>:<port>/iportal/web-ui/home/edit，即可进入首页编辑界面。此时，首页内容均以编辑状态展示，您可所见即所得地移动、编辑、删除组件。点击左侧的齿轮图标，展开的侧边栏面板支持首页国际化定制、开启预览、常规内容设置、及从布局构建器添加组件到右侧编辑区、恢复默认设置和保存。完成首页定制并确认保存后，您可以点击页面左上角的门户 Logo，退出首页定制模式。注意您在进行首页定制时，首页国际化定制默认选中的是中文，即默认是定制中文环境下的首页内容。下面详细介绍各项设置。
常规内容
在首页编辑界面，点击左上角的齿轮，在展开的侧边栏中点击“常规内容”设置如下各项内容。设置完成后点击下方的“确定”按钮，界面右侧编辑面板即会更新修改项。也可点击侧边栏右上角的全局保存按钮进行保存。
门户Logo
iPortal 提供了默认 Logo，你可以通过“上传Logo”进行更改，图片要求 gif、png 或 jpg 格式，图片大小建议为 43px*43px。如果您更换 Logo 后，还想换回 iPortal 的默认Logo，点击“使用默认 Logo”按钮即可。
站点名称
定制门户的站点名称，如：地理信息共享平台，显示在“门户Logo”右侧。也可为空。
标签页图标
iPortal 提供了默认标签页图标，你可以通过点击默认图标进行更改，图片要求png 或 jpg 格式，图片大小建议为 32px*32px。
标签页名称
定制门户的标签页名称，如：用户管理，显示在“标签页图标”右侧。如果您更换标签页名称后，还想换回 iPortal 的默认标签页名称，设置标签页名称为空即可。
导航栏模式
提供了默认和天地图两种模式。切换为天地图模式，点击“确定”生效后，门户站点的 header 和 footer 均切换为天地图风格，此时在右侧界面编辑区可对 footer 组件可视化地编辑。
语言切换
开启或关闭语言切换，以控制站点头部右侧是否显示语言切换组件。
帮助文档
勾选或取消勾选“帮助文档”复选框，以控制站点头部右侧是否显示帮助文档链接。支持更改帮助文档路径
导航栏
在常规内容中，您可更改导航栏的模式。在界面编辑区支持编辑导航栏的内容。鼠标移动至导航栏组件，点击“编辑组件”按钮，打开导航栏编辑对话框，支持如下操作：
- 显示与隐藏：可以控制导航栏中一级和二级栏目的显示与隐藏
- 拖动：可以进行同级和跨级间的拖动，调整先后顺序。
- 添加：可以添加一级栏目，也可以为一级栏目添加二级栏目，添加时，需输入栏目名称和栏目的链接地址（链接地址需以 http、https 开头）
- 启用内嵌网页模式：新添加的一级、二级栏目可以选择是否启用内嵌网页模式，默认是不启用状态。启用内嵌网页模式后，您新添加的网页页面会与 iPortal 共用内置导航栏。例如：您新添加一个”一张图“一级栏目，启用内嵌网页模式后保存，在导航栏中点击”一张图“栏目，显示的”一张图“页面会默认使用 iPortal 的导航栏
- 删除：支持删除新添加的一级、二级栏目，系统默认提供的栏目不支持删除
- 修改：新添加的一级、二级栏目支持修改栏目名称和链接地址，系统默认的一级、二级栏目只支持修改栏目名称
设置好后点击“保存”按钮，即可生效。
使用导航栏编辑能方便地集成项目自定义的栏目，如示例：自定义添加“开发中心”导航栏。
布局和组件
布局设置
组件添加到右侧编辑区后，您可对该组件所在行进行12栅格布局，即1行按照12等分的原则进行划分。下面简单介绍下栅格布局的原理：
- 通过行在水平方向建立一组列
- 组件放置在列内
- 栅格系统中的列是指1到12的值来表示其跨越的范围。例如，三个等宽的列可使用4,4,4
- 一行中列的总和必须等于12
具体操作：
在右侧编辑区，鼠标悬停在具体组件所在行，会显示“编辑行”按钮，点击“编辑行”按钮，左侧会展开该组件所在行的布局构建器，即可进行布局设置。系统提供自适应和自定义两种对齐方式，默认使用自适应对齐方式，即一行中组件与组件是等宽对齐的。您也可以选择自定义对齐方式，手动调整组件在一行中跨越的范围，即在“栅格布局”选项中，输入数值，以英文逗号（,）隔开，数值总和必须等于12，数值个数与组件数相等，一行中最多允许添加六个组件。
您还可以调整当前行与下一行的间距、当前行背景色（默认未打开）、设置行内组件以固定大小居中显示（默认行内组件随屏幕大小拉伸并居中显示）。
组件
在首页编辑界面，点击左上角的齿轮，在展开的侧边栏中点击“布局构建器”，可看到门户提供的组件，支持以单击或拖拽的方式添加至右侧编辑区，单行最多允许添加6个组件。添加到右侧编辑区中的组件默认使用了行布局，您将鼠标悬停在组件所在的行进行行布局设置；鼠标悬停在组件上，会显示编辑、删除和拖拽组件按钮，您可以编辑组件、移除组件、拖动组件调整布局。每行中多个组件之间可以左右互换位置，行与行之间可以上下互换位置。
横幅
该组件包含一张背景图，支持修改背景图上的标题、副标题、按钮文字及超链接。若标题、或描述、按钮文字等为空，横幅组件仅会显示背景图。
卡片轮播
该组件可设置一组轮播的卡片，每张卡片由背景图片与字幕组成。支持设置组件的高度、播放方式、指示箭头与指示点等，还可对每张卡片单独设置背景图片、超链接、字幕内容以及布局样式。
快捷链接
该组件包含图标、标题、描述和超链接。支持修改默认的图标、标题文字、描述内容和超链接地址。
快捷链接 2
功能及操作同上述快捷链接组件。仅使用了不同的排版风格。
快捷链接 3
该组件包含图标、背景图片、标题、描述和超链接。支持修改默认的图标、背景图片、标题文字、描述内容和超链接地址。
资源卡片
热门资源组件，含标题、资源类别和各类资源的缩略图。支持修改标题文字、改变各类资源缩略图的排列方式，也支持显示或隐藏某类资源。
资源卡片 2
功能及操作同上述资源卡片组件。仅使用了不同的排版风格。
地图
地图组件允许添加天地图或门户中公开且可查看的地图，默认添加了天地图。添加地图方式：鼠标在地图组件上点击“编辑组件”，在左侧地图设置面板，选择要添加的地图类型、地图id、天地图密钥（如果门户地图使用了天地图作为底图，或选择的地图类型是天地图需填写）、组件高度、地图中心点的经纬度及地图级别。 注意：iPortal 默认提供了一个临时的天地图密钥，但是建议您单独申请一个用于实际生产环境中的正式密钥。
图标列表
默认包含六个列表项，每项包含图标及标题，且支持点击。您可增加或删除列表项，但最多能添加六项内容。每项内容支持上传新图标、修改标题文字和超链接地址。
内联框架
您可通过内联框架 iframe 方式内嵌第三方应用。支持修改该组件的高度和超链接地址。
标题
用于在门户首页添加文本标题和文本链接信息。支持修改标题文字、链接文本和超链接地址。
图片列表
默认是一个包含四张图片的列表组件。支持更改图片、图片的超链接，添加、删除图片。
图标内容
默认是一行两列，共三行内容的组件。每项包含图标、标题、描述及超链接。支持修改各项内容、添加新的列表项、删除列表项。添加新列表项后，组件按一行两列将新列表项添加到底部。
文本块
该组件包含文本标题、按钮及超链接。支持修改文本标题、按钮文字和超链接地址。
文本列表
该组件包含五列文本，每列包含标题、超链接和子文本项。支持修改组件的背景图、显示或隐藏每列文本、修改父列表和子列表项的标题和超链接地址。
新闻
该组件可设置标题名称、链接文本、超链接、新闻行数、新闻排序方式（最新、最多访问）和组件高度。当新闻行数所占的高度超过组件高度时，新闻条目自动以滚动方式显示。
文本
用于在首页中添加一段文本。支持修改文本的字体、字号、粗细、字形、对齐方式、行高、缩进、颜色等，支持为文本添加超链接。
视频
用于在首页中添加一段视频，支持设置视频的尺寸、播放方式、是否静音等，还可为视频添加控制条。
柱状图
用于在首页中添加一幅柱状图，提供的柱状图类型有常规柱状图、正方体柱状图、长方体柱状图、圆柱体柱状图，支持设置柱状图x轴、y轴的颜色、轴线、刻度、网格和标签等，支持设置图表内容的颜色、标签、高度、背景和内边距等。
条形图
用于在首页中添加一幅条形图，支持设置条形图x轴、y轴的颜色、轴线、刻度、网格和标签等，支持设置图表内容的颜色、标签、高度、背景和内边距等。
Footer
iPortal 提供了数套不同样式的 footer，可在左侧边栏的 Footer 样式选项卡中进行切换，不同样式的 footer 具有不同的设置项，可用于搭建各种风格的门户站点。
默认样式
iPortal 默认 footer 采用单行布局模式，适合较为简洁的门户站点搭建。
本样式设置项包括：
- 语言切换：控制是否显示语言切换组件
- 版权信息：网站的版权信息文本
- 文本链接：带有超链接的文本，由标题名和链接地址组成
样式1
本样式设置项包括：内容宽度、Logo、二维码、下拉列表、文本链接、联系信息、备案信息、语言切换、版权信息等。切换到本样式后，可在右侧界面编辑区将鼠标悬停在 footer 所在位置，点击浮现的编辑按钮，对 footer 进行可视化的编辑。
- 内容宽度：footer 整体内容宽度
- 语言切换：控制是否显示语言切换组件
- Logo：Logo 图片，您可通过上传改变 Logo，上传图片要求 png 或 jpg 格式，大小建议为 72px*72px
- 二维码：二维码列表，可添加最多 2 个二维码，支持对每项分别设置二维码图片和标题名
- 下拉列表：由超链接组成的下拉列表，可添加最多 5 个一级列表项，每个一级列表项下支持添加最多 7 个子列表项，子列表项由标题名和链接地址组成
- 文本链接：带有超链接的文本，最多支持添加 6 个文本链接，每项由标题名和链接地址组成
- 联系信息：联系方式集合，最多支持添加 4 个联系方式，每个联系方式由联系项、具体联系方式和链接地址组成
- 版权信息：网站的版权信息文本
- 备案信息：网站备案信息集合，最多支持添加 3 条备案信息，每项由标题名与和链接地址组成
样式2
本样式设置项包括：内容宽度、二维码、网站列表、联系信息、备案信息、语言切换、版权信息等。切换到本样式后，可在右侧界面编辑区将鼠标悬停在 footer 所在位置，点击浮现的编辑按钮，对 footer 进行可视化的编辑。
- 内容宽度：footer 整体内容宽度
- 语言切换：控制是否显示语言切换组件
- 二维码：二维码列表，可添加最多 2 个二维码，支持对每项分别设置二维码图片和标题名
- 网站列表：由超链接组成的文本列表，可添加最多 5 个一级列表项，每个一级列表项下支持添加最多 7 个子列表项，子列表项由标题名和链接地址组成
- 联系信息：联系方式集合，最多支持添加 4 个联系方式，每个联系方式由联系项、具体联系方式和链接地址组成
- 版权信息：网站的版权信息文本
- 备案信息：网站备案信息集合，最多支持添加 3 条备案信息，每项由标题名与和链接地址组成
样式3
本样式为天地图风格，将导航栏模式切换为天地图样式后，footer 将随之自动切换为天地图样式且无法更换为其他样式。在右侧界面编辑区将鼠标悬停在 footer 所在位置，点击浮现的编辑按钮，可对天地图 footer 的内容进行可视化的编辑。
- 背景图片：网站 Logo ，您可通过上传图片改变 Logo
- 联系信息：带有超链接的文本，最多支持添加 6 个联系信息，每项由标题名和链接地址组成
- 版权信息：网站备案信息集合，最多支持添加 6 条版权信息，每项由标题名与和链接地址组成
国际化
iPortal 默认支持中/英版的首页站点定制。默认首页定制选择的国际化定制语言选项是中文，您可切换为英文定制英文首页。若您有其他语言的定制需求，可先为门户站点进行多语言配置，配置完成重启 iPortal 后，首页编辑页面左侧边栏“首页国际化定制”下拉列表会列出新添加语言选项，选择要定制的站点语言，即可开始定制。注意：定制不同语言环境下的首页时，内容区（body）的组件是共用的，即在英文环境定制时删除了某个组件，中文环境首页也会删掉这个组件。不同语言环境下首页的头部（header）、底部（footer）中的内容项可以不一致。
保存和预览
首页定制完成后，可打开左侧面板的预览开关进行预览，点击面板右上角的“保存”按钮可进行保存发布。建议您在进行每个组件的编辑后，及时保存。注意：预览状态下不允许添加编辑、删除组件。
恢复默认设置
若您对定制效果不满意，希望恢复到 iPortal 默认站点模板时，可点击左侧面板右上角的“恢复默认设置”按钮，将首页还原至 iPortal 的默认状态。需要注意的是，还原默认设置后，您先前所做的所有更改均会丢失，建议您慎重操作。