Overview
Product Anywhere lets shop owners surface and sell Phoenix Cart products dynamically on any page - inside the store, on a CMS page, in blog content, or on an entirely external site - using a single embeddable tag instead of a fixed category/product-page template.
<product-preview data-id="123"></product-preview>
<script src="https://yourshop.com/shop/embed.js" defer></script>Phoenix Cart resolves the product context server-side and renders it consistently wherever the tag appears, so merchandising is decoupled from catalogue structure - products become portable components you can drop in anywhere.
Thanks to the Code Co-op community's ideas, testing and review.
Under the hood
- Shadow DOM encapsulation keeps embedded product markup and styles isolated from the host page, so Product Anywhere won't clash with the surrounding site's CSS.
- Lazy-loading via
IntersectionObservermeans embeds only fetch product data once they're actually in view. - A concurrency-limited fetch queue prevents pages with many embeds from hammering the shop's API all at once.
- Referrer-based UTM attribution and server-side click tracking give shop owners visibility into where embedded-product traffic and conversions are actually coming from.
Self-serve embeds
Users can generate the embed snippet for any product directly from the product page, without hand-writing the tag or looking up IDs manually.