Buttons are a key element in any modern website—they drive engagement, guide your visitors, and boost conversions. In this tutorial, we’ll show you exactly how to add and customize a button in Hostinger Website Builder with ease. Whether you want to place a button in the header, homepage, footer, or inside blog posts, we’ve got you covered.
Getting Started
To begin, log in to your Hostinger account and access your website through the “Edit Website” button under the Websites tab. If you don’t have a site yet, you can create one using the Hostinger Website Builder tool.
1. Add a Button to the Header
- Click on the header section, then click “Edit Header.”
- Navigate to the “Elements” tab and enable “Show Button.”
- Click on “Edit” under the button to:
- Change the button text (e.g., Subscribe to My Newsletter)
- Link it to a page, external URL, email, phone, or downloadable file
- Customize the button style including fill color, font, text size, border, and corner radius
- Define a hover state with different styling (e.g., orange background on hover)
2. Insert a Button in a Section or Homepage
- Click “Add Element” and drag the Button element into your section
- Resize the button and click “Edit Button” to change:
- Text (e.g., Download My Ebook)
- Link destination
- Design settings such as color, border, size, and animation effects (e.g., scale animation)
3. Add a Button in the Footer
- Similar to homepage sections, use “Add Element” to drag a button into the footer area
- Customize the button’s appearance and functionality as needed
4. Add a Button in a Blog Post
- Choose a blog post and adjust the section height if needed
- Use “Add Element” to place a button inside the post content
- Edit the text (e.g., Check on Amazon), customize its design, and link it to any destination
Final Step: Save Your Work
After placing and styling your buttons, make sure to update your website to apply all the changes.
Whether you’re promoting a product, encouraging newsletter signups, or linking to important pages, mastering how to add and customize a button in Hostinger Website Builder is essential. Now that you’ve seen the process in detail, start implementing effective CTAs across your site today!