自訂主題

您可以安裝一或多個主題,用於專案中一或所有商店和網站。 主題包含多個靜態檔案(包括影像、字型、CSS、JavaScript、PHP等),以便完整設計您的存放區。 您可以將主題解壓縮程式碼至檔案系統或使用Composer來新增主題。

手動安裝主題

若要手動安裝佈景主題,佈景主題的程式碼必須在壓縮封存檔中或類似下列的目錄結構中:

<VendorName>
  ├── composer.json
      ├── etc
      │   └── view.xml
      ├── media
      ├── registration.php
      ├── theme.xml
      └── web
          ├── css
          │   └── source
          ├── fonts
          ├── images
          └── js

若要手動安裝佈景主題

  1. 複製店面主題的<Project root dir>/app/design/frontend底下的主題程式碼或管理主題的<Project root dir>/app/design/adminhtml。 請確認最上層目錄為<VendorName>;否則,主題未正確安裝。

    code language-bash
    cp -r ExampleTheme <project-root>/app/design/frontend
    
  2. 確認複製到正確位置的主題。

    • 店面主題: ls <project-root>/app/design/frontend
    • 管理主題: ls <project-root>/app/design/adminhtml

    範例如下:

    範例佈景主題Adobe Commerce

  3. 新增及提交檔案。

    code language-bash
    git add -A && git commit -m "Add theme"
    
  4. 將檔案推送至您的分支。

    code language-bash
    git push origin <branch name>
    
  5. 等待部署完成。

  6. 登入管理員。

  7. 按一下​ 內容 >設計> 佈景主題

    主題會顯示在右窗格中。

使用撰寫器安裝主題

使用Composer安裝主題與使用Composer安裝任何其他擴充功能相同。 如需詳細資訊,請參閱安裝、管理和升級模組

若要使用Composer安裝主題:

  1. 從Commerce Marketplace購買主題。

  2. 取得主題的撰寫器名稱。

  3. 變更至Adobe Commerce根目錄並輸入命令:

    code language-bash
    composer require <vendor>/<name>:<version>
    

    例如,

    code language-bash
    composer require zero1/theme-fashionista-theme:1.0.0
    
  4. 等待相依性更新。

  5. 輸入下列命令:

    code language-bash
    git add -A && git commit -m "Add theme"
    
    code language-bash
    git push origin <branch name>
    
  6. 登入管理員。

  7. 按一下​ 內容 >設計> 佈景主題

    主題會顯示在右窗格中。

多個主題

使用多個主題時(例如每個地區設定使用不同的主題),請檢閱SCD_MATRIX環境變數以自訂主題部署。 檢視環境設定中的組建部署階段。

recommendation-more-help
05f2f56e-ac5d-4931-8cdb-764e60e16f26