윅스 (Wix) 코딩 - Wix 스토어(Stores)/쇼핑몰 "Product" 컬렉션 입력란(필드) (Wix Code: Wix Stores "Product" Collection Fields)
설명)
노트 :
계속하기 전에 윅스 앱 컬렉션(Wix App Collections) 작업하기를 읽었는지 확인합니다.
이 글에서는 Product 컬렉션의 입력란(필드)에 대해 설명합니다.
권한 (Permissions)
Product 컬렉션에는 다음 사용 권한이 있습니다.
- 읽기 (Read) : 누구나
- 생성 (Create) : 없음
- 업데이트 (Update) : 없음
- 삭제 (Delete) : 없음
Product 컬렉션의 권한은 변경할 수 없습니다.
입력란(필드) (Fields)
입력란(필드) 이름은 다음과 같이 입력란(필드) 키가 괄호 안에 나열된 각 섹션의 제목으로 나열됩니다. 예) Name (name).
입력란(필드)는 기본적으로 컬렉션에 나타나는 순서대로 이 문서에 나타납니다.
ID (_id)
설명 (Description) : 서버에서 만든 제품 ID (GUID). 이것은 시스템 입력란(필드)이며 기본적으로 숨겨져 있습니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : eq, ne, hasSome, contains, startsWith
읽기 전용 (Read-only) : 예
Name (name)
설명 (Description) : 제품의 이름.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 예
필터링 가능 (Can be filtered) : eq, ne, hasSome, contains, startsWith
읽기 전용 (Read-only) : 예
Description (description)
설명 (Description) : 서식있는 텍스트로 된 제품 설명.
유형 (Type) : 서식있는 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : eq, ne, hasSome, contains, startsWith
읽기 전용 (Read-only) : 예
MainMedia (mainMedia)
설명 (Description) : 이 제품의 기본 미디어 항목 (이미지 또는 비디오)이 저장 관리자에 나타나는대로 표시합니다.
유형 (Type) : 이미지
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니요
읽기 전용 (Read-only) : 예
MediaItems (mediaItems)
설명 (Description) : 이 제품에 사용할 수 있는 모든 미디어 항목을 JSON 객체 배열에 나열합니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 아니요
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니요
읽기 전용 (Read-only) : 예
{
type: "Image",
src: "wix:image://v1/68d3a9_1de7529c444b4c9eb38401f8efe0cad2.jpg/flowers.jpg/#originWidth=1970&originHeight=1120",
title: "title",
description: "whatever first line\nthe second line.",
link: "https://www.whatever.com"
}
{
type: "Video",
src: "wix:video://v1/11062b_03c50f8fe4a34cc297a984e483a282ef/simpsons.mov#posterUri=96fbec_52cd5b00f7fd48e0a83bc1fb1dfb06ea.jpg &posterWidth=1920&posterHeight=1080",
title: "title",
description: "whatever first line\nthe second line.",
link: "https://www.whatever.com",
thumbnail: "wix:image://v1/68d3a9_1de7529c444b4c9eb38401f8efe0cad2.jpg/flowers.jpg/#originWidth=1970&originHeight=1120"
}
SKU (sku)
설명 (Description) : 제품의 재고 보유 단위 번호.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
읽기 전용 (Read-only) : 예
Ribbons (ribbons)
설명 (Description) : 이 제품에 사용할 수 있는 리본을 JSON 객체 배열에 나열합니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 아니요
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니요
읽기 전용 (Read-only) : 예
[
{
"text": "ribbonName"
}
...
]
Currency (currency)
설명 (Description) : 제품의 통화입니다. 상점에는 하나의 통화만 있기 때문에 이 값은 모든 상품에서 동일합니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니요
읽기 전용 (Read-only) : 예
Price (price)
설명 (Description) : 제품 가격.
유형 (Type) : 숫자
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 예
필터링 가능 (Can be filtered) : eq, ne, hasSome, lt, lte, gt, gte
읽기 전용 (Read-only) : 예
DiscountedPrice (discountedPrice)
설명 (Description) : 할인 가격 (있는 경우). 할인이 구성되지 않으면 전체 가격이 표시됩니다
유형 (Type) : 숫자
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
FormattedPrice (formattedPrice)
설명 (Description) : 통화로 서식이 지정된 가격입니다 (예 : $ 20).
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
FormattedDiscountedPrice (formattedDiscountedPrice)
설명 (Description) : 통화로 서식이 지정된 할인 가격 (예 : $ 15).
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
TrackInventory (trackInventory)
설명 (Description) : 이 제품에 대한 재고 추적 여부를 나타냅니다.
유형 (Type) : 부울
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
InStock (inStock)
설명 (Description) : 제품 재고가 있는지 여부를 나타냅니다.
유형 (Type) : 부울
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
QuantityInStock (quantityInStock)
설명 (Description) : 현재 재고가 있는 품목 수입니다. "TrackInventory" 입력란(필드)가 "True"인 제품에만 해당됩니다.
유형 (Type) : 숫자
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
AdditionalInfoSections (additionalInfoSections)
설명 (Description) : 상점에 있는 추가 정보 섹션을 JSON 객체 배열에 표시합니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 아니요
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
[
{
"title": "PRODUCT INFO",
"description": "I'm a product detail."
},
...
]
ProductOptions (productOptions)
설명 (Description) : 정의된 제품 옵션 및 선택 사항을 JSON 객체 배열에 표시합니다. 또한 쉽게 쿼리하고 필터링할 수 있습니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 아니요
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
저장소에 정의한 제품 옵션을 기반으로 컬렉션에 연결된 Products 컬렉션 및 필터 데이터세트를 쿼 할 수 있습니다. 제품 옵션은 JSON 객체의 복잡한 배열에 저장됩니다. (아래 참조). 배열의 각 객체를 검색하는 대신 productOptions 입력란(필드), 제품 옵션 이름 및 해당 옵션에 사용할 수있는 선택 항목만 필요한 특수 구문을 사용할 수 있습니다. eq, ne, hasSome, hasAll 함수를 사용하여 이 입력란(필드)를 필터링할 수 있습니다.
예를 들어 'Size'라는 제품 옵션이 있는 경우 코드에서 productOptions.size.value를 사용할 수 있습니다. 'Color'이라는 제품 옵션이 있는 경우 productOptions.color.value를 사용합니다. 정의한 사용자 정의 옵션을 사용할 수도 있습니다. 사용하는 이름은 상점의 옵션 이름입니다.
// filter a dataset by color
import wixData from 'wix-data';
$w('#myDataset').setFilter(wixData.filter()
.hasSome('productOptions.color.value', ['#0000ff', ...])
)
// query the "Stores/Products" collection by color
import wixData from 'wix-data';
wixData.query('Stores/Products')
.hasSome('productOptions.color.value', ['#0000ff', ...])
.find()
.then(console.log)
JSON 객체의 배열 형식
{
"Option1":
{
"optionType": "color",
"name": "Option1",
"choices":
[
{
"value": "#0000ff",
"mainMedia": "missing-media.png",
"mediaItems": [],
"inStock": true,
"visible": true
}
]
...
},
"Option2":
{
"optionType": "drop_down",
"name": "Size",
"choices":
[
{
"value": "Large",
"mainMedia": "wix:image://v1/anImage.jpg/file.jpg#originWidth=1000&originHeight=1000",
"mediaItems":
[
{
"src": "wix:image://v1/anImage.jpg/file.jpg#originWidth=1000&originHeight=1000",
"description": "",
"title": "title",
"type": "Image"
},
...
]
"inStock": true,
"visible": true
},
...
]
}
}
ProductPageUrl (productPageUrl)
설명 (Description) : 사이트의 제품 페이지에 대한 URL을 표시합니다.
유형 (Type) : URL
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
ManageVariants (manageVariants)
설명 (Description) : 이 상점에 대해 제품 변형이 관리되는지 여부를 나타냅니다.
유형 (Type) : 부울
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
CustomTextFields (customTextFields)
설명 (Description) : JSON 객체 배열에 설정한 사용자 정의 입력란(필드)를 표시합니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 아니요
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니오
읽기 전용 (Read-only) : 예
[
{
"title": "custom text",
"maxLength": 500,
"mandatory": true
}
...
]
ProductType (productType)
설명 (Description) : 제품 유형 (물리적 또는 디지털)
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : eq, ne, hasSome, contains, startsWith
읽기 전용 (Read-only) : 예
Slug (slug)
설명 (Description) : 제품의 slug는 상점 전체에서 고유한 URL 친숙한 이름입니다.
유형 (Type) : 텍스트
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 예
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : eq, ne, hasSome, contains, startsWith
읽기 전용 (Read-only) : 예
Weight (weight)
설명 (Description) : 제품의 무게.
유형 (Type) : 숫자
데이터에 연결할 수 있음 (Can connect to data) : 예
동적 페이지 URL에서 사용할 수 있음 (Can use in dynamic page URL) : 아니요
정렬 가능 (Can be sorted) : 아니오
필터링 가능 (Can be filtered) : 아니요
읽기 전용 (Read-only) : 예
(collections.id)
"collections.id" 입력란(필드)는 상점의 각 제품에 대한 컬렉션 ID를 저장하는 숨겨진 입력란(필드)입니다. 이 입력란(필드)를 사용하여 Products 컬렉션을 쿼리하고 Products 컬렉션에 연결된 데이터세트를 필터링할 수 있습니다. eq, ne, hasSome, hasAll 함수를 사용하여 이 입력란(필드)를 필터링할 수 있습니다.
Collections 컬렉션의 "_id" 입력란(필드)에서 각 컬렉션의 ID를 찾을 수 있습니다. 표시하려면 "Visible fields"를 클릭해야할 수 있습니다. 셀을 마우스 오른쪽 버튼으로 클릭하여 ID를 복사할 수 있습니다.
// filter a dataset by collection ID
import wixData from 'wix-data';
$w('#myDataset').setFilter(wixData.filter()
.hasSome('collections.id', ['collectionID', ...])
)
// query the "Stores/Products" collection by collection ID
import wixData from 'wix-data';
wixData.query('Stores/Products')
.hasSome('collections.id', ['collectionID', ...])
.find()
.then(console.log)
노트 :
이 입력란(필드)는 데이터 관리자에서 볼 수 없으며 모든 요소에 연결할 수 없습니다.
관련 APIs
다음 APIs는 Products 컬렉션에서 데이터를 반환할 수 있습니다.
- wix-stores-backend
- $w.ProductPage
- $w.CartIcon
- getProductOptionsAvailability( )
연관된 토픽)
윅스 홈페이지 만들기 101
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index
윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index 윅스 (Wix.com) 윅스 ADI & 템플릿 (Wix ADI & 템플릿) 윅스 웹에디터 (Wix Editor) 윅스 코딩 (Wix Code - Corvid) 윅스 해커톤 (Wix Hackathon)
limejuicer.tistory.com
출처 :
https://support.wix.com/en/article/wix-code-wix-stores-product-collection-fields
댓글