Product ID
Div Block
Shopyflow Component
class-name
Attribute Value
sf-attribute
sf-attribute
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Sub Product
Sub-product identifying container.
Attribute Name
sf-product + sf-sub-product
Attribute Value
True or 1
1 or True
required
Product Container
Product identifying container
Attribute Name
sf-product
Attribute Value
True or 1
{Shopify Product ID}
Add to Cart Button
Add to cart button
Attribute Name
sf-add-to-cart
Attribute Value
True or 1
Option Selector(Select input)
Variant option selector input.
Attribute Name
sf-change-option
Attribute Value
True or 1
{Variant Option Name}
Custom Option Wrapper
Variant option selector container.
Attribute Name
sf-change-option
Attribute Value
True or 1
{Variant Option Name}
Custom Option Value
Variant option selector button.
Attribute Name
sf-option-value
Attribute Value
True or 1
{Option Value}
Option Displayer
Selected variant option displayer for the specified option group.
Attribute Name
sf-show-option
Attribute Value
True or 1
{Variant Option Name}
Options Displayer
Selected variant options combination displayer.
Attribute Name
sf-show-options
Attribute Value
True or 1
Quantity Changer (Input)
Quantity changer input
Attribute Name
sf-change-quantity
Attribute Value
True or 1
Quantity Increaser
Quantity increaser button
Attribute Name
sf-change-quantity-inc
Attribute Value
True or 1
Quantity Decreaser
Quantity decreaser button
Attribute Name
sf-change-quantity-dec
Attribute Value
True or 1
Quantity Displayer
Selected quantity displayer
Attribute Name
sf-show-quantity
Attribute Value
True or 1
Product Image
Dynamic Product Image displayer.
Attribute Name
sf-show-image
Attribute Value
True or 1
Thumbnails
Clickable product Image changing thumnails.
Attribute Name
sf-change-image
Attribute Value
True or 1
Price
Dynamic price displayer
Attribute Name
sf-show-price
Attribute Value
True or 1
True or 1
with-quantity
with-sub-product
all
Compare Price
Dynamic compare price displayer
Attribute Name
sf-show-compare-price
Attribute Value
True or 1
True or 1
with-quantity
with-sub-product
all
SKU
Dynamic SKU displayer
Attribute Name
sf-show-sku
Attribute Value
True or 1
Vendor
Vendor displayer
Attribute Name
sf-show-vendor
Attribute Value
True or 1
Stock
Dynamic Stock Displayer
Attribute Name
sf-show-stock
Attribute Value
True or 1
Product Title
Product Title Displayer
Attribute Name
sf-show-title
Attribute Value
True or 1
Product Note Input
Product note changer input
Attribute Name
sf-change-product-note
Attribute Value
True or 1
Note Title
1
True
Product Description
Product description displayer
Attribute Name
sf-show-desc
Attribute Value
True or 1
Purchase Option Selector Container
Purchase option selector container.
Attribute Name
sf-change-purchase-option
Attribute Value
True or 1
Purchase Option Value
Purchase option selector button.
Attribute Name
sf-purchase-option-value
Attribute Value
True or 1
recurring
single
Selling Plan Value
Variant option selector button.
Attribute Name
sf-selling-plan-value
Attribute Value
True or 1
{Selling Plan ID} (added automatically)
Selling Plan Selector Contaier
Purchase option selector container.
Attribute Name
sf-change-selling-plan
Attribute Value
True or 1
Unavailable variant option state
Customise the unavailable state of Custom Option Value
Attribute Name
sf-option-unavailable
Attribute Value
True or 1
Active Variant Option State
How to customise the selected state of Custom Option Value
Attribute Name
sf-active
Attribute Value
True or 1
Out of stock state
Customise the out of stock state of the Add to Cart Button
Attribute Name
sf-out-of-stock
Attribute Value
True or 1
Stock exceeded state
Customise the exceeding stock state of the Add to Cart Button
Attribute Name
sf-stock-exceeded
Attribute Value
True or 1
Sub Product Added State
Customise the Sub-product components look when it’s staged.
Attribute Name
sf-sub-product-added
Attribute Value
True or 1
Async visibility
Hide the component until Storesynk finishes loading.
Attribute Name
sf-await
Attribute Value
True or 1
Active Thumbnail state
Customise the look of the active Thumbnail
Attribute Name
sf-active-thumbnail
Attribute Value
True or 1
Sale Value
Displays the sale value of the current variant. Sale value is a Text Block with the sf-sale-value attribute.
Attribute Name
sf-sale-value
Attribute Value
True or 1
percentage
amount
Sale Tag
Displays the sale tag of the current variant. Sale value is a container element with the sf-show-sale attribute.
Attribute Name
sf-show-sale
Attribute Value
True or 1
1
true
Product Type
Dynamic Product Type Displayer
Attribute Name
sf-show-product-type
Attribute Value
True or 1
Loading state
Customise the loading state of the Add to Cart Button
Attribute Name
sf-loading
Attribute Value
True or 1
Active Filter Value State
How to customise the selected state of Filter Value
Attribute Name
sf-active
Attribute Value
True or 1
Product Metafield Displayer
Product metafield displayer
Attribute Name
sf-show-metafield
Attribute Value
True or 1
{Product Metafield Key}
Metafield Wrapper
Metafield wrapper
Attribute Name
sf-metafield-wrapper
Attribute Value
True or 1
Metafield Namespace Changer
Metafield namespace changer for the metafield displayer element
Attribute Name
sf-change-metafield-namespace
Attribute Value
True or 1
{Namespace}
Product Search Input
Product name collecting input
Attribute Name
sf-search-input
Attribute Value
True or 1
Thumbnail Wrapper
Wrapper element for thumnails
Attribute Name
sf-thumbnail-wrapper
Attribute Value
True or 1
Barcode
Dynamic barcode displayer
Attribute Name
sf-show-barcode
Attribute Value
True or 1
Gift Card Form Container
Outer wrapper element for the gift card form
Attribute Name
sf-gift-form
Attribute Value
True or 1
Filter Unavailable State
How to customise the unavailable state of the Filter Value and the parent Filter Group
Attribute Name
sf-filter-unavailable
Attribute Value
True or 1
Price Range: Min Price
Dynamic minimum variant price displayer
Attribute Name
sf-show-min-price
Attribute Value
True or 1
True or 1
Price Range: Max Price
Dynamic maximum variant price displayer
Attribute Name
sf-show-max-price
Attribute Value
True or 1
True or 1
Price Range: Min Compare Price
Dynamic minimum variant price displayer
Attribute Name
sf-show-min-compare-price
Attribute Value
True or 1
True or 1
Price Range: Max Compare Price
Dynamic maximum variant price displayer
Attribute Name
sf-show-max-compare-price
Attribute Value
True or 1
True or 1
Unit Price
Product unit price displayer.
Attribute Name
sf-show-unit-price
Attribute Value
True or 1
Option unavailable state (add to cart button)
Customise the option unavailable state of the Add to Cart Button
Attribute Name
sf-option-unavailable
Attribute Value
True or 1
Out of stock variant option state
Customise the unavailable state of Custom Option Value
Attribute Name
sf-out-of-stock
Attribute Value
True or 1
File Uploader
File upload module for product customization
Attribute Name
sf-file-uploader
Attribute Value
True or 1
Drop Zone
Drag and drop area for file uploads
Attribute Name
sf-drop-zone
Attribute Value
True or 1
Add File Button
Button to trigger file selection
Attribute Name
sf-add-file
Attribute Value
True or 1
File Preview List
Looping container for uploaded file previews
Attribute Name
sf-preview-list
Attribute Value
True or 1
File Preview Item
Individual file preview item template
Attribute Name
sf-preview-item
Attribute Value
True or 1
Preview Image
Displays thumbnail preview of uploaded file
Attribute Name
sf-preview-image
Attribute Value
True or 1
Preview Item Remover
Button to remove uploaded file from preview
Attribute Name
sf-preview-item-remove
Attribute Value
True or 1
Smart Option Selector
Variant option selector to pass simple info to cart and to order
Attribute Name
sf-smart-change-option
Attribute Value
True or 1
{Option Name}
Smart Option Value
Smart variant option selector button
Attribute Name
sf-smart-option-value
Attribute Value
True or 1
{Option Value}
Error State
Customises the error state of eligible components
Attribute Name
sf-error
Attribute Value
True or 1
Request a Quote Form
Customer quote request form for products
Attribute Name
sf-request-quote-form
Attribute Value
True or 1
Request Quote First Name Field
First name input field
Attribute Name
sf-firstname
Attribute Value
True or 1
Request Quote Email Field
Email address input field
Attribute Name
sf-email
Attribute Value
True or 1
Request Quote Note Field
Multi-line note input field
Attribute Name
sf-note
Attribute Value
True or 1
Request Quote Form Submit Button
Form submit button
Attribute Name
sf-submit
Attribute Value
True or 1
