作為電商系統(tǒng),很多地方都是圍繞產品展開的,譬如產品分類,產品搜索,產品評論,
產品收藏,購物車產品,訂單產品等等。
產品除了價格,名字,庫存等一些公用的屬性外, 產品根據(jù)不同的分類,會有一些獨有的屬性, 譬如電腦類產品會有cpu型號,主板型號等屬性, 衣服類有顏色尺碼等屬性,在這里引入產品屬性組的概念, 一類產品從屬于一個屬性組。
屬性組的配置:
打開文件:@common/config/fecshop_local_services/Product.php
文件
可以看到對屬性組的配置
配置文件的內容太多,這么不貼出來的,您可以打開這個文件查看具體內容,里面有注釋
屬性組里面的屬性有類別,目前有三個類:
1、spu_attr
1.1 spu和sku的概念:sku是產品的唯一標示,最小庫存單位,譬如一款鞋子為一個spu,這款鞋子的不同的顏色和不同的尺碼為一個sku,
1.2 什么是spu屬性(spu_attr
),當一款鞋子的不同的sku是顏色和尺碼的不同,那么顏色和尺碼就是這款鞋子的spu屬性(spu_attr)。
1.3 spu_attr
是用來在產品詳細頁面,將這個spu下面的所有sku串聯(lián)起來,譬如頁面:http://fecshop.appfront.fancyecommerce.com/index.php/raglan-sleeves-letter-printed-crew-neck-sweatshirt-53386451-77774122
訪問這款衣服的每一個SKU,都會把其他的sku列出來,點擊后,就進去其他sku的頁面,您會發(fā)現(xiàn)url是變化的,這個是類似于京東的方式。
注意:
1.3.1 因為組合的復雜性,spu attr
最多設置2個屬性,不能超過2個(如果超過會出問題。spu屬性會都不顯示),超過兩個請使用customer_option的方式。也就是類似于淘寶的方式。
1.3.2 這里的屬性需要嚴格按照下面的格式進行配置,如果您想配置自己的spu屬性,那么
1.3.3 通過鏈接:https://fecshop.appfront.fancyecommerce.com/raglan-sleeves-letter-printed-crew-neck-sweatshirt-41214715 您可以看到,color屬性是用圖片來顯示的, 在spu_attr中,第一個屬性默認用圖片顯示,譬如:
'spu_attr' => [ # spu用來區(qū)分sku的屬性,譬如下面的屬性的不同,對應不同的sku,進而是不同的庫存
# 第一個屬性會被用戶當做圖片來顯示。
'color' => [
'dbtype'=> 'String',
'label' =>'顏色',
'name' =>'color',
'sort_order' => 1,
'display'=>[
'type' => 'select',
'data' => [
'one-color' => 'one-color',
'red' => 'red',
'white' => 'white',
'black' => 'black',
'blue' => 'blue',
'green' => 'green',
'yellow' => 'yellow',
'gray' => 'gray',
'khaki' => 'khaki',
'ivory' => 'ivory',
'beige' => 'beige',
'orange' => 'orange',
'cyan' => 'cyan',
'leopard' => 'leopard',
'camouflage' => 'camouflage',
'silver' => 'silver',
'pink' => 'pink',
'purple' => 'purple',
'brown' => 'brown',
'golden' => 'golden',
'multicolor' => 'multicolor',
'white & blue' => 'White & Blue',
'white & black' => 'White & Black',
]
],
//'require' => 0,
//'default' => 2,
],
# 第二個屬性不會當做圖片來顯示
'size' => [
'dbtype'=> 'String',
'label' =>'尺碼',
'name' =>'size',
'sort_order' => 2,
'display' =>[
'type' =>'select',
'data' =>[
'one-size' => 'one-size',
'S' => 'S',
'M' => 'M',
'L' => 'L',
'XL' => 'XL',
'XXL' => 'XXL',
'XXXL' => 'XXXL',
]
],
//'require' => 0,
//'default' => 2,
],
],
color 將會被當做圖片來顯示出來。
2、general_attr(普通屬性),可以是各種格式的值,譬如時間格式,email格式,下拉條選擇值等。這些屬性可以用于分類側欄屬性過濾。
示例配置:
'general_attr' => [
# 這是input type='text' 的類型
'my_remark' => [
'dbtype'=> 'String',
'label'=>'我的備注',
'name'=>'my_remark',
'display'=>[
'type' => 'inputString', # 字符串格式的屬性
],
'require' => 0,
],
# 這是input type='email' 的類型
'my_email' =>[
'dbtype'=> 'String',
'label'=>'我的郵箱',
'name'=>'my_email',
'require' => 0,
'display'=>[
'type' => 'inputEmail', # 字符串格式的屬性(email格式驗證)
],
],
# 這是input type='date' 的類型
'my_date' => [
'label'=>'我的日期',
'name'=>'my_date',
'display'=>[
'type' => 'inputDate', # 字符串格式的屬性(Date格式驗證)
],
],
# 這是<select> 的類型
'style' => [
'dbtype'=> 'String',
'label' =>'類型',
'name' =>'style',
'display' =>[
'type' =>'select', # 下拉條選擇格式的屬性
'data' =>[
'Casual' => 'Casual',
'Cute' => 'Cute',
'Sexy & Club'=> 'Sexy & Club',
'Bohemian' => 'Bohemian',
'Vintage ' => 'Vintage ',
'Brief' => 'Brief',
'Work' => 'Work',
'Novelty' => 'Novelty',
]
],
],
'dresses-length' => [
'dbtype'=> 'String',
'label' =>'裙長',
'name' =>'dresses-length',
'display' =>[
'type' =>'select', # 下拉條選擇格式的屬性
'data' =>[
'Mini' => 'Mini',
'Knee-Length' => 'Knee-Length',
'Mid-Calf'=> 'Mid-Calf',
'Ankle-Length' => 'Ankle-Length',
'Floor-Length ' => 'Floor-Length ',
]
],
],
'pattern-type' => [
'dbtype'=> 'String',
'label' =>'款式',
'name' =>'pattern-type', # 屬性名字
'display' =>[
'type' =>'select', # 下拉條選擇格式的屬性
'data' =>[
'Animal' => 'Animal',
'Character' => 'Character',
'Floral'=> 'Floral',
'Geometric ' => 'Geometric ',
'Leopard '=> 'Leopard ',
'Letter'=> 'Letter',
'Paisley'=> 'Paisley',
'Patchwork'=> 'Patchwork',
'Polka Dot'=> 'Polka Dot',
'Print'=> 'Print',
'Striped'=> 'Striped',
]
],
],
'sleeve-length' => [
'dbtype'=> 'String',
'label' =>'袖長',
'name' =>'sleeve-length',
'display' =>[
'type' =>'select',
'data' =>[
'Sleeveless' => 'Sleeveless',
'Short-Sleeves' => 'Short Sleeves',
'Half-Sleeves'=> 'Half Sleeves',
'3-4-Length-Sleeves ' => '3/4 Length Sleeves ',
'Long-Sleeves '=> 'Long Sleeves ',
]
],
],
'collar' => [
'dbtype'=> 'String',
'label' =>'領口', # 后臺顯示的中文名(目前后臺只有中文)
'name' =>'collar',
'display' =>[
'type' =>'select',
'data' =>[
'Round Neck' => 'Round Neck', # 下拉條里面對應的各個可以選擇的值。
'V-Neck' => 'V-Neck',
'Hooded' => 'Hooded',
'Turn-down-Collar' => 'Turn-down Collar',
]
],
//'require' => 0,
//'default' => 2,
],
],
3、custom_options用戶自定義屬性,顯示方式方面有點和spu屬性類似,spu屬性顯示的方式是京東的方式,點擊每一個選項是url跳轉的
用戶自定義類似于淘寶的方式,選擇各個顏色尺碼,頁面是不跳轉的,各個顏色尺碼有相應的圖片,庫存,價格,sku等。
您可以查看演示地址:http://fecshop.appfront.fancyecommerce.com/index.php/reindeer-pattern-glitter-christmas-dress-86519596
您可以給產品屬性組添加的屬性類型就上面幾種,在后臺編輯產品的時候,選擇不同的屬性組,就會加載相應的屬性出來。
示例配置:
'custom_options' => [
'my_color' => [
'dbtype'=> 'String', #類型
'label' =>'My Color', # 顯示的名字
'name' =>'color', # 在數(shù)據(jù)庫中存在的列名
'showAsImg' => true, # (在前端展示部分)通過圖片的方式展示屬性。譬如;http://fecshop.appfront.fancyecommerce.com/index.php/reindeer-pattern-glitter-christmas-dress-86519596,
# 你會發(fā)現(xiàn),該屬性對應的顯示方式不是值,而是產品的圖片。
'require' => 1, # 1代表是必填選項,0代表選填
'display'=>[
'type' => 'select',
'data' => [
'red' => 'red',
'white' => 'white',
'black' => 'black',
'blue' => 'blue',
'green' => 'green',
'yellow' => 'yellow',
'gray' => 'gray',
'khaki' => 'khaki',
'ivory' => 'ivory',
'beige' => 'beige',
'orange' => 'orange',
'cyan' => 'cyan',
'leopard' => 'leopard',
'camouflage' => 'camouflage',
'silver' => 'silver',
'pink' => 'pink',
'purple' => 'purple',
'brown' => 'brown',
'golden' => 'golden',
'leopard' => 'leopard',
'multicolor' => 'multicolor',
'white & blue' => 'White & Blue',
'white & black' => 'White & Black',
]
],
],
'my_size' => [
'dbtype'=> 'String',
'label' =>'My Size',
'name' =>'size',
'require' => 1,
'display' =>[
'type' =>'select',
'data' =>[
'S' => 'S',
'M' => 'M',
'L' => 'L',
'XL' => 'XL',
'XXL' => 'XXL',
'XXXL' => 'XXXL',
]
],
],
],
通過鏈接:https://fecshop.appfront.fancyecommerce.com/reindeer-pattern-glitter-christmas-dress
。您可以看到顏色是用圖片實現(xiàn)的,如果您想用圖片顯示,那么
您需要設置'showAsImg' => true
即可。
只能有一個custom_option屬性設置為true,如果多個設置為true,只有一個
有效,其他的會被忽略。
上面是屬性組里面的三種屬性類型,分別是:
spu_attr
general_attr
和 custom_options
,我們可以通過配置的方式添加多個屬性組,每一個屬性組包含上面
的三種屬性,譬如衣服裙子一個屬性組,電腦一個屬性組,手機一個屬性組
等等,
通過屬性組配置的方式可以很方便的擴展產品獨有的屬性,
在配置文件中配置好產品屬性組后,
在后臺
編輯產品的時候選擇相應的屬性組即可添加相應的屬性,對于屬性組里面的屬性,一旦編輯后
。盡量不要經(jīng)常的改動。
就是前端頁面?zhèn)葯诘漠a品過濾,如圖:
如何設置呢?
1、全局設置:首先打開配置文件
@appfront/config/fecshop_local_modules/Catalog.php
配置
return [
'catalog' => [
'params'=> [
###############################
## category部分設置 ##
###############################
'category_breadcrumbs' => false, # 是否顯示分類的面包屑導航。
/**
* 注意:做側欄分類產品過濾的屬性,必須是select類型的,其他的類型請不要用,
* 對于select類型,目前不支持多語言數(shù)據(jù)庫存儲,select類型的各個值是通過前端翻譯文件來實現(xiàn)翻譯的、
* 對于color size 對應的保存值,只可以使用 '數(shù)字','字符','空格','&','-','_' 這6類字符
*/
'category_filter_attr' =>[
'color','size',
],
'category_filter_category' => true,
'category_filter_price' => true,
category_filter_attr 就是配置分類側欄的產品屬性過濾,目前設置了color和size ,這里設置后是一個公用的設置,也就是所有的分類就默認為這兩個屬性的過濾。
category_filter_category
代表側欄是否顯示分類的過濾
category_filter_price
代表側欄是否顯示價格的過濾。
2、個性化設置
在上面設置的全局設置的基礎上,可以進行個性化設置,后臺打開分類,如圖:
分類產品過濾屬性:是在全局設置的基礎上添加一些新的產品屬性,用于分類側欄屬性過濾
分類產品非過濾屬性:是在全局設置的基礎上刪除一些產品屬性,譬如下面的圖中, 添加的是size,雖然在全局設置中添加了size,但是該分類添加了size,因此該 分類側欄的屬性過濾不會有size。
通過上面,我們可以很方便的添加產品在分類側欄的屬性過濾。
1.首先設置搜索語言,@common/config/fecshop_local_services/Search.php
1.1
return [
'search' => [
'filterAttr' => [
'color','size', # 在搜索頁面?zhèn)葯诘乃阉鬟^濾屬性字段
],
'childService' => [
'mongoSearch' => [
'searchIndexConfig' => [ #設置用于全文搜索的產品屬性以及權重,權重高的屬性,排名靠前。
'name' => 10, # 產品name作為full search text的屬性,權重為10
'description' => 5, # 產品description作為full search text的屬性,權重為5
],
# more: https://docs.mongodb.com/manual/reference/text-search-languages/#text-search-languages
'searchLang' => [
'en' => 'english',
'fr' => 'french',
'de' => 'german',
'es' => 'spanish',
'ru' => 'russian',
'pt' => 'portuguese',
],
],
'xunSearch' => [
'fuzzy' => true, # 是否開啟模糊查詢
'synonyms' => true, #是否開啟同義詞翻譯
'searchLang' => ['zh'],
],
],
]
];
1.1
filterAttr
是添加在搜索頁面?zhèn)葯谟糜谶^濾的產品屬性。
1.2
searchIndexConfig
是設置用于全文搜索的產品屬性以及權重,權重高的屬性,排名靠前。
1.3
searchLang
是設置搜索的語言,全文搜索是需要根據(jù)語言切詞的,
因此各個語言的搜索會略有差異,根據(jù)各個語言,生成對應的產品語言搜索表。
2.生成搜索表
首先需要根據(jù)上面的配置文件,設置您的所有的語言。也就是上面的searchLang
。
每一個語言對應一個產品搜索表,這是因為mongodb的full text search,一個表只能有一個 語言選項,因此需要生成多個產品搜索表,生成的腳本為:
@fecshop/shell/search/fullSearchSync.sh
,您進入@fecshop/shell/search下
執(zhí)行sh fullSearchSync.sh
即可。
產品的自定義屬性如圖:
1.1京東模式:類似于京東的產品,選擇每一個選項后,頁面會跳轉到另外一個url頁面, 也就是說:每一個選項就是一個產品(在數(shù)據(jù)庫產品表中是一行數(shù)據(jù))。
1.2淘寶模式:類似于淘寶商城的產品,選擇一個選項后,產品頁面不會跳轉。
2.1京東模式:這種模式,需要引入sku和spu的概念,關于這個概念在上面已經(jīng)說明。 譬如頁面(演示demo):http://fecshop.appfront.fancyecommerce.com/index.php/raglan-sleeves-letter-printed-crew-neck-sweatshirt-53386451-77774122
2.1.1配置:首先需要設置一個屬性組,上面的內容已經(jīng)說明,在配置文件中添加, 需要注意的spu屬性不能超過兩個(spu屬性組合的復雜性)。
2.1.2新建產品,選擇對應的屬性組,如圖
就可以查看到這個屬性組中的屬性,填寫值即可。
填寫sku和spu,需要注意的是,您新建的該款產品的spu必須相同,sku不同,一般用您的 spu+spu屬性的值組合成sku,如圖,我新建的spu對應的幾個sku產品。
2.1.3 按照上面如圖的方式配置完成后,基本就完成了配置,在前臺就可以看到了。
2.2淘寶模式,演示demo:http://fecshop.appfront.fancyecommerce.com/index.php/reindeer-pattern-glitter-christmas-dress-86519596
2.2.1配置:需要在屬性組里面配置 custom_options用戶自定義屬性
,這個在上面已經(jīng)
說明如何配置,您可以參考上面的說明中的文件中的例子進行修改。
2.2.2后臺編輯
在屬性組中添加了 custom_options用戶自定義屬性
,在新建產品的時候點擊添加,彈出產品編輯的彈框,
選擇相應的屬性組,然后點擊 “自定義信息”,如圖:
勾選,填寫各個屬性的值,以及選擇圖片,最后點擊+號圖標,就可以添加一行,
添加完了,保存,就可以到產品詳細頁面看了,譬如產品
http://fecshop.appfront.fancyecommerce.com/index.php/reindeer-pattern-glitter-christmas-dress-86519596
如果某些組合,您沒有添加,就會看到某些選項是虛線標示,如果沒有庫存,也會虛線標示。 對于該產品,產品sku的庫存會無效,產品自定義部分的庫存才是相應選項的庫存 ,當該產品被下單后,也是在該選項對應的qty部分減少產品的庫存,而不是sku的庫存(qty)
成本價格:代表產品的成本,也就是采購在fecshop中,只是記錄一下,沒有其他用處, 當然,您可以通過腳本,生成您的出售價格。
銷售價格:也就是產品在頁面顯示的價格
銷售特價:產品的特價,當設置了產品的特價,而且特價時間沒有過期,則特價是有效的, 當銷售特價有效時,銷售價格就會失效。
特價開始時間:產品銷售特價開始的時間
特檢結束時間:產品銷售特價結束的時間
Tier Price: 批發(fā)價格
規(guī)定產品購買幾個以上的價格。譬如購物2個以上17美元,購買4個以上16美元。
對于在產品分類頁面顯示的產品的幾個都是一個產品的價格。產品中有一個最終價格, 是通過腳本計算出來的,這個最終價格用于在分類頁面的價格排序以及價格過濾,該腳本一天跑一次。 文件為: @fecshop/shell/computeProductFinalPrice.sh, 可以在cron中配置該腳本一天跑一次。
目前后臺還沒有做這個功能。
更多建議: