變更外觀(HBS) alter-the-appearance-hbs

現在,應用程式目錄(https://experienceleague.adobe.com/apps?lang=zh-Hant)中的自訂註解系統元件已準備就緒,且resourceSuperType參考預設註解系統,且已註冊自訂模型/檢視,您可以編輯實作。

為了簡單示範,視覺功能,也就是張貼評論的登入使用者顯示的人物化身,會被移除。

NOTE
若要使用擴充功能,受影響網站中註解系統的例項(https://experienceleague.adobe.com/content?lang=zh-Hant)必須將其資源型別設定為自訂註解系統。

修改HBS指令碼 modify-the-hbs-scripts

使用CRXDE Lite

  • 開啟/apps/custom/components/comments/comment/comment.hbs

    • 註解標籤,其中包含註解貼文的人物化身(~第21行):

      code language-none
        <!--
         <<img class="scf-comment-avatar {{#if topLevel}}withTopLevel{{/if}}" src="{{author.avatarUrl}}"></img>
         -->
      
  • 開啟/apps/custom/components/comments/comments.hbs

    • 將包含下一個註解專案(~第44行)頭像的標籤註釋掉:

      code language-none
        <!--
         <img class="scf-composer-avatar" src="{{loggedInUser.avatarUrl}}"></img>
         -->
      
  • 選取​ 全部儲存

復寫自訂應用程式 replicate-custom-app

修改應用程式後,必須重新復寫自訂元件。

其中一個方法是:

  • 從主功能表

    • 選取​ 工具 > 作業 > 復寫
    • 選取​ 啟動樹狀結構
    • Start Path設為/apps/custom
    • 取消選取​ 僅修改
    • 選取​ 啟動 ​按鈕。

在發佈的範例頁面上檢視修改的註解 view-modified-comment-on-published-sample-page

在仍以相同使用者身分登入的發佈執行個體上繼續使用體驗,現在可以在發佈環境中重新整理頁面,以檢視移除頭像的修改:

檢視 — 修改 — 內容

範例註解擴充功能套件 sample-comment-extension-package

附件是本教學課程中建立之自訂註解應用程式的套件。

取得檔案

recommendation-more-help
81e2cd9d-0789-409d-b87c-2a8ce4f28791