react_size_chart

Smart size chart by Vestofy for apparel, include size chart and size recommender. Please note: Size charts currently can be created only on 'Size Chart Maker | Vestofy' iOS/Mac app.

Features

• Customizable 'Size guide' button
• Popup dialog size guide
• Size chart unit coversion (Metric, Imperial)
• Size recommender with automatic body size prediction by age, height and weight.
• Exact size match according to shoppers own garment dimension (Measured by Vestofy mobile app).

Installation

  npm install react_size_chart

Getting started

1. Download 'Size Chart Maker | Vestofy' app from iOS/Mac AppStore here.
2. Currently size charts creation a availible via iOS/Mac and Shopify only.
3. Follow the instruction on the app.
4. Click the '</>' button for Size chart/Product/Collection to retrieve required prop's.
5. Example code:

import {Vestofy} from 'react_size_chart';

/*Single size chart*/
<Vestofy shop={YOUR_SHOP_ID} size_chart_id={SIZE_CHART_ID}/>

/*Product size charts*/
<Vestofy shop={YOUR_SHOP_ID} product_id={PRODUCT_ID}/>

/*Collection of products size chart*/
<Vestofy shop={YOUR_SHOP_ID} collection_id={COLLECTION_ID}/>

API Reference

| prop | Type | Default value | | :-------- | :------- | :------------------------- | | shop (Required) | string | Parameter from app | | size_chart_id | string | Size chart identifier (mutually exclusive: product_id, collection_id)| | product_id | string | Product identifier (mutually exclusive: size_chart_id, collection_id) | | collection_id | string | Collection identifier (mutually exclusive: size_chart_id, product_id) | | ButtonText | string | 'Fitting Room'| | ButtonTextSize | number | 15 | | ButtonTextColor | string | '#000000' | | ButtonBackgroundColor | string | '#FF000000' | | DialogTitle | string | 'Size Guide' | | ButtonImgSrc | string | meter_icon | | locale | string | en (default), ar, es, he, pt, ru, zh | | btnAlign | enum | eAlignLeft | | border | object | No border | | dev | boolean | false |

Keywords

size chart guide recommender fitting vestofy maker

License

MIT

Feedback

If you have any feedback, please reach out to us at [email protected]

Supported by

Vestofy