Skip to content
Anton GoncharovAI systems developer
RUEN

WordPress and WooCommerce · runs in the browser

WordPress clothing store

Clothes are returned most often because of size. So here the size is found with two questions — height and weight — right on the product page and is immediately selected in the purchase form, accounting for color and stock. The monochrome block theme with huge typography and a strict grid was written from scratch, and the whole store runs in your browser.

Scenario: Kontur — fictional — makes basic clothing in black, white and gray in Ivanovo: T-shirts, hoodies, trousers, a jacket and a coat, with delivery across Russia and fitting at a CDEK pickup point.

Demo screenshot: WordPress clothing store

Open the demo

Open the app

WordPress starts in the browser in 5–10 seconds: the first time it downloads about 17 MB, then it loads from cache. Best on a computer: next to the store are hints on what to try and a “Storefront / Admin” switch.

The app runs in your browser: nothing is sent to a server.

What the demo shows

  • A custom brutalist block theme: huge typography, a grid of two-pixel lines, a marquee, mobile-friendly

  • Size and color as buttons instead of drop-downs, each color with its own photo; an out-of-stock size is struck through, and with one or two left it says “1 left”

  • A size finder by height and weight: two questions in a window on the product page — the size is selected in the purchase form and the row in the measurement table is highlighted

  • The finder accounts for the selected color: if that size isn’t available in it, it says so honestly

  • Size charts for tops and bottoms and a “How to measure” page

  • Catalog filters by size, color, fit and material — with an item counter for each value

  • Instant search on “/”, favorites with their own page, quick view with size and color buttons, reviews with ratings

  • A “to free delivery” bar, the KONTUR15 promo code, a header that inverts on scroll and curtain-style page transitions

  • The consultant answers about sizes, fitting, returns and fabric care

  • CDEK delivery with fitting and Russian Post, YooKassa-style payment, one-click orders — plugins shared with the coffee and electronics stores

How to try it

  1. Find your size

    Open the “Beton” hoodie, choose a color and press “Find my size”: height 173–180 cm, weight 76–88 kg — size L is selected in the form.

  2. Check availability

    The “Gray melange” hoodie is out of XL: the button is struck through, and the size finder says it isn’t available in this color.

  3. Filter the catalog

    “Catalog”: tick the color “Graphite” and size XS — only items made in that size and color remain.

  4. Ask the consultant

    The chat button at the bottom right: “how do I choose a size?” or “how do I wash a hoodie?”.

No paid neural networks

The store runs without a server and without a neural network: WordPress Playground runs PHP and an SQLite database in your browser, and external requests are disabled. The size finder is a real WooCommerce quiz plugin with scores by height and weight, and the consultant answers by searching the catalog and the store’s FAQs. In a production project the same code runs on hosting, stock comes from the warehouse, and the consultant calls a language model.

The demo runs without OpenAI, YandexGPT or GigaChat API keys. Wherever a production system calls a model, there’s a local stub with the same interface — so the demo is free, always available and never makes things up.

What a production project adds

  • Hosting with PHP and MySQL, page and filter caching, photos via CDN
  • Stock by size and color from 1C or MoySklad on a schedule
  • Size charts and fit rules for each model, return statistics by size
  • The CDEK API with fitting and partial purchase, YooKassa or T-Bank with fiscal receipts under 54-FZ
  • Export to Wildberries, Ozon and Yandex Market

Stack

  • WordPress
  • WooCommerce
  • PHP 8.3
  • Block theme
  • Custom quiz plugin
  • Custom storefront plugin
  • WordPress Playground
  • WebAssembly
  • SQLite

Developer’s comment

Anton Goncharov

AI systems developer · Python

For business

  • Size selection by height and weight helps reduce returns — the main pain of clothing stores.
  • Size and color are buttons, and unavailable sizes are crossed out: buyers don’t discover it in the cart.
  • The assistant answers questions about sizes, fitting and care — fewer support requests.

For developers

  • Size selection is the quiz plugin in “for a product” mode: points for height and weight pick the variation in the form, taking color and stock into account.
  • Size and color buttons work on top of the standard WooCommerce variation form, so the cart and stock behave as usual.
  • The monochrome block theme is custom; the delivery, payment and storefront plugins are shared with the other stores: the theme changes only CSS variables.

Tips

  • Tip 01

    Don’t replace the variation form with your own — improve it: that way other plugins and updates won’t break.

  • Tip 02

    Collect return statistics by size: they’ll show where the size chart is wrong.

Want the same for your business?

Tell me about your task — I’ll tell you what from the demo fits, how long it will take and what I’ll need from you.

Message me on TelegramSend a request

Other demos in this section

All demos

  • WordPress and WooCommerce · runs in the browser

    live

    WordPress coffee store

    A live WooCommerce store: 15 products and 70 variations, a selection quiz, instant search, favorites and quick view, reviews and promo codes, CDEK and Russian Post delivery by postcode, YooKassa-style payment, company purchases with tax ID validation and one-click orders. WordPress runs right in the browser — you can place an order and go into the admin panel.

    • WordPress
    • PHP

  • WordPress and WooCommerce · runs in the browser

    live

    WordPress electronics store

    A WooCommerce store of routers, speakers and smart home devices: specification filters with counters, product comparison, stock and “on order” lead times, instant search, favorites and quick view, reviews and promo codes, a router selection quiz and a catalog consultant. WordPress runs right in the browser — you can place an order and go into the admin panel.

    • WordPress
    • PHP