Selldone GenesisBusiness templates

Genesis business template Accommodation and booking

Launch a branded booking business on Selldone—with AI.

Lodera shows how an AI agent can turn one connected Selldone shop into a responsive booking storefront, checkout, and operator workspace—then publish it on your domain.

Build this with AI Live storefront
Customer experienceOpen the live Lodera site Partner experienceOpen the Lodera partner panel Base starter · not Lodera sourceOpen the base GitHub repository
booking.selldone.shop Live
Lodera live storefront preview
Accommodation storefront, built on Selldone Real shop data. Custom front end.
MCPAgent-ready workflow AAContrast checked 4×Responsive breakpoints 1Connected commerce engine

Everything needed to discover, transact, and operate stays connected.

Customer journeys and operator workflows share the same Selldone catalog, pricing, customers, and orders.

01

Live property search, filters, sorting, currency switching, and map discovery

02

Dynamic property detail pages backed by Selldone listing records

03

Room types, occupancy, nightly and total rates, cancellation, meals, and facilities

04

Responsive layouts for phone, tablet, laptop, and desktop

05

Multi-step booking checkout with conditional guest fields and a running price summary

06

Partner dashboard for arrivals, departures, occupancy, revenue, reviews, and notifications

See one connected business in action.

01

The property page

Photo gallery with lightbox, guest reviews, location panel, house rules, and a booking widget, all laid out from the property's own record.

02

Rooms, rates and facilities

Room types with occupancy, per-night and total pricing, cancellation and meal options, and a full facilities breakdown, all drawn from the shop.

03

The booking flow

A multi-step funnel that carries the selection through to payment, with conditional forms, a complete country list, and a running price summary.

04

The operator's view

A partner dashboard on the same data, covering arrivals and departures, occupancy and revenue, review and message queues, notifications, and a full navigation structure.

One connected build

From shop data to a live business experience.

AI works through Selldone MCP, turns approved business data into the experience, then prepares a reviewable launch.

  1. 01 Connect the shop Scoped Selldone MCP access
  2. 02 Shape real data Catalogue, products, pricing, and operations
  3. 03 Build the experience AI creates every responsive surface
  4. 04 Review and launch GitHub to Cloudflare, with approval
See the complete build logAll 8 verified steps and outcomes
  1. 01

    Connect the shop to Claude

    Selldone exposes the shop through an MCP connector. Enabling it gives the AI authenticated access to the same catalogue, pricing, and settings available in the dashboard, so it works with real records instead of invented sample data.

    Authenticated access to the live shop catalogue and settings.
  2. 02

    Create the repository and clone it

    A fresh Git repository is created for the storefront, cloned locally, and opened with a running development server. Everything the AI writes is versioned from the first commit.

    A versioned working surface with a local development server.
  3. 03

    Fill the catalogue through the backend

    Claude creates the category and eight properties directly in Selldone, including titles, descriptions, nightly rates, currency, city, coordinates, room types, and amenities. The records remain editable through the standard dashboard.

    Eight real, editable accommodation records in one Selldone shop.
  4. 04

    Choose the design reference

    Booking.com is used as a concrete visual reference. Its palette, type scale, and spacing are measured and translated into a shared token system for the storefront.

    A consistent visual system grounded in a specific reference.
  5. 05

    Hand over the screenshots

    Each surface is specified with reference captures and a description of its behavior, including what expands, what filters, and what persists between steps. The screenshots become a fast, precise product brief.

    Clear visual and interaction requirements for every surface.
  6. 06

    Claude builds

    The storefront is built surface by surface, with each screen connected to live Selldone data as soon as it appears. Prices, currencies, amenities, and scores come from the backend from the first render.

    A complete storefront powered by live shop data rather than stubs.
  7. 07

    Test at every width

    Real browser screenshots are reviewed at phone, tablet, laptop, and desktop widths after each pass. Visual review catches layout problems that automated checks alone cannot reveal.

    Verified responsive behavior across four screen widths.
  8. 08

    Go live on Cloudflare

    The GitHub repository is connected to Cloudflare so each pushed update can deploy automatically. The storefront is published on its own domain and the live output is compared with the verified local build.

    An automatically deployed storefront on a custom domain.

AI + MCP handoff

Build your version of Lodera with AI.

Give your agent the Skill, connect one approved shop, and review the result before anything is published.

Build with the AI you already use

ChatGPT Claude Codex Any MCP client
  1. 01
    Attach SkillBusiness context
  2. 02
    Connect MCPScoped shop access
  3. 03
    ReviewResponsive build
  4. 04
    PublishYour domain

Start with one prompt

Give your AI the Lodera build contract.

Adapt and deploy the Lodera booking template for a connected Selldone shop.

Download the Lodera business skill Connect Selldone MCP
Prompt after attaching SKILL.md
Use $build-lodera-booking-genesis to adapt Lodera for my connected Selldone shop, publish it to my GitHub repository, and prepare a Cloudflare Workers deployment on my domain.
Repository commandsOptional setup and future upstream sync

Your AI can wire these commands for you. The reference repository stays upstream, while your private repository remains the deployable source.

01

Create your repository

Clone the base once, then push it to your own GitHub repository.

Initial repository wiring
git clone https://github.com/pajuhaan/selldone-custom-storefront-backoffice-1.git my-lodera-booking
cd my-lodera-booking
git remote rename origin upstream
git remote add origin YOUR_GITHUB_REPOSITORY_URL
git push -u origin main
02

Sync without overwriting

Review upstream changes on a branch before merging or publishing.

Future reference sync
git fetch upstream
git switch -c sync-upstream-YYYY-MM-DD
git merge --no-ff --no-commit upstream/main
npm run build:static
git commit -m "Sync upstream"
git push -u origin sync-upstream-YYYY-MM-DD

From reviewed code to your own domain.

Publish a Selldone Genesis storefront from GitHub to Cloudflare Workers & Pages, connect a custom domain, and keep future updates deploying automatically from the repository. Open the complete Selldone guide ↗

1
Launch stepCreate a new GitHub repository

Create an empty repository that will become the source Cloudflare watches for this storefront.

  • Sign in to GitHub and choose Create repository.
  • Give the repository a clear name, such as 1-shop-your-store, so it is easy to identify when directing an AI agent.
  • Choose Private unless you intentionally want the storefront source to be public.
  • Create the repository and copy its HTTPS repository URL from Quick setup.
From your GitHub home page, click Create repository.
Enter a clear repository name, choose the appropriate visibility, and create the repository.
Copy the repository URL from the HTTPS field; you will give this address to your AI agent in the next step.
2
Launch stepAsk your AI agent to push the project

Return to the Codex or Claude project chat and tell the agent to publish the current storefront into the new repository.

  • Paste the exact HTTPS repository URL you copied from GitHub.
  • Ask the agent to push the current project to that repository.
  • Wait for the upload to finish, then verify that the project files appear on GitHub.
AI handoff A request flows through AI into Selldone and returns as approved work The agent reads the request, uses approved Selldone tools, and returns a reviewable repository change.

Your AI prepares the repository, pauses for approval, and returns a reviewable build.

3
Launch stepConnect GitHub in Cloudflare Workers & Pages

Open Cloudflare's application workflow and authorize it to read the storefront repository from GitHub.

  • Sign in to Cloudflare and open Compute, then Workers & Pages.
  • Choose Create application and then Connect GitHub.
  • Authorize only the storefront repository when you want to keep Cloudflare's access narrowly scoped.
  • Finish with Install & Authorize and return to Cloudflare.
From the Cloudflare left menu, go to Compute, then Workers & Pages.
Click Create application to open the Ship something new workflow.
Select Connect GitHub so Cloudflare can open the GitHub authorization window.
Choose only the storefront repository when appropriate, then click Install & Authorize.
4
Launch stepSelect the storefront repository

Choose the GitHub account and the repository that contains the Genesis storefront source.

  • Confirm the correct GitHub account.
  • Select the repository created in step 1 and populated in step 2.
  • Click Next to continue to the application build settings.
Choose the GitHub account, select the repository you created earlier, and click Next.
5
Launch stepConfigure the build and deploy

Keep a recognizable project name, enter the Genesis static build command exactly, and let Cloudflare build the repository.

  • Keep the project name the same as the repository name or choose another unique Cloudflare project name.
  • Enter the static build command exactly as shown.
  • Click Deploy and follow the Initializing, Cloning, Installing, and Deploying stages.
  • Wait for Success! Build completed and use the temporary workers.dev address to verify the result.
npm run build:static
Keep or edit the project name, enter npm run build:static in the Build command field, and click Deploy.
Cloudflare may spend a few seconds setting up the repository before opening the Deployments page.
Watch the Initializing, Cloning, Installing, and Deploying stages, and wait until the build completes.
A successful deployment shows Success! Build completed and creates a temporary workers.dev URL.
6
Launch stepAdd your custom domain

Attach a domain already managed by your Cloudflare account to the deployed storefront.

  • Open the deployed project, choose Domains, and click Add Domain under Custom Domains and Routes.
  • Enter either the main domain or a subdomain, then confirm Add domain.
  • Use View domain or the Overview page's Visit button after Cloudflare activates the route.
  • Verify that the live domain opens the deployed storefront over HTTPS.
Under Custom Domains and Routes, click Add Domain.
Connect your main domain or enter the subdomain you want to use, then click Add domain.
Open the three-dot menu beside the connected domain and choose View domain, or use Visit from Overview.
Your Genesis storefront is now live on the connected domain.
7
Launch stepReplace the reference shop configuration

If the deployed site still shows the reference merchant, ask the AI agent to switch the project to your connected Selldone shop and publish the update.

  • Tell Codex or Claude that the domain works but the reference storefront is still visible.
  • Ask it to replace the reference settings with your own connected Selldone shop configuration.
  • Have the agent commit and push the verified update to the same GitHub repository.
  • Wait for Cloudflare's automatic deployment, then confirm that your shop content appears on the live domain.
AI handoff GitHub to Cloudflare to a live custom domain A reviewed repository flows through Cloudflare deployment and becomes a live storefront on the merchant domain.

Your AI verifies the production domain and returns the live storefront for review.

Make it yours

Start from Lodera.
Make every surface yours.

Your AI follows the Skill, works through shop-scoped MCP access, and keeps Selldone underneath as the commerce engine.
Build this with AI Explore Lodera live ↗

Copied to clipboard