When building a website using Hostinger Website Builder, knowing how to properly edit each section is essential. In this tutorial, you’ll learn everything from customizing your sticky bar and header to editing backgrounds, layout, and more.
Getting Started
To begin editing your site, log into your Hostinger account. Then navigate to “Websites” and click Edit Website next to your site.
Editing the Sticky Bar (Announcement Bar)
To add or edit a sticky bar:
- Hover between sections to find the “Add Sticky Bar” button.
- Once added, click “Edit Section.”
- Customize the background with a color or image.
- You can upload your own image or choose from free stock images.
- Adjust layout height, background position, and overlay opacity as needed.
Customizing the Header Section
Click the header and then “Edit Header.” You can now:
- Make the header sticky (visible while scrolling)
- Adjust spacing between elements like logo, nav, and buttons
- Show/hide social icons, shopping cart, and call-to-action buttons
- Use either a logo image or text, and change font, size, and color
- Reorder header elements or hide the header on specific pages
Editing Other Page Sections
For any section on your page, click to select it. You can then:
- Change visibility (mobile/desktop)
- Delete, duplicate, or move sections up/down
- Set background to a color, image, or video (from Pexels)
- Adjust overlay opacity and background position
Using Anchor Links for Smooth Scrolling
Hostinger allows you to create anchor links:
- Click “Edit” on a section and go to the “Anchor” tab.
- Name your section (e.g., testimonials).
- Link any text or button to this anchor for smooth scrolling.
Creating New Sections
Click between existing sections and hit “Add Section.” You can:
- Use AI to generate sections (e.g., Contact Us)
- Choose from predesigned templates: blog, products, testimonials, etc.
- Add a blank section and build from scratch
Editing Section Elements
To edit content within a section:
- Double-click text to edit directly
- Click images, videos, or buttons to change properties
- Use the floating toolbar to modify layout, fonts, spacing, and more
Don’t Forget to Save
Always hit Save or Update Website to publish your changes. Use Undo if needed to revert recent actions.
Editing sections in Hostinger Website Builder gives you full control over your site’s design and functionality. With options to adjust layouts, backgrounds, visibility, and more, you can build a fully customized, professional website without any coding.
For more tutorials and free access to my full Hostinger course, visit:
👉 academy.dotcom.builders
Got questions? Drop them in the comments, and don’t forget to like the video!