Case study · Web
An Arabic-first storefront for a haircare and skincare brand,entered by the part of you it treats
Bobana sells personal care in Egypt — shampoos and conditioners, sunscreen and scrubs, masks and lotions — to customers who shop, read and complain in Arabic. The store was designed in Arabic first and built on WooCommerce, with the catalogue organised around hair, face and body rather than around the way a warehouse lists stock.
The brief
A catalogue that had to read in Arabic first
Most stores in this market are built in English and translated afterwards, and it shows in every line that wraps the wrong way. Bobana's customers start in Arabic, so the store had to as well — with English there for the people who want it, not the other way round.
What an Arabic ecommerce website has to get right
Right-to-left is not a stylesheet switch. Navigation, product layout, the quantity stepper, breadcrumbs and every arrow have to mirror, and the type has to stay readable at the sizes a product card actually uses.
- Arabic as the default, not a translation
- A layout that mirrors rather than flips
- Type sized for Arabic, not borrowed from Latin
Hair and skin are two different shopping trips
Someone treating dry ends and someone looking for a sunscreen are not browsing the same store. The catalogue needed to split cleanly by care area before it split by anything else.
- Hair, face and body as separate routes in
- Sub-categories that match the regimen
- One product able to sit in more than one place
People shop by concern, not by product name
Nobody searches for a surfactant. They search for dry hair, hair loss, pigmentation, an oily T-zone. The structure had to let a concern lead to a product without the customer knowing the range.
- Browse by concern, not by SKU
- Category pages that explain themselves
- Related products on every page
A first order that survives a phone screen
Most of this audience arrives on a phone, often from social. Price, quantity and add-to-cart had to be reachable without a pinch or a scroll hunt, in Arabic, on a mid-range handset.
- Phone-first product pages
- Price and basket always in reach
- A cart total visible from every page
What we built
How we built an Arabic ecommerce website on WooCommerce
A WordPress and WooCommerce storefront, designed and developed end to end — the storefront, the catalogue structure, the product template and the content pages around them.
Why WooCommerce carried the catalogue
The structure was the hard part here, and WooCommerce leaves categories, tags and attributes entirely under the owner's control — no platform deciding what a beauty catalogue is allowed to look like.
- Full control of categories and tags
- Content and commerce in one place
- No per-sale platform fee
Categories built around care areas
Face care, body care and hair each got their own branch, with the sub-categories a customer would recognise — cleansers, masks, scrubs, sun protection, creams — sitting beneath them in the shop sidebar.
- A sidebar that reads like a shelf
- Sub-categories named for the product, not the system
- Tags for ingredients and ranges
Product pages that answer before the basket
Each product page carries the price in Egyptian pounds, the description the brand wants read, the categories and ingredient tags it belongs to, a share row, and the related products that finish the routine.
- Price, quantity and add-to-cart together
- Categories and tags on every product
- Related products under each one
Arabic by default, English on a switch
The same catalogue, reachable in either language from the header, so a customer who prefers English is not sent to a second, thinner version of the shop.
- One catalogue, two languages
- A switch in the header, not a separate site
- Both languages maintained from one admin
After launch
A store the brand's own team could run
The measure of a build like this is what happens the week after it goes live, when a new product arrives and nobody wants to email an agency about it.
Adding a product without calling a developer
Products, prices, categories and tags are all editable from the WordPress admin, so the team adds a new launch the same way they would write a post.
- Products added by the brand's team
- Prices and stock under their control
- No code change for a new range
A blog that sits inside the store
Advice and routine content lives on the same site as the products it talks about, so a post about dry scalp can point straight at the shampoo rather than at a link in a bio.
- Blog and shop on one domain
- Posts that link into the catalogue
- Content the team writes itself
Proof that other people are buying
Recent-purchase notifications surface real orders as they happen — the online equivalent of a shop that visibly has customers in it.
- Live purchase notifications
- Social proof without invented reviews
- Dismissible on mobile
Handed over, not held hostage
The site, the admin and the content were handed to Bobana at the end of the build. Nothing about the store depends on us still being in the room.
- Full ownership at handover
- Standard WordPress, not a locked theme
- Any developer can pick it up
Related:all case studieshow we build websitesanother ecommerce build
How it ran
From catalogue to launch
Map the catalogue before designing it
Every product against care area, type and concern, so the navigation could be decided from what was actually being sold rather than from a template.
Design in Arabic, not translate into it
Home, shop, category and product templates drawn right-to-left from the first screen, with English derived from them rather than the reverse.
Build it on WooCommerce
Storefront, catalogue structure, product template and the content pages around them, developed as one system and tested on the phones this audience actually uses.
Hand over the keys
The brand's team walked through adding a product, editing a category and publishing a post before launch, and left owning all three.
FAQ
Frequently asked questions
How do you build an Arabic ecommerce website?
By designing it in Arabic from the first screen instead of translating an English layout. The page mirrors right-to-left, the navigation and product templates are drawn that way, and the type is sized for Arabic rather than inherited from a Latin theme. English is then derived from the same catalogue, so both languages stay one store.
Is WooCommerce a good platform for a skincare brand?
It is a strong fit when the catalogue is the complicated part, which in skincare it usually is. Categories, tags and attributes stay under the owner's control, content and commerce live on one site, and there is no per-sale platform fee. For Bobana that control over structure is exactly what the brand needed.
How do you organise a beauty product catalogue?
Split it by care area first — hair, face, body — then by the sub-category a customer would recognise, such as cleansers, masks, scrubs or sun protection. Ingredients and ranges work better as tags than as categories, because one product often belongs to several of them.
How do you design an RTL store layout?
Mirror the layout rather than flip it. Navigation, breadcrumbs, arrows, the quantity stepper and the basket all move to the other side, numbers and Latin product names stay left-to-right inside Arabic sentences, and every icon that implies direction is redrawn rather than rotated.
Should an Arabic store also have an English version?
Usually yes, but as the same store rather than a second one. A switch in the header on one catalogue keeps prices, stock and product data identical in both languages. A separate English site drifts within a season and customers end up seeing two different shops.
How long does it take to build an online store?
The build is rarely the long part — mapping the catalogue is. Once the structure, the templates and the product data are settled, a store like Bobana's is a matter of weeks. What stretches a timeline is product content arriving late, not development.
Who owns the online store after launch?
The client does. Bobana was handed the site, the admin and the content at the end of the build, on standard WordPress and WooCommerce, so any developer can pick it up. We do not hold a store hostage to keep a retainer alive.
How do product pages sell a personal care product?
By answering the question that brought the customer there before asking for the basket. Price and quantity sit with the add-to-cart button, the description says what the product does, categories and ingredient tags place it in the range, and related products finish the routine.
Can a shop team add products without a developer?
Yes. Products, prices, categories and tags are edited from the WordPress admin, and the team walked through adding a product and editing a category before launch. A new range needs no code change and no agency ticket.
What does it cost to build an online store in Egypt?
It depends far more on the catalogue than on the page count: how many products, how many ways in, and how much of the content already exists. Our pricing page sets out how we scope and quote that, and a short call is usually enough to place a project within it.