{"id":761,"date":"2022-10-04T09:58:09","date_gmt":"2022-10-04T09:58:09","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/10\/04\/6611782-how-to-use-hostinger-website-builder\/"},"modified":"2026-03-20T10:15:14","modified_gmt":"2026-03-20T10:15:14","slug":"6611782-how-to-use-hostinger-website-builder","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6611782-how-to-use-hostinger-website-builder\/","title":{"rendered":"How to Use Hostinger Website Builder"},"content":{"rendered":"

Hostinger Website Builder<\/a><\/b> is a perfect tool that allows creating a website or an online store without any experience in coding or design. The whole process is based on customizing a website template<\/a><\/b>.<\/p>

\n

Learn more: What’s the Difference Between Hostinger Website Builder and Other Content Management Systems?<\/a> 💡 <\/b><\/p>\n<\/div>

Within the builder, there are two main toolbars – the left-side toolbar and the upper toolbar – that include everything you need to run a successful website. Let’s overview the main areas of the builder 👇<\/p>

Website Editor<\/h2>

Access the builder, and you’ll see the main tools on the left:<\/p>

\"\"<\/p>

<\/div>

Here’s what you’ll find there:<\/p>

\n\n\n\n\n\n\n\n\n\n\n
\n

ELEMENTS<\/b><\/p>\n<\/td>\n

\n

In the Elements<\/b> panel on the left, you can find a variety of elements that you can use to populate your website<\/p>\n

Learn how to add and customize website elements<\/a><\/b><\/p>\n<\/td>\n<\/tr>\n

\n

PAGES<\/b><\/p>\n<\/td>\n

\n

In the Pages<\/b> panel on the left, you can find and manage all your website pages:<\/p>\n

\n

STYLES<\/b><\/p>\n<\/td>\n

\n

In the Styles<\/b> panel on the left, you can find the global style settings<\/b>:<\/p>\n

\n

BLOG<\/b><\/p>\n<\/td>\n

\n

In the Blog <\/b>management panel on the left, you can:<\/p>\n

\n

STORE<\/b><\/p>\n<\/td>\n

\n

In the Store <\/b>panel on the left, you can enable the eCommerce platform on your website<\/p>\n

Learn how to start creating an online store<\/a><\/b><\/p>\n<\/td>\n<\/tr>\n

\n

AI TOOLS<\/b><\/p>\n<\/td>\n

\n

In the AI tools<\/b> panel on the left, you can access the following:<\/p>\n

    \n
  • \n

    AI Logo Maker<\/p>\n<\/li>\n

  • \n

    AI Writer<\/p>\n<\/li>\n

  • \n

    AI Bog Generator<\/p>\n<\/li>\n<\/ul>\n<\/td>\n<\/tr>\n

\n

SEO<\/b><\/p>\n<\/td>\n

\n

SEO is a really wide topic, but here are the main tools and features that we offer:<\/p>\n

\n

MORE…<\/b><\/p>\n<\/td>\n

\n

In the More… <\/b>panel on the left, you can find more options, such as additional languages<\/a><\/b>, integrations<\/a><\/strong>, form submissions<\/a><\/strong>, media library<\/a><\/strong> and others<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>

\n

Even though there’s no dedicated tab for sections<\/b> on the left-side toolbar, you can easily add custom sections<\/a><\/b> to any of your website pages 💡<\/p>\n<\/div>

Website Settings<\/h2>

Within the builder, find the website settings in the bottom-left corner:<\/p>

<\/div>

Here’s what you’ll find there:<\/p>

\n\n\n\n\n\n\n\n
\n

GENERAL SETTINGS<\/b><\/p>\n<\/td>\n

\n

In the general website settings, you can:<\/p>\n

\n

INTEGRATIONS<\/b><\/p>\n<\/td>\n

\n

Built-in integrations<\/a><\/b> include Google Analytics, Hotjar, WhatsApp, and more<\/p>\n

Custom integrations<\/b> can be added in two ways:<\/p>\n

\n

ANALYTICS<\/b><\/p>\n<\/td>\n

\n

Analyze your website’s traffic<\/a><\/b> and tailor your content more effectively to suit your audience<\/p>\n<\/td>\n<\/tr>\n

\n

FORM SUBMISSIONS<\/b><\/p>\n<\/td>\n

\n

This section of your website settings is dedicated to forms that your clients submit via the contact form<\/a><\/b> and subscription form<\/a><\/b> elements on your website<\/p>\n<\/td>\n<\/tr>\n

\n

MEDIA LIBRARY<\/b><\/p>\n<\/td>\n

\n

Locate necessary files and manage them more quickly using the media library<\/a><\/b><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>

Mobile Editor<\/h2>

To view the mobile version of your website, click on the mobile phone icon in the top toolbar:<\/p>

\"The<\/div>

By default, website elements are displayed on the mobile view in the order they’ve been added to the desktop view<\/b>. Even if you later reorder elements on the desktop view, these changes are not automatically applied to the mobile version. You can sort the elements on the mobile view manually. This way, you can lay out elements differently on desktop and mobile views.<\/p>

\n

Learn more: How to Edit the Mobile Version of a Website<\/a> 💡 <\/b><\/p>\n<\/div>

Other Options<\/h2>

In the upper toolbar, you can see the following options:<\/p>

\n\n\n\n\n\n\n\n\n
\n

REDO\/UNDO <\/b><\/p>\n<\/td>\n

\n

If you accidentally delete an element or a section, you can easily restore it using the undo\/redo buttons in the upper toolbar<\/p>\n<\/td>\n<\/tr>\n

\n

SAVE<\/b><\/p>\n<\/td>\n

\n

Most changes made within the website builder are saved automatically<\/a><\/b>
\n​
\nIf any changes are not auto-saved, you’ll always see the Save <\/b>button to save changes manually<\/p>\n<\/td>\n<\/tr>\n

\n

VIEW VERSION HISTORY<\/b><\/p>\n<\/td>\n

\n

View and restore previous versions<\/a> <\/b>of your website<\/p>\n<\/td>\n<\/tr>\n

\n

PREVIEW <\/b><\/p>\n<\/td>\n

\n

It doesn’t matter if your website has already been published or is still a draft – you can easily preview it<\/a><\/b> from your editor<\/p>\n<\/td>\n<\/tr>\n

\n

GO LIVE <\/b>
\n(after publishing the website, the button is called Update website<\/b>)<\/p>\n<\/td>\n

\n

Learn how to publish a website<\/a><\/b><\/p>\n

If you are eager to launch your website but still have some unfinished pages, you can publish the homepage<\/a> <\/b>only and hide the rest of your pages while you’re working on them<\/p>\n<\/td>\n<\/tr>\n

\n

UPDATE WEBSITE<\/b><\/p>\n<\/td>\n

\n

Updating your website<\/a><\/b> is necessary to view the latest changes live<\/p>\n

You can edit and update your website as many times as you want<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Conquer the Internet with Hostinger Website Builder<\/p>\n","protected":false},"author":581,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"include_on_kodee":true,"footnotes":""},"categories":[277],"tags":[],"class_list":["post-761","post","type-post","status-publish","format-standard","hentry","category-general-website-builder"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/support\/6611782-how-to-use-hostinger-website-builder\/","default":1},{"locale":"es-ES","link":"https:\/\/www.hostinger.com\/es\/support\/6611782-como-usar-el-creador-de-sitios-web-de-hostinger\/","default":0},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/support\/6611782-comment-utiliser-le-createur-de-sites-web-hostinger\/","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/support\/6611782-cara-menggunakan-website-builder-hostinger\/","default":0},{"locale":"lt-LT","link":"https:\/\/www.hostinger.com\/lt\/support\/6611782-kaip-naudoti-hostinger-svetainiu-kurimo-iranki\/","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/br\/support\/6611782-como-usar-o-criador-de-sites-da-hostinger\/","default":0}],"include_on_kodee":true,"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/761","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/users\/581"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/comments?post=761"}],"version-history":[{"count":4,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/761\/revisions"}],"predecessor-version":[{"id":8899,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/761\/revisions\/8899"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/media?parent=761"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/categories?post=761"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/tags?post=761"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}