AI Website Builder - Docs

1. What is the AI Website Builder?

The SillyHost AI Website Builder is a powerful tool that uses artificial intelligence to generate complete, professional websites from a simple text description. Instead of manually coding HTML, CSS, and JavaScript, you describe what you want and the AI creates it for you.

The AI Builder generates clean, responsive code that works on all devices. You get a fully functional website that you can further customise, edit, and publish to your domain.

Info: The AI Builder creates static HTML/CSS/JS websites. For dynamic features like blogs or e-commerce, consider using WordPress instead.

2. Getting Started with AI Builder

1

Log into your dashboard

Navigate to Dashboard > AI Builder or visit the AI Builder page.

2

Choose an AI package

If you have not already, select an AI Builder plan that suits your needs. Each plan includes a certain number of generation credits per month.

3

Create a new project

Click "New Project" and give your website a name.

4

Describe your website

Write a detailed description of what you want. The more detail you provide, the better the result will be.

3. Writing Effective Prompts

The quality of your AI-generated website depends heavily on how well you describe it. Here are tips for writing great prompts:

Bad Prompt

"Make me a website"

Good Prompt

"Create a modern, professional website for a plumbing company

called 'QuickFlow Plumbing' based in Manchester. Include:

- A hero section with a call-to-action button for emergency calls

- A services section listing: boiler repair, bathroom installation,

leak detection, and drain unblocking

- Customer testimonials section

- About us section with 20 years experience mentioned

- Contact form and a Google Maps embed placeholder

- Blue and white colour scheme

- Mobile-friendly responsive design"

Tip: Include specific details like: the business name, colour preferences, sections you want, your industry, the tone (professional, fun, minimal), and any specific features (contact forms, image galleries, pricing tables).

4. Understanding the Split-Screen Interface

The AI Builder uses a split-screen layout so you can see your changes in real time:

Left panel -- the code editor where you can view and modify the generated HTML, CSS, and JavaScript
Right panel -- the live preview showing how your website looks as you make changes
Chat input -- type follow-up instructions to ask the AI to make specific changes
Toolbar -- save, publish, responsive preview toggles, and version history

5. Editing Generated Code

You have two ways to refine your website after the initial generation:

Ask the AI to make changes

Type follow-up requests in the chat, such as "change the hero background to dark blue" or "add a FAQ section after the testimonials". The AI will update the code accordingly.

Edit the code directly

If you know HTML/CSS, you can edit the source code directly in the code editor panel. Changes appear instantly in the preview. This is useful for fine-tuning text, colours, spacing, and other details.

6. Publishing Your AI-Built Site

Once you are happy with your website, publishing it to your domain is straightforward:

1

Click "Publish"

In the AI Builder toolbar, click the "Publish" button.

2

Choose your domain

Select which domain or subdomain to publish to. You need an active hosting plan linked to the domain.

3

Confirm deployment

The AI Builder will deploy your files to the hosting account. Your website goes live within seconds.

Warning: Publishing will overwrite existing files in the domain's public_html directory. If you have an existing site, make sure to back it up first.

7. AI Builder Pricing Tiers

The AI Builder is available as a separate subscription with different tiers based on your usage needs. Each tier includes a monthly allocation of AI generation credits.

Visit our pricing page for current AI Builder plan details and pricing.

Info: Each generation (initial creation or a follow-up edit request) uses one credit. Simple edits to the code editor do not use credits.

8. Tips and Best Practices

Start with a detailed prompt -- the more specific your initial description, the fewer follow-up edits you will need.
Iterate in small steps -- make one change at a time with follow-up prompts rather than asking for many changes at once.
Check all screen sizes -- use the responsive preview toggles to verify your site looks good on mobile, tablet, and desktop.
Replace placeholder content -- the AI may generate placeholder text or images. Replace these with your actual content before publishing.
Save frequently -- use the save button to create checkpoints you can revert to if needed.

9. Code Ownership and Licensing

You own the code generated by the AI Builder. Here is what that means:

You can download and use the generated code anywhere, even outside SillyHost
You can modify the code however you like
You can use it for commercial purposes
No attribution to SillyHost is required on your published site

Info: The generated code may reference third-party libraries (like Tailwind CSS or Google Fonts) which have their own open-source licences. These are free to use commercially.