Theme & Coming Soon
Pick your site theme and configure the Coming Soon landing page.
Site Theme
Switches the entire site's colour palette and typography — including the Coming Soon page.
Hides the full site and shows only the Coming Soon screen.
Custom Message
Displayed below the Coming Soon headline. Leave blank to hide.
Coming Soon Page Text
Customise the main headline and tagline shown on the coming soon page.
Section Visibility
Control which sections appear on the main site.
The three feature cards below the hero.
The full-width coloured call-to-action band.
Accessible Pages
Pages that remain accessible even when Coming Soon mode is active.
Allow visitors to open /chat.html while Coming Soon is on.
Coming Soon Image
Upload an image to display on the Coming Soon page. Drag it to reposition and use the slider to resize — just like moving a layer.
Online Ordering
Configure pickup, delivery, OTP verification, and webhooks.
Adds Add to Cart buttons and a checkout flow to the menu.
Pickup Settings
Show delivery option in checkout.
Delivery Area
Click on the map to set your store location. The green circle shows the delivery radius.
Delivery Pricing
OTP Verification
OTP code shown on screen (testing only — not secure for production).
POST body: {action:"send_otp",phone:"..."} or {action:"verify_otp",phone:"...",code:"..."}
Appearance
Customise the hero, logo, background, and emoji animations.
Hero Section
Customise the headline, tagline and optional feature image shown above the title.
Feature Image
Optional image shown above the hero title. Stored in your browser.
Custom Logo
Upload a PNG, SVG, JPG or WEBP. Stored locally in your browser (max 2 MB).
Hero Background
Gradient presets, solid colour, or upload your own image.
Preset Gradients
Solid Colour
Upload Background Image
Recommended: at least 1400 × 800 px.
Click to select an image
Slow-flowing fruit, coffee & tea emojis floating in the background.
Tip: animation only displays when the Premium Bronze theme is active.
Chat
Real-time customer chat, powered by Firebase Realtime Database (free tier).
Allow customers to open the Chat page from the site header.
Moderator Access
Enter the chat as a moderator to delete messages, create or delete rooms, and block / unblock users by device.
Enter Chat as ModeratorFirebase Setup
Chat requires a free Firebase Realtime Database project for multi-device real-time messaging.
- Go to console.firebase.google.com and create a project.
- Click Build → Realtime Database → Create database.
- Choose Start in test mode (allows public read/write).
- Go to Project Settings → Your apps, add a Web app, copy the config object.
- Paste the config JSON below and click Save & Connect.
Chat Rooms
Click a room to view its full chat log.
Configure Firebase above to view rooms.
Settings
Manage admin password and site settings.
Currency
Displayed next to prices on the menu (e.g. EGP / ج.م).
Change Admin Password
After changing, you will be logged out and need to log in again.
Danger Zone
This will clear ALL site data including menu items, background, and Coming Soon settings. This cannot be undone.
Location Page
Customize the public location page (Google Maps link, satellite preview, photo gallery).
Page visibility
Pill button label (Coming Soon page)
Shown below the chat link on the Coming Soon page.
Google Maps “Go” button
Paste any Google Maps share link (the long https://maps.app.goo.gl/… or https://www.google.com/maps/… URL). Leave blank to use the store coordinates from the Orders tab.
Satellite preview
Coordinates are taken from Orders → Delivery Area (Store Latitude / Longitude).
Photo gallery
Add image URLs (e.g. uploaded to imgur, postimages, or your own hosting). Each image's width and alignment can be customized.
Reviews
Approve which reviews are shown on the public reviews page.
Page visibility
All reviews
Toggle which reviews appear in the public cycling display. Delete spam or illegitimate ones.
Support tickets
Messages from the public Support page. Submitted via Netlify Forms (which emails them to you) and saved here for record-keeping.
Page visibility
This is just a reference — set the actual delivery address in your Netlify dashboard → Forms → Notifications.