添加图像.

学习 DXPR Builder搭建页面添加内容文本与媒体

添加铺满所在列、随屏幕缩放的照片或插画。

DXPR Builder 图像元素展示的彩色漩涡作品

添加图像

登录后打开页面:悬停内容区即出现构建器控件。您的第一页介绍基础操作。

  1. 悬停列,点击其控制栏中的 +;空白页面请点击 Add Elements。打开 Content 选项卡并点击 Image。它落在列顶部,设置对话框打开。
  2. 在 Image 下点击 Select Image。在 Media browser 中可按名称过滤,勾选一张照片并点击 Insert selected。
  3. 点击 SEO 标题展开。用照片的简短描述替换 Alt attribute 中的文本。
  4. 点击对话框中的 Save。再点击内容区顶部工具栏中的 Save 保存页面。

您会看到的内容

默认 Image width 为 100%。屏幕阅读器播报您的替代文本。要检查缩放,请将 View mode 设为 Preview 并收窄浏览器窗口。保存发布后访客看到您的修改。

设置您的图像

悬停元素,在其控制栏打开 More > Settings。选项:

  • Image: 从站点媒体或文件浏览器选择图片、上传文件,或粘贴外部 URL。
  • Image width: CSS 宽度,如 100% 或 300px。默认为 100%。
  • Image height: 固定高度,如 400px。留空保持照片形状。
  • Image link: 让图片可点击。输入 URL 或选择页面。
  • Image link target: Same window 或 New window。添加链接后显示。
  • Alt attribute: 在 SEO 分区,面向屏幕阅读器和搜索引擎的描述。
  • Title attribute: 在 SEO 分区,悬停显示为提示的附加信息。

图片加载与页面速度

DXPR Builder 自动管理新图片的加载,保持页面快速并防止内容跳动。页面开头的图片,以及选项卡、轮播和跑马灯内的图片保持立即可见。更下方图片可随访客滚动加载。

图片可来自媒体库、上传文件或外部 URL。保存前让图片在编辑器中加载完毕,DXPR Builder 才能预留合适的空间。替换图片更新其尺寸,不改变您选择的显示尺寸。

站点已有图片不会自动升级。页面速度还取决于图片文件大小和其他内容。请在宽窄屏幕检查发布页。

如果看不到它

  • Content 选项卡中没有 Image。 您的用户档案隐藏了它。请管理员到用户档案启用。
  • 重新加载后消失。 页面未保存。请重新添加并点击内容区顶部工具栏中的 Save。
  • 图像元素为空。尚未在 Image 字段设置图片。请悬停元素打开 More > Settings,点击 Select Image。
  • 出现破图图标。 文件在媒体库中被删除或移动。请悬停元素打开 More > Settings,移除所选并重选图片。
  • 图片被拉伸或压扁。 Image width 和 Image height 都是与照片不符的固定值。请清空 Image height 恢复形状。

接下来做什么?

样式选项卡:改变图像的间距和背景。