Building and Publishing a Website with IONOS AI Website Builder

Overview

This course provides a comprehensive walkthrough on creating, customizing, and publishing a website using the IONOS AI Website Builder. The tutorial covers selecting the right plan, configuring subscription add-ons to avoid unexpected charges, and completing checkout. Viewers learn how to initiate the onboarding wizard by feeding business details, categories, descriptions, and desired brand tone into the AI engine. The lesson explores deep customization within the visual editor, including styling fonts, color palettes, responsive device previews (desktop, tablet, and mobile), and managing website settings such as custom head scripts, multi-language translation widgets, and privacy notices. Finally, the tutorial demonstrates section management (headers, footers, articles, and grids), asset replacement, publishing the site live, and attaching a custom registered domain.

Introduction and Navigating to Website Builder

00:00

The instructor introduces IONOS Web Builder with AI and signs into the IONOS dashboard to initiate a new website project under the Websites & Stores section.

• Log into IONOS account dashboard.
• Navigate to 'Websites & Stores'.
• Select 'Create new website or store' followed by 'Create a Website'.

Selecting a Plan and Managing Add-Ons

00:35

Reviewing available plans (Starter, Plus, Pro) and selecting 'Plus' without a store. The instructor shows how to uncheck pre-selected monthly add-ons (SEO, Email Marketing, Mail Business) to minimize upfront costs.

• Select between 'Website without store' or 'Website with store'.
• Review promotional introductory rates versus renewal prices.
• Uncheck optional paid add-ons to avoid extra monthly charges.

Completing Checkout and Product Setup

02:27

Processing payment via PayPal or credit card and waiting for the automated site provisioning process to complete.

• Confirm payment details and review refund/cancellation window policies.
• Allow IONOS to provision the MyWebsite Now Plus instance.

AI Builder vs. Template Selection

03:01

A comparison between starting from a pre-made static website template and leveraging the AI website generation onboarding flow.

• Pre-designed templates provide static foundations.
• AI generator builds customized site structure from business prompts.

Configuring Business Information and AI Prompts

03:46

Inputting company name (BENTECH), adding industry categories, selecting a brand tone (persuasive), and generating professional business descriptions using ChatGPT.

• Input business name and up to 10 industry categories.
• Generate or paste a concise business overview.
• Select an appropriate copy tone: Professional, Playful, Inspirational, or Persuasive.

Setting Fonts, Colors, and Contact Details

05:09

Selecting font pairings (Modern, Playful, Decorative), brand color palettes (Tech Blue), and populating optional business contact details.

• Choose typography matching the brand vibe.
• Select an accent color palette.
• Provide telephone, contact email, and office address.

Reviewing AI Designs and Responsive Preview

06:21

Reviewing generated website variations, selecting a primary design to edit, and verifying appearance across desktop, tablet, and mobile viewport modes.

• Cycle through generated designs using the carousel controls.
• Preview layouts in full-screen across mobile, tablet, and desktop views.

Site Settings, Custom Code, and Global Tools

07:57

Exploring the left navigation panel to configure global styles, page structure/SEO, business profiles, custom head HTML/JavaScript code, and multi-language translator widgets.

• Upload website logo and favicon.
• Insert custom tracking scripts or HTML in Head Code.
• Configure cookie privacy banner and language translation widgets.

Customizing Header, Navigation, and Styles

10:46

Editing header elements, toggling navigation visibility, adjusting social icon links, modifying background colors, and styling navigation typography.

• Toggle visibility of logo, site description, navigation, and social links.
• Adjust section background color, darkness levels, and section layout shapes.
• Double-click navigation items to adjust font colors and styling.

Managing Sections, Text, and Media

13:18

Adding pre-built content sections (Articles, Services Grids), cropping or replacing imagery using the stock library, and updating body copy.

• Add sections between header and footer via 'Add Section'.
• Double-click text or media blocks to invoke the inline editor toolbar.
• Replace images using upload or IONOS stock library.

Publishing the Website and Connecting a Domain

15:39

Publishing the website to a live preview URL, accessing the project settings, and linking an existing IONOS domain to replace the temporary subdomain.

• Click 'Publish' to make the website publicly accessible.
• Access 'Connect a domain' under project settings.
• Select your primary apex domain from the available list.

Pricing Transparency and Renewal Considerations

17:30

Important advisory on renewal hosting costs after the initial promotional period, ensuring realistic budget expectations.

• Initial promotional period offers low pricing ($1/month).
• Hosting renewing at regular market prices must be factored into ongoing budget plans.