建立和新增範本和元件

注意

AEM 6.4已結束延伸支援，本檔案不再更新。 如需詳細資訊，請參閱 技術支援期. 尋找支援的版本 此處.

注意

Adobe建議針對需要單頁應用程式架構用戶端轉譯（例如React）的專案使用SPA編輯器。 深入了解.

AEM Mobile On-Demand提供完整設定的應用程式範本、文章範本和文章元件。

We.Unlimited App是範例範本，代表可完全設定且可管理的AEM Mobile On-Demand應用程式的殼層。

建立新應用程式時選取此範本，可提供AEM Mobile功能豐富的控制面板。

chlimage_1-70

注意

若要從AEM Mobile Apps Control Center管理您的應用程式和行動應用程式內容，請參閱 AEM Mobile應用程式控制面板.

建立應用程式範本

應用程式範本可用來建立新應用程式，並可作為頁面範本和元件的集合，這些範本和元件代表應用程式的基準或基礎。 範本會戳記某些基本屬性，以適當方式引導應用程式。 一般而言，客戶不會總建立太多應用程式。

應用程式範本可讓您輕鬆運用開發人員建立的現有設計，以在AEM內建立新應用程式。

根據其他應用程式的範本建立新應用程式時，您會得到一個應用程式，其起始點代表建立該應用程式時所在的應用程式。

根據應用程式範本建立新應用程式的步驟：

  1. 導覽至AEM Mobile應用程式目錄： <server-url>/aem/apps.html/content/mobileapps
  2. 選擇 建立 —> 應用程式 如下所示

使用此範本建立應用程式後，您就可以將文章、橫幅和集合新增至應用程式。 若要重新造訪、建立文章、橫幅和集合，請參閱 內容管理動作.

注意

或者，您也可以選取範例應用程式範本，例如 We.Unlimited 應用程式，由AEM開發人員提供給您。 如果您將此範例範本用於應用程式，您會看到一些範例文章和集合可供使用。 您可以選擇使用範本和元件範例、自訂現有範本和元件，或為應用程式建立新範本和元件。

注意

設定 redirectTarget 屬性

使用其中一個應用程式範本時，開發人員會定義應用程式的內容。 不過，開發人員必須知道應用程式在jcr中建立的位置，以及 redirectTarget 屬性。

此 redirectTarget 會計算為建立應用程式操作的一部分，並嘗試解析路徑（如果應用程式範本中有可用的redirectTarget屬性，且redirectTarget的值定義為相對）。 當建立應用程式程式在應用程式範本中找到redirectTarget的相對值時，該值會附加至建立應用程式的解析位置。

例如，如果應用程式範本定義 redirectTarget 值為"拉努加吉·馬斯特斯/恩」，而應用程式是在「/content/mobileapps/fooApp"，在建立應用程式後redirectTarget的最終值將是"/content/mobileapps/fooApp/language-masters/en」。

建立內容範本

每個實體類型都有兩個現成的範本。 說明如下：

  • 預設範本： 用適用的預設屬性/結構建立內容
  • 導入的模板： 用於從AEM Mobile匯入內容，且適用的預設屬性/結構

文章範本

「無限制文章」是代表典型AEM Mobile隨選文章版面的範例範本。

  1. 按一下 + in 管理文章 來建立新文章。 您可以選擇 無限制文章 或 RTF文章. 下圖顯示的選項可讓您從這兩個文章範本中選擇任何一個。

  2. 按一下 下一個 定義文章元資料，例如「文章名稱/標題」、「說明」、「作者」、「抽象」、「部門」、「縮圖影像」、「文章存取」等。

  3. 按一下 下一個 填寫廣告屬性。

  4. 按一下 下一個 輸入文章影像或社交媒體影像

  5. 按一下 下一個 來選擇此新文章的集合連結。

  6. 按一下 下一個 以輸入社交分享的詳細資訊。

  7. 按一下 建立 以完成使用範例建立文章的程式。 按一下 完成 或 編輯文章 編輯此文章的屬性。

chlimage_1-71

新增元件至文章

建立後，作者可以新增文字和影像等元件來編輯文章的內容。 文章是AEM頁面範本的擴充功能。

選取要編輯的文章，然後按一下 編輯 新增元件至文章。

chlimage_1-72 chlimage_1-73

選擇「+「 」，將元件新增至文章。

chlimage_1-74

建立現成可用的範本

沒有現成可用的文章範本，不過自訂範本有應擴充的預設範本，請參閱Geometrixx Unlimited應用程式的 文章範本範例.

一般AEM範本以外的關鍵屬性需要屬性包括；

dps-resourceType="dps:Article"

此屬性可確保將AEM頁面辨識為AEM Mobile目標文章頁面。

如同AEM範本，您可以將任何預設屬性或子節點新增至範本的 jcr:content.

注意

橫幅和集合沒有內容，因此其建立不支援自訂範本。

建立和新增元件

元件使用和允許訪問Widget，這些用於呈現內容。

程式碼存放庫中包含簡單元件，可在AEM中找到其來源。 隨後，也可以在本地以CRXDE Lite開啟。

注意

目前未提供現成可用的AEM Mobile元件。

您可以將元件新增至頁面。 任何元件皆可用於AEM Mobile應用程式中，但套用後，可能無法正確呈現。

不過，若沒有可在AEM中轉譯的自訂匯出內容同步處理常式，自訂元件可能無法正確匯出及上傳至AEM Mobile On-demand Services。

在元件已包含在AEM頁面中後，您就可以新增其他元件至頁面或編輯現有的元件，以及搭配一些其他建置區塊元件。

若要新增其他元件至頁面：

  1. 選擇該頁面，並透過編輯器標題右上角的下拉式清單，確定您處於編輯模式
  2. 使用編輯器標題中最左側的圖示切換側面板
  3. 選取 元件 標籤
  4. 將其中一個可用元件拖放至頁面上

chlimage_1-75

要編輯現有元件，請執行以下操作：

  1. 選擇該頁面，並確定您位於 編輯 模式並選取元件
  2. 點選扳手圖示以設定元件
注意

您可以在AEM中建立元件，並使用 使用CRXDE Lite開發. 將現有元件自訂為您的需求後，即可使用 編輯 選項 管理文章 如上圖所示。

注意

請參閱 範本和元件開發的最佳實務 在AEM Mobile。

後續步驟

本頁內容