Skip To Content

嵌入式视频、社交媒体和 iframe

在您的站点或页面上共享 FacebookVimeoYouTube 社交媒体和嵌入式 iframe 的视频。

要开始执行操作,请登录到 Portal for ArcGIS 并单击概览页面上的站点以查看站点列表。

提示:

在浏览器中查看站点时,也可以对其进行编辑。确保您已登录,然后在站点左侧找到编辑按钮。

显示视频

可将显卡添加至嵌入式 YouTubeVimeoFacebook 视频中。

  1. 媒体卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 视频 URL 字段中粘贴来自 FacebookVimeoYouTube 的视频 URL。
  4. 根据视频来源的不同,将显示不同的其他选项,以用于配置视频显示情况:
    • 对于 Facebook 视频,选择显示帖子文本可显示点赞、评论、分享和其他相关文本的数量。选择始终显示标题可显示视频标题。
    • 对于 Vimeo 视频,选择显示视频标题显示视频所有者显示视频所有者缩略图循环视频回放
    • 对于 YouTube 视频,选择显示 Youtube 标识循环视频回放
  5. 单击视频 URL 旁边的复制按钮将链接保存至剪贴板,以便在应用程序的其他位置重用。
  6. 单击保存

共享单个 Facebook 帖子

显示单个帖子以突出显示特定内容。

  1. 社交媒体卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 社交媒体帖子 URL 字段中,粘贴任何公开分享的 Facebook 帖子的 URL。要复制正确的 URL,请单击帖子的时间戳(帖子左上角显示的日期或时间),然后在返回编辑站点之前,在浏览器中复制新的 URL。
  4. 或者,单击显示帖子文本的切换按钮以显示与帖子相关的文本。
  5. 单击保存

显示 Facebook 时间轴

显示 Facebook 时间轴、事件以及消息以进行进一步浏览。

  1. 社交媒体卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 社交媒体帖子 URL 字段中,粘贴任何公开分享的 Facebook 页面的 URL。
  4. 或者,单击切换按钮以打开以下选项的任意组合:
    • 时间轴将在页面标题下显示时间轴选项卡。如果要将时间轴与事件或消息一同共享,请单击此选项。
    • 事件将显示页面事件视图的列表视图。
    • 消息使相关人员能够使用 Facebook Messenger 输入消息并将其发送给 Facebook 页面的管理员。
    • 使用大标题可增大页面标题的尺寸,并添加发送消息按钮以将相关人员与 Facebook Messenger 链接在一起。
    • 显示封面照片可显示页面的封面照片。
  5. 单击保存

显示单个推文

显示单个 Twitter 帖子以突出显示特定推文。

  1. 社交媒体卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 社交媒体帖子 URL 字段中,粘贴任何公开分享的 Twitter 帖子的 URL。要获取单个推文的链接,请单击帖子右上角的“更多”按钮,然后选择将链接复制到推文
  4. 或者,单击切换按钮以在选项菜单中打开以下选项的任意组合:
    • 显示深色主题可转换显示颜色。
    • 推文宽度可以通过以下选项选择帖子的显示尺寸:
  5. 选择推文位置允许您选择对齐方式:左对齐居中右对齐
  6. 单击保存

显示 Twitter 时间轴

显示可滚动的 Twitter 时间轴。

  1. 社交媒体卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 社交媒体帖子 URL 字段中,粘贴任何公开分享的 Twitter 时间轴的 URL。
  4. 或者,单击切换按钮以在选项菜单中打开以下选项的任意组合:
    • 扩展的高度可以显示多个 Twitter 时间轴。
    • 推文限制可设置时间轴上显示的推文数量(最多 20 个)。
    • 显示深色主题可转换显示颜色。
    • 显示标题可显示标题。同样,选择显示页脚可显示页脚。
    • 显示边框可显示时间轴周围的边框。
    • 显示背景可以移除或显示背景。
  5. 单击保存

使用 Iframe 卡片的嵌入式内容

您可以使用 iframe 卡片通过 URL 嵌入外部资源(例如应用程序、web 地图或仪表盘)。

提示:

iframe 最适合用于显示仪表盘和信息图表。对于其他项目,包括 Experience Builder web 应用程序、Insights 页面、web 地图和故事地图,请考虑使用图库卡片web 地图卡片应用程序卡片

使用 iframe 时,请考虑将实例数限制为不超过两个。如果站点或页面上的 iframe 过多,可能会影响移动视图的性能。无论使用 iframe 还是其他卡片,显示不超过 2 个关键项目可以创建更简洁、更易于访问的设计。对于其余项目,请尝试使用图库卡片

  1. Iframe 卡片拖动到现有行中。
  2. 将鼠标悬停在卡片上方,然后单击设置按钮切换到编辑模式。
  3. 提供 iframe URL 和 iframe 高度。请勿嵌入来自其他网站的 iframe 代码。只能粘贴到要嵌入的 URL 中。

    注:
    为了确保内容渲染,即使主要 URL 无法在小型设备上运行,您仍然可以使用移动 URL 覆盖字段。

  4. 为您的 iframe 添加标题。
  5. 通过打开自动启用滚动功能。

    提示:
    滚动功能并不总适用于移动设备,如果用户仅可以使用滚动功能,则可能无法通过应用程序。在提交更改之前,请确保可滚动 iframe 在移动设备上的可用性。

  6. 单击应用

    注:

    使用 HTTP 的 iframe URL 将不会显示在使用 HTTPS 的编辑模式中。保存并查看您的站点以观察您的 iframe。

  7. 单击保存