← All articles

App Builders

How to Build a Website with Hostinger Horizons: A Complete Beginner's Guide

8 min read

Updated

Learn how to use Hostinger Horizons to build and deploy a functional web app in 20 minutes using simple natural language prompts—no coding required.

Hostinger Horizons is an AI-powered, no-code web development platform that translates plain language prompts into functional, hosted web applications. When you build a site with Horizons, hosting, SSL, and CDN deployment are automatically configured, removing the traditional technical barriers to launching a website.

In this guide, you will learn how to build a portfolio website with a project gallery and contact form. If you are launching a service business, you can easily adapt these steps to create a booking page instead.

  • Time required: ~20 minutes
  • Cost: Free (7-day trial, no credit card required)
  • Skill level: Absolute beginner

Prerequisites

To get started, you only need:

  1. A modern web browser (Chrome, Firefox, Safari, Edge, or equivalent)
  2. An email address (to create your account)

No coding knowledge, software installation, or command-line experience is required. The entire platform runs directly inside your browser.

Step 1: Sign Up for the Free Trial

Go to Hostinger Horizons to start your free 7-day trial. You can register using an email address or a Google account.

During the trial, you receive 5 prompts per day for 7 days. Because prompts are the primary credit resource on this platform, being specific with your descriptions will ensure you do not exhaust your daily allowance.

Once signed in, you will be redirected to the main dashboard, which features a text input field for your first prompt.

Step 2: Launch Your Project

To generate your initial website, enter a detailed description of what you want to build.

Copy and paste the following prompt into the dashboard input box:

Build a personal portfolio website for a freelance designer named Alex. Include a hero section with a headline and short bio, a project gallery showing 6 projects in a grid with images and titles, a testimonials section with 3 client quotes, an about page, and a contact form that collects name, email, and message. Use a clean, minimal design with a white background, dark text, and blue accent colors. Make the navigation sticky.

After submitting, Horizons will take 30 to 60 seconds to compile the code, set up the layout, and display a fully styled live preview of the website.

Customizing for a Service Business

If you are building a service-oriented site rather than a portfolio, use this alternative prompt format:

Build a booking website for a yoga studio called "Flow Studio." Include a homepage with class schedule, instructor bios with photos, a pricing section showing 3 membership tiers, a contact page with a map embed placeholder, and an online booking form that collects name, email, phone, preferred class, and date. Use calming colors: soft greens and whites. Make the header sticky with a "Book a Class" button.

Voice and Image Inputs

Horizons also supports voice and visual prompts. You can tap the microphone icon to describe your application out loud, or upload an image—such as a hand-drawn sketch or a screenshot of an existing design—to guide the AI layout generation.

Step 3: Refine the Layout with Follow-Up Prompts

No AI website builder produces a perfect result on the first attempt. To make changes, use targeted follow-up prompts. Submit these revisions one at a time:

Make the Header Sticky

Make the header sticky so it stays visible when scrolling. Add a subtle shadow underneath it.

Add a Testimonials Section

Add a testimonials section below the project gallery with 3 client quotes. Each testimonial should show the client name, role, and a short quote. Use a light gray background to separate it from the rest of the page.

Update the Accent Colors

Change the accent color from blue to dark navy (#1a2744). Update all buttons, links, and highlights to match.

Add a Call-to-Action (CTA)

Add a full-width CTA section before the footer that says "Let's work together" with a short paragraph and a "Get in Touch" button that scrolls to the contact form.

The Optimization Strategy

Focusing each prompt on a single, specific edit prevents the AI from misinterpreting your request and helps preserve your prompt credits. Horizons supports over 80 languages, allowing you to prompt and receive outputs in your preferred language.

Step 4: Edit Content Directly

Once the structural layout is complete, you can customize the placeholder text and images without using up your AI prompt credits by switching to Content Editing Mode.

This mode allows you to:

  • Click and edit text directly on the page.
  • Click and upload replacement images.
  • Refine copy without executing new prompts.

Note: Content Editing Mode is available starting on the Starter plan ($13.99/mo). If you are using the free trial, you must use text prompts to update copy. To save credits on the trial, batch your changes into a single prompt:

Update the following text: change the headline to "Design That Delivers," change the bio to "I'm Alex: a freelance designer specializing in brand identity and web design for startups," and update the CTA button text to "Start a Project."

Step 5: Add E-Commerce Capabilities

For businesses looking to sell services, digital downloads, or physical goods, Horizons offers integrated payment processing. E-commerce features are supported on the Starter plan ($13.99/mo) and higher.

To set up an online store, submit a prompt like this:

Add an online store section with 4 products. Each product should have an image, title, description, and price. Include an "Add to Cart" button on each product and a shopping cart icon in the header that shows the item count. Set up Stripe checkout for payments.

Horizons will generate the catalog layout, cart system, and Stripe integration interface. You will be prompted to log into your Stripe merchant account to finalize payment routing.

Step 6: Configure SEO Settings

Horizons automatically builds the fundamental SEO metadata for your website:

  • Meta titles and descriptions for each page.
  • Open Graph (OG) tags for social media link previews.
  • Structured schema data for search engine parsing.
  • An XML sitemap.

To modify the default metadata, submit a refinement prompt:

Update the meta title to "Alex Design: Freelance Brand & Web Designer" and the meta description to "Freelance designer specializing in brand identity, web design, and visual systems for startups and small businesses."

You can audit your current configuration at any time by asking the AI:

Show me the current meta tags for all pages.

Step 7: Publish Your Site

Once you are satisfied with the design and content:

  1. Click the Publish button in the dashboard interface.
  2. Horizons will automatically upload the site to Hostinger's hosting infrastructure, provision an SSL certificate (HTTPS), and configure CDN routing.
  3. You will immediately receive a live URL.

If you are on a paid plan, you can connect a custom domain (e.g., yourdomain.com). The setup utility guides you through pointing your registrar's DNS records to Horizons.

Strategies for Conserving Prompt Credits

Because Horizons operates on a credit-based system, managing your prompt usage is key to keeping costs down.

  • Write Detailed Initial Prompts: Specify colors, structural sections, fonts, and grid sizes in your first prompt. Getting 80% of the site right on the first try saves multiple corrective credits later.
  • Batch Small Edits: Combine minor design adjustments into one instruction:

    Change the heading font to Inter, increase the section padding to 64px, make the footer background dark gray (#1a1a1a) with white text, round all button corners to 8px, and reduce the project grid gap to 16px.

  • Use Content Editing Mode: Avoid spending credits on typographical fixes or copy updates by editing inline (available on paid tiers).
  • Consult Version History: If a prompt yields poor results, roll back to a previous iteration from your project history instead of spending a new credit to manually reverse the changes.

Frequently Asked Questions

Is Hostinger Horizons really free?

Yes. The 7-day trial is completely free and grants 5 prompts per day without requiring a credit card. Once the trial ends, you must subscribe to a paid tier to continue editing or publishing updates, though your published site remains live during the transition. Paid plans start at $6.99/month (Explorer plan, 30 credits/month).

Can I connect a custom domain?

Yes. You can route a custom domain through the dashboard on any paid tier. Horizons manages DNS mapping and automates SSL certificate generation.

Can I edit the underlying code directly?

Code editing is restricted to the Hobbyist plan ($39.99/mo) and higher. On lower tiers, adjustments must be completed via prompts or Content Editing Mode.

Does Horizons support backend features?

Yes. Horizons offers native integration with Supabase for backend processes, including databases, user registration, and authentication systems. You can prompt the AI to configure these integrations automatically.

What are the prompt limits on paid plans?

  • Explorer ($6.99/mo): 30 credits/month
  • Starter ($13.99/mo): 70 credits/month
  • Hobbyist ($39.99/mo): 200 credits/month
  • Hustler ($79.99/mo): 400 credits/month

Annual billing discounts are available, and all paid tiers include a 30-day money-back guarantee if you have consumed fewer than 30 credits.