多區域佈局

下頁說明多區域版面配置的使用,並涵蓋下列主題:

  • 概覽
  • 建立多區域版面
  • 必備條件
  • 在一或多個區域中使用單一資產
  • 在一或多個區域中使用排序的內容

概覽

多區域版 面可讓您建立多個區域內容,並使用多種資產,例如視訊、影像和文字,這些資產可以結合在單一畫面中。您可以拉進影像、視訊和文字,讓所有影像、視訊和文字融為一體,創造直覺式數位體驗。

根據專案需求,有時您需要一個通道中的多個區域,並將它們作為一個完整單元進行編輯。 例如,產品序列,其相關社交媒體摘要會在單一頻道的三個獨立區域中執行。

必備條件

開始實作此功能之前,請確定您已具備以下概念性知識:

建立多區域佈局

建立渠道時,您可以使用不同的範本,以便在渠道中建立區域。 您可以新增單一影像、視訊或內嵌頻道,讓多個資產可以在序列中顯示。

建立渠道

  1. 選擇Adobe Experience Manager連結(左上),然後選擇​Screens。 或者,您也可以直接前往:http://localhost:4502/screens.html/content/screens

  2. 導航到​Channels​資料夾,然後從操作欄按一下​Create

  3. 從​建立​嚮導中選擇​1x2拆分螢幕通道

  4. 按一下「Next」,然後將​title​輸入為​MultiZone

  5. 按一下​建立​以完成通道建立。

在一或多個區域中使用單一資產

您可以在所有個別區域中使用單一資產,例如影像或視訊。 請依照下列步驟進行實施:

  1. 新增內容至頻道

    1. 導航至​Zones —> Channels—> MultiZone
    2. 選擇​MultiZone​頻道,然後從操作欄按一下​Edit​以開啟編輯器。
  2. 將影像新增至頻道

    若要在兩個區域中播放單一影像或視訊,只需將影像拖放至頻道編輯器中的每個區域,如下圖所示:

    影像

在一個或多個區域中使用排序內容

如果您希望區域在不同區域中顯示影像和視頻的序列,請遵循以下步驟瞭解詳細資訊。

  1. 建立渠道資料夾

    1. 導覽至​Zones —> MultiZone —> Channels,然後從操作欄按一下​Create
    2. 從​建立​嚮導中選擇​渠道資料夾 ,然後按一下​Next
    3. 將標題輸入為​EmbeddedChannels ,然後按一下​Create

    screen_shot_2018-12-19at125428pm

  2. 新增兩個渠道至渠道資料夾

    1. 導覽至​Zones —> Channels —> EmbeddedChannels,然後從操作欄按一下​Create
    2. 從​建立​嚮導中選擇​序列通道​以建立名為​區域1​的通道。
    3. 選擇​Zone1,然後從操作欄按一下​Edit​以開啟編輯器。
    4. 將幾張影像拖放至此頻道。
    5. 同樣地,在​EmbeddedChannels​資料夾中建立另一個名為​Zone2​的序列頻道。
    6. 將視訊拖放至此頻道。

    下圖顯示了通道​Zone1​和​Zone2:

    screen_shot_2018-12-19at125930pm

    添加到​Zone1​序列通道編輯器的影像如下所示:

    screen_shot_2018-12-19at125930pm

    添加到​Zone2​序列頻道編輯器的視頻如下所示:

    screen_shot_2018-12-19at125930pm

  3. 將嵌入序列(元件)添加到主通道(多區域)

    1. 導航至​Zones —> Channels —> MultiZone

    2. 按一下操作欄中的​編輯​以開啟編輯器。

    3. 將​嵌入序列​元件拖放到兩個區域。

    4. 選擇其中一個區域中的嵌入序列。

    5. 在編輯器中,按一下其中一個內嵌序列的​Configure(扳手)圖示。

    6. 選擇通道路徑作為​Zones —> Channels —> EmbeddedChannels —> Zone1,如下圖所示。

    7. 同樣地,將​Zone2​添加到編輯器中的另一個嵌入式序列元件。

      影像

建立位置和顯示

您必須建立位置和顯示,才能在「畫面」播放器中檢視內容。 請依照下列步驟建立位置和顯示。

  1. 建立位置

    1. 導航至​Zones —> Locations​資料夾。
    2. 選擇​Locations​資料夾,然後從操作欄按一下​Create
    3. 從​建立​嚮導中選擇​位置 ,然後按一下​下一步
    4. 將​Title​輸入為​SanJose,然後按一下​Create
  2. 建立顯示

    1. 導航至​Zones —> Locations​資料夾。
    2. 選擇​SanJose​位置,然後從操作欄中按一下​建立
    3. 從​建立​嚮導中選擇​顯示 ,然後按一下​Next
    4. 將​Title​輸入為​Lobby,然後按一下​Create

為顯示指定頻道

您必須將頻道指派給顯示,才能檢視內容。 請依照下列步驟,將頻道指派給顯示器。

  1. 將頻道指派給顯示

    1. 導覽至​Zones —> Locations —> SanJose—>Lobby

    2. 選擇​Lobby​顯示,然後從操作欄按一下​Assign Channel

    3. 在​通道路徑​中輸入到​多區域​通道的路徑。

    4. 將「受支援事件」設定為「初始負載​」、「空閒螢幕」和「計時器​」。

    5. 按一下​「儲存」

      影像

    6. 同樣地,您必須將其他兩個嵌入式通道(Zone1​和​Zone2)分配給此顯示。

    7. 在您將所有三個頻道指派給​Lobby​顯示後,您應可從顯示控制面板檢視指派的頻道。

      影像

      重要

      一旦將主通道(在本例中為​MultiZone)分配給顯示器,則必須將其他兩個嵌入通道​Zone1​和​Zone2​也分配給同一顯示器。

註冊設備

在您設定位置和顯示器後,請依照下列步驟註冊裝置並指派顯示器至裝置。

  1. 註冊設備

    1. 導航到​Zones —> Devices​資料夾。

    2. 選擇​Devices​資料夾,然後從動作列按一下​Device Manager

    3. 按一下「設備註冊」並從清單中選擇待審設備。

      注意

      設備的標題必須與​設備註冊​頁籤中顯示的設備Token(Token​欄位)匹配。

    4. 如果標題與裝置Token相符,請選取裝置,然後從動作列按一下「註冊裝置」。

    5. 如果註冊代碼與Screens player Device Registration​標籤中的代碼相符,請從動作列按一下​Validate

      影像

    6. 將​Title​輸入為​Chrome-Device1,然後按一下「註冊​」。

    7. 選擇​Assign Display​並選擇設備配置的路徑。

    注意

    如果您嘗試在「畫面播放器」中檢視內容,請務必從頻道控制面板按一下「更新離線內容」,以取得指派給顯示器的每個頻道。

查看結果

使用上述步驟實作多區域版面後,會顯示下列輸出。

勾選「畫面播放器」以檢視顯示兩個不同區域內內容的輸出。 左側和右側區域(兩者都使用嵌入序列作為元件)。

左區域是序列頻道,右區域包含視訊。

new2-1

本頁內容