访客可能会通过手机打开你的名片和主页。 因此，在完成电脑页面设计后，建议花几分钟检查手机上的显示效果。 主页编辑器提供了手机预览和布局调整工具。
切换到移动端预览
- 进入主页编辑器
- 找到编辑器顶部工具栏中的设备切换按钮
- 点击手机图标切换到手机预览
- 编辑区域会切换为手机屏幕比例，模拟访客看到的效果
点击桌面图标可随时切换回桌面端视图，两种视图可以随意来回切换。
移动端布局行为
- 新建主页：默认提供自由定位的电脑和手机初始布局，手机页面可以单独保存模块的位置和尺寸。
- 历史自动布局主页：电脑和手机页面共用内容顺序，并继续自动适配屏幕宽度；在电脑端首次拖动后转换为自由定位。
手机预览顶部可选择现有机型。机型只改变预览宽度，同一份手机布局会按宽度等比显示，不会为每款机型创建独立布局。
自由定位的手机布局
切换到手机预览后，尚未设置手机位置的模块会按电脑页面顺序生成初始布局；也可以使用「重新生成手机布局」，根据当前电脑页面重新排列。
重新生成会覆盖已有的手机布局。生成后可在电脑上的手机预览中继续调整；手机设备上的编辑器主要用于预览、编辑内容和调整顺序，更精细的位置、前后顺序和高级样式需要在电脑上设置。
控制模块的手机端可见性
某些模块可能只适合在桌面显示。你可以为每个模块开启手机端隐藏， 让该模块继续在桌面端显示、在手机端隐藏。
设置入口：选中模块 → 右侧属性面板 → 开启「手机端隐藏」。
手机页面优化建议
以下是一些常见的手机页面调整方法：
- 文字太小：在移动端视图下拉宽该模块的宽度， 或在属性面板中适当调大字体大小
- 内容超出屏幕：检查模块是否过宽，并拖动右侧边缘将内容收窄到屏幕内
- 模块间距太密：在移动端视图下手动向下拖动后续模块， 增加垂直间距
- 图片显示不全：检查图片模块的高度是否足够， 或将图片裁切比例改为更适合竖屏的比例
推荐工作流程
- 先在电脑画布确认模板的初始布局，再拖动、缩放或调整模块层级
- 完成电脑页面后切换手机预览，按需要重新生成或微调手机布局
- 选择几款不同宽度的手机逐个检查模块显示效果
- 使用手机实际打开主页公开链接进行最终检查
建议在发布重要更新后，用自己的手机打开链接实际查看一遍效果。