Hostinger Website Builder Tutorial 2024 (Step By Step Guide)

People & Blogs


Hostinger Website Builder Tutorial 2024 (Step By Step Guide)

Hey there everyone! Today we're going to be using Hostinger's AI website builder to create our own gaming blog. I'll take you through everything from the very beginning where you sign up all the way up until you go live with your site. These tips work all the same for e-commerce and business sites or even personal portfolios, so you'll definitely be able to use them for whatever you need.

If you haven't joined Hostinger yet, no worries. I've dropped a link in the description with a great offer including a sitewide discount and additional months of free use. Plus, you can receive an extra 10% off when you copy the Site Starters code in our description and use it when you're checking out with Hostinger. Full transparency though, when you use our link, we do get a commission so you're also helping us out as well. Now, with all that being said, how about we get started?

Getting Started with Hostinger AI Website Builder

  1. Choosing a Plan:

    • Navigate to the website builder option in the menu.
    • Choose between the Premium and Business website builder plans. They are only a dollar apart but the business plan includes more features and tools.
    • Suggestion: Opt for the Business plan for better value.
  2. Signing Up:

    • Add your selected plan to the cart and proceed to the checkout page.
    • Select a payment period. Longer periods mean paying less right now.
    • Create an account and select your payment type.
    • Input the Site Starters coupon code and submit the payment.
  3. Accessing the Dashboard:

    • After payment, skip the initial setup screens.
    • Click on the Hostinger logo at the top to go to the main dashboard.
    • Navigate to 'Websites' and click on the 'Add Website' button.
    • Choose the Hostinger Website Builder option.

Building Your Site with AI

  1. Using AI Builder:

    • Choose between pre-made templates or the AI builder.
    • Enter your brand name, website type, and a detailed description.
    • The AI will create a website based on your inputs.
  2. Editing the Generated Site:

    • The AI provides a basic layout with necessary elements like menus and footers.
    • Customize colors, images, and texts to match your vision.
    • Use the left-hand toolbar for various editing tools such as text, images, and videos.

Adding and Managing Content

  1. Working with Text and Images:

    • Add new sections by hovering between blocks and selecting 'Add Section'.
    • Drag and drop elements like text and images.
    • Customize the text by double-clicking on it and using the toolbar for fonts, sizes, and colors.
    • For images, use the 'Edit Image' option to change and crop images.
  2. Adding Video:

    • Drag a video element into your section.
    • Replace the sample video with your video URL or upload a file.
    • Use the AI writer for content descriptions.

Customizing the Store

  1. Setting Up the Store:

    • Click on the 'Online Store' option in the left-hand menu.
    • Follow prompts to add products, both physical and digital.
  2. Adding Products:

    • Fill out product information including images, descriptions, prices, and stock quantities.
    • Set up different variants like sizes and colors.
  3. Managing Shipping and Payments:

    • Set up shipping zones and rates.
    • Integrate payment options like PayPal and Stripe or set up manual payment methods.

Adding Blog Posts

  1. Using the Blog Feature:

    • Navigate to the blog tab and click on 'Add New Post'.
    • Use the AI writer to generate blog content.
  2. Publishing and Linking Posts:

    • Publish the post and link it with buttons on your homepage.
    • Customize the link settings for better user experience.

Going Live

  1. Publishing Your Site:

    • Click on the 'Go Live' button at the top right.
    • Purchase a domain to fully activate your store and site.
  2. Setting Up Your Domain:

    • You can use Hostinger’s free sample domain in the meantime.

That's all for this tutorial! It has been quite the journey but we made it to the end. Make sure to leave your questions in the comment section below, and I'll get back to you as soon as I can. Don't forget to use the link in the description to get a sitewide discount and an extra 10% off with the Site Starters code when checking out with Hostinger.

Until next time, take care!


Keywords

  • Hostinger
  • AI Website Builder
  • Gaming Blog
  • Website Builder Tutorial
  • E-commerce Site
  • Online Store Setup
  • Product Management
  • Blog Posting
  • Domain Setup

FAQ

Q1: What are the main differences between the Premium and Business website builder plans? A: The Business plan includes more features and tools such as AI tools and e-commerce features for just an extra dollar compared to the Premium plan.

Q2: How do I create an AI-generated website with Hostinger? A: After selecting the Hostinger Website Builder, enter your brand name, choose your website type, and provide a detailed description. The AI will then generate a website based on your inputs.

Q3: How can I customize the AI-generated site? A: Use the left-hand toolbar to edit text, images, and videos. You can add new sections, drag and drop elements, and double-click to edit specific content.

Q4: How do I add products to my online store? A: Use the 'Online Store' option in the menu to add and manage products. Fill out all necessary information like images, descriptions, prices, and stock quantities.

Q5: Can I use AI to write blog posts for my site? A: Yes, the AI writer can generate blog content for you. Navigate to the blog tab, click on 'Add New Post', and use the AI writer for content creation.

Q6: How do I publish my website with Hostinger? A: After building your site, click on the 'Go Live' button at the top right. You will need to purchase a domain to fully activate your site, but a free sample domain is available in the meantime.

Q7: What payment options are available for my online store? A: Hostinger supports PayPal and Stripe for payments. You can also set up manual payment methods like cash on delivery, money orders, and bank transfers.

Q8: How do I set up shipping options for my store? A: Go to the store settings and create shipping zones. Set shipping rates and conditions based on regions or order quantities.