華燈初上

Joomla! 資訊網站

  • 首頁
    • 會員使用條款
    • 隱私權政策
  • Joomla!
    • Joomla! 新聞
    • J2Store 教學
    • Joomla! 核心
    • 元件文章
    • 佈景主題文章
    • 經驗、觀念分享
    • 外部網路資源
  • 書籍與授課
    • Joomla! 書籍簡介
    • 簡報分享
  • 討論區
  • 留言板
  • 會員登入
    註冊
    • 忘記你的帳號?
    • 忘記你的密碼?

    使用社群網站帳號登入

    你目前位置:  
  1. 首頁
  2. Joomla!
  3. J2Store 教學
  4. 在 J2Store 建立可變性商品教學
02 四月 2018

在 J2Store 建立可變性商品教學

J2Strore 多樣性商品說明

  J2Store 的「多樣性商品」分類適用於成衣(衣服、褲子等)這類具備多屬性分布的商品,在建立時加入先建置的選項組合,讓顧客在單一頁面就能依需求選擇適合的商品。本類型商品資料的複雜程度會因為產品選項的多寡而有變化,建議在建立此類型商品時放慢步調,逐步檢查相關設定、數值是否到位。

範例商品說明

  • 商品名稱:素色 T 恤。
  • 預設顯示商品類型:白色,中號。
  • 尺寸:小(S)、中(M)、大(L)、特大(XL),需先行建立選項組合。
  • 顏色:白、紅、綠、藍,需先行建立選項組合。
  • 產品圖片:需先行上傳至網頁伺服器。
  • 價格:小及中號價格相同,大號及特大號價格相同,不分顏色均一價。
  • SKU:不同尺寸、顏色均有不同 SKU,以本範例計有 4×4=16 個 SKU。

準備:建立多樣性商品需要的選項群

Step 01:點選左方選單(或管理區頂部選單「J2Store」項目)的「型錄 – 選項」。

點選選單「型錄 - 選項」▲點選選單「型錄 - 選項」。

Step 02:點選工具列「新增」按鈕。

新增選項群▲新增選項群。

Step 03:在編輯畫面輸入選項群基本資料,然後點選工具列「儲存」按鈕。

  • 唯一名稱:size(建議使用英文,用以識別)。
  • 顯示/展示:在網站顯示時的選項名稱,請輸入「尺寸」。
  • 類型:選擇選項的展示類型,在多選一的情況可以選擇「下拉選單」或「單選」,筆者選擇前者。
  • 已發佈:選擇「是」讓該選項能在前台使用。

選項群建立畫面▲選項群建立畫面。

Step 04:點選畫面「新增選項值」按鈕增加選項明細,輸入完成後點選工具列「儲存」按鈕。

  • 選項值:選項清單所顯示的內容。
  • 圖片:與該選項相關的圖片,於儲存選項明細資料後加入。
  • 排序:該選項的顯示順序,數字越小者越前面。

建立選擇項
▲建立選擇項。

Step 05:重複 Step 03 與 04 的步驟建立顏色選項群及選項明細,然後點選工具列「儲存」按鈕儲存。

顏色選項的類型選擇「單選」。▲顏色選項的類型選擇「單選」。

建立商品資料

Step 01:點選左方選單(或管理區頂部選單「J2Store」項目)的「型錄 – 產品」。

點選選單「型錄 - 產品」▲點選選單「型錄 - 產品」。

Step 02:建立方式與前一節大致相同,在「商品類型」項目請選擇「多樣」後點選「儲存並繼續」按鈕。

商品類型選擇「多樣」▲商品類型選擇「多樣」。

Step 03:點選「J2Store Cart」分頁,繼續輸入商品資料。

「通用」分頁

商品資料:「通用」分頁▲商品資料:「通用」分頁。

  • 在商店前端可見:選擇「是」讓該商品能在前台顯示。
  • 品牌或製造商:選擇已建立的品牌或製造商項目。
  • 供應商:選擇已建立的供應商(或批發/代理商)項目。
  • 稅率檔案:指定商品是否納稅,如果是則選擇相關的稅率檔案。
  • 購物車按鈕文字:輸入取代「加入購物車」按鈕的顯示文字,留空則使用預設值。

「圖片」分頁

商品資料:「圖片」分頁▲商品資料:「圖片」分頁。

提供與產品有關的圖片,預設瀏覽路徑為「image」資料夾,請先透過「媒體管理」或 FTP 程式將產品圖片上傳至此資料夾。

  • 縮圖圖片:顯示在商品列表、購物車畫面即通知信件的圖片。
  • 主要圖片:代表商品的圖片。
  • 額外圖片:增加與產品有關的細節照片,J2Store 會自動產生縮圖。

「變數」分頁

在「變數選項」欄位輸入選項組合的部分文字,系統會在欄位下方顯示找到的結果,點選找到的選項群加入選項列。在「排序」欄位定義選項群的順序後點選工具列「儲存」按鈕。

欄位中輸入關鍵字,點選找到的項目。▲欄位中輸入關鍵字,點選找到的項目。

Step 04:請點選變數選項的「設定數值」連結,在浮現視窗中選擇要使用的選擇項,點選「建立選項」加入清單,最後點選「儲存變異」儲存。

點選連結,匯入選擇項▲點選連結,匯入選擇項。

依需要增加選擇項目,或點選『增加「所有」選項』按鈕加入選項群所有項目。▲依需要增加選擇項目,或點選『增加「所有」選項』按鈕加入選項群所有項目。

Step 05:點選畫面下方「產生變數」,讓 J2Store 為各選項組合產生相關資料欄位。

點選「產生變數」,建立商品多樣性選擇▲點選「產生變數」,建立商品多樣性選擇。

Step 06:點選各選項組合,補足 SKU、售價、產品圖片、庫存量等商品資料。

輸入、儲存商品資料後,點選選項組合右方的星號,使其成為預設產品項。▲輸入、儲存商品資料後,點選選項組合右方的星號,使其成為預設產品項。

Step 07:參考〈在 J2Store 建立單一性商品〉文章選擇「過濾」、「關係」、「Apps」分頁要輸入或選擇的項目,然後點選工具列「儲存」按鈕儲存商品資料。

在「商品列表」畫面顯示的商品資料,顯示項目開關可在選單項目畫面編輯。▲在「商品列表」畫面顯示的商品資料,顯示項目開關可在選單項目畫面編輯。

產品詳細畫面,點選不同顏色、尺寸,商品圖片及價格隨之改變。▲產品詳細畫面,點選不同顏色、尺寸,商品圖片及價格隨之改變。

 

使用J2Store開設網路商店的10堂課

看得不夠過癮嗎?完整內容就在《使用J2Store開設網路商店的10堂課》!

購買電子版:Google Play 圖書

線上購買

博客來網路書店 天瓏網路書店 金石堂網路書店
誠品網路書店 碁峰購物網 作者專屬簽名版

Tags: Joomla!, j2store
  • 上一篇文章:在 J2Store 建立可客製商品教學 在 J2Store 建立可客製商品教學
  • 下一篇文章:在 J2Store 建立單一性商品教學 在 J2Store 建立單一性商品教學

服務條款 隱私權條款© 1999 - 2019 創用 CC 授權條款華燈初上由 A-Bo Lee 製作,以創用CC 姓名標示-非商業性-禁止改作 3.0 台灣 授權條款釋出。All Rights Reserved. Powered by Helix3

Joomla!® is the trademark of Open Source Matters, Inc. in the United States and other countries. The Joomla!® name is used under a limited license granted by Open Source Matters. 華燈初上 is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

  • 首頁
    • 會員使用條款
    • 隱私權政策
  • Joomla!
    • Joomla! 新聞
    • J2Store 教學
    • Joomla! 核心
    • 元件文章
    • 佈景主題文章
    • 經驗、觀念分享
    • 外部網路資源
  • 書籍與授課
    • Joomla! 書籍簡介
    • 簡報分享
  • 討論區
  • 留言板
  • 會員登入
 
為使您有最好的使用體驗,本網站使用 cookies 功能記錄您的喜好。
We use cookies to ensure that we give you the best experience on our website.
我同意 / I accept