Suhail Restaurant
Restaurant ordering site for the Suhail brand under Mira Group. WooCommerce checkout, Stripe payment, custom Elementor blocks for menu and reservations, mobile-first.
About the project.
Suhail is a restaurant brand under Mira Group, and the site is where their guests browse the menu, book a table, and place pickup orders. I built it on WordPress with WooCommerce for the order flow and Stripe for payment, then wrote custom Elementor blocks so the menu and reservations sections stay on-brand without third-party plugins. The whole site was designed mobile-first because most diners reach it from their phone the moment they decide where to eat.
What changed.
increase in average order value
Largest Contentful Paint
What we walked into.
A restaurant under Mira Group needed an ordering site that worked on the phones diners actually use — fast, on-brand, and integrated with Stripe for pickup orders. The constraint was WordPress + WooCommerce (chosen before I joined).
What we did.
WordPress base, WooCommerce for the order flow, Stripe for payment, custom Elementor blocks for menu + reservations so the brand survived without third-party plugin sprawl.
What it became.
Mobile-first ordering live, brand-consistent menu blocks, Stripe checkout with pickup-only fulfilment.
My role on this project.
Solo · WordPress + WooCommerce build. Stack constraint was set by the client before I joined. My ownership: custom Elementor blocks (PHP + CSS), WooCommerce config, Stripe integration, mobile-first design pass.
WordPress engineer
Custom theme child of Astra. Hand-coded Elementor widgets for menu + reservation blocks. No premium plugins for core features.
WooCommerce integrator
Pickup-only fulfilment (no shipping), Stripe payment gateway, custom email templates.
Designer (mobile-first)
Mobile-first design pass — most diners reach the site from a phone the moment they decide where to eat.
The numbers that matter.
- <2s4G load · homeWordPress with image optimisation + caching; honest about being a CMS.
- Mobile-firstDesign target70%+ of restaurant traffic is mobile; layout primes for the small viewport.
- StripePayment integrationPCI burden stays with Stripe; site never touches card details.
- 0Premium pluginsNo paid Elementor Pro / WooCommerce extensions — built custom blocks instead.
What was actually broken.
Most restaurant sites are template sprawl: 20 plugins, slow on mobile, broken under their own weight within 6 months. Mira Group wanted a site that survived the next theme update + WooCommerce version bump without falling over. The constraint (WordPress) was set by their existing IT setup — the brief was to make it work well within that constraint.
The hard surface area.
- 01Custom Elementor widgets that survive Elementor major version bumps.
- 02Mobile-first menu layout that respects long Arabic dish names without breaking layout.
- 03Stripe integration with pickup-only fulfilment (no shipping address required).
Engineering wins worth naming.
Elementor widget API forward compatibility
Built widgets against the documented `Widget_Base` class only — no internal API access. Survived two Elementor major version bumps without rework.
Arabic dish names breaking grid
CSS Grid with `auto-fit` and `minmax` + `text-wrap: balance` for menu cards. Long names wrap cleanly without forcing the grid to a different column count.
How the system is wired.
Hosting + CDN
Application tier
Data tier
The decisions behind each choice.
WordPress (constraint)
- Client's existing IT runs WordPress. Migrating would add cost without changing the outcome for diners.
- WooCommerce is mature enough to handle pickup-only food ordering without custom payment plumbing.
Custom widgets over premium plugins
- Premium plugins lock you to a vendor's release cadence. Custom widgets ship when the client needs them.
- No recurring licence fees on the site itself.
What the build taught us.
- Constraints chosen by the client are usually for non-technical reasons — respect them. The right answer is to make the chosen stack work well, not to argue for a different stack.
- Custom widgets against documented APIs survive version bumps; widgets against internal APIs do not.