If you’re building a website using Hostinger Website Builder and want to customize your homepage with a hero image, this guide will walk you through the process step by step.
Step 1: Log In to Your Hostinger Account
First, log in to your Hostinger dashboard. Once you’re in, go to the Websites section and find the site you want to edit. Click Edit Website to open the website builder.
Step 2: Create a Hero Section
To add a hero section, click on Add Section and choose Blank Section. Once it’s added, click on the section and select Edit Section.
Step 3: Set an Image Background
In the section editor, navigate to the Background tab. Switch the background type from “Color” to “Image.” Click Add Image and either upload one from your computer or browse free images directly from the platform.
If you’re going for a cleaner look, you might want to search for “white background” or “background” in the free image section. Once you find a suitable image, click Add to Page.
Step 4: Make the Header Transparent
To make your header blend nicely with the hero image, select the header using your mouse and click Edit Header. Go to the Style tab and choose the transparent option. This creates a seamless effect between your header and the hero section.
Step 5: Adjust and Publish
If needed, experiment with different images to get the right contrast with your header elements. Once satisfied, click Update Website to publish your changes and view the updated hero section live.
Final Thoughts
Customizing the hero section is a great way to enhance the visual appeal of your website. With Hostinger Website Builder, it’s quick and easy to set a stunning first impression. If you run into any issues or have questions, feel free to leave a comment on the video or explore more tutorials through our free course.
📖 Access the full Hostinger Website Builder course here: https://academy.dotcom.builders
🎓 Join our free web academy and take your website to the next level: https://academy.dotcom.builders
Happy building!