1. Docs
2. Guides
3. E-Commerce

E-Commerce 1.2.0 beta

VelinStyle auf Storefront- und Checkout-Seiten laden, Theme-Tokens ?berschreiben und vor dem Go-live PII-sensitive Scans ausf?hren. English: E-commerce

Wann nutzen

• Follow this guide when integrating or extending VelinStyle (E-commerce).
• Pin @birdapi/velinstyle@1.2.0 and check maturity badges for beta surfaces.

Wann nicht

• Beta-Plan/Review/Meta nicht als fertiges KI-Design-System behandeln.
• Keine noch geplanten Studio- oder Utility-Engine-APIs erfinden.

Gemeinsame Praktiken

• Ship velinstyle.min.css + velinstyle-components.iife.js (or @birdapi/velinstyle/runtime for tree-shaking).
• Use <velin-persist> for multi-step checkout drafts (never persist card data).
• Run npx velinstyle scan --only pii on theme assets before release.
• Product UI: <velin-rating>, <velin-counter>, <velin-search> for catalog search.

WordPress + WooCommerce

See WordPress guide for enqueue basics. In WooCommerce, hook wp_enqueue_scripts with priority after WooCommerce styles if you replace its layout utilities. Override checkout fields with VelinStyle form classes; scan checkout templates for hardcoded emails.

Shopify (Theme 2.0)

Add CSS/JS in layout/theme.liquid via asset_url (upload built files to assets/) or a build pipeline that copies into the theme. Avoid inline scripts — Shopify CSP blocks many patterns the scanner flags. Use section settings for theme token overrides (--velin-color-primary).

Magento 2

Place static files under app/design/frontend/…/web/, reference via requirejs-config.js or layout XML. Run bin/magento setup:static-content:deploy after updates.

PrestaShop

Copy assets to themes/<name>/assets/ and register in theme.yml or Smarty {block name='stylesheets'}. Clear CCC cache.

Shopware 6

Register storefront assets in Resources/app/storefront/src/main.js and compile with Shopware's build, or inject via theme.json.