Restaurant Website Template

Start with your own story

Open the preview above and look at the three pages. The home page leads with a large photo, a short story, three favourite dishes, guest reviews and a booking button. Most visitors want the menu, opening hours and a phone number within seconds, so keep those easy to find.

Edit in the right order

1. Name and details. Replace "Ember & Oak", the address, phone number and email. They appear in the header, footer and reservations page.
2. Photos. Replace the files in the images folder with your own, keeping the same names. Photos around 1200 pixels wide and under 200 KB each keep the pages fast. Good food photography near a window beats heavy editing.
3. Menu. Dishes are cards on the menu page, with an extra price list below. Update names, descriptions and prices, and remove sections you do not need.
4. Hours. Update the footer and the reservations page so they match.
5. Reviews. Use real quotes from guests who agreed to be quoted.

Reservations

The form collects name, contact details, date, time, party size and notes. Connect it to the service you use: a booking platform, an email-forwarding form tool or your own server. Add a clear note for large groups and allergies. Never collect more personal data than you need.

Colours and fonts

The warm amber palette and serif headings are set in src/input.css. Change the brand variables, then rebuild with npx @tailwindcss/cli -i src/input.css -o assets/tailwind.css --minify. System fonts keep the site quick.

Going live

Upload the folder to any static host, set a custom domain and add a Google Business Profile that links to it. Add an embedded map in the placeholder box on the reservations page. If you later need online ordering or table management, DEV3 can build it around this design.