Skip to content
Website Builder

How to Add Social Media Icons in Hostinger Website Builder (Header, Footer & Page Sections)

June 17, 2025

Adding social media icons to your website is a simple yet powerful way to increase engagement, drive traffic to your social platforms, and create a more professional online presence. If you’re using Hostinger Website Builder, the process is incredibly intuitive. In this guide, we’ll walk you through how to add social media icons in the header, body, and footer of your site.

Step 1: Access Your Website in Hostinger

  1. Log into your Hostinger account.
  2. Navigate to the Websites tab.
  3. From your website list, click on Edit Website next to the site built with the Hostinger Website Builder.

Step 2: Add Social Media Icons in the Header

  1. Select the header section and click Edit Header.
  2. In the Elements tab, check the box next to Show Social Icons.
  3. Click Edit Social Icons to:
    • Add or remove platforms (e.g., Facebook, Instagram, LinkedIn, X).
    • Reorder the icons by dragging them.
    • Edit each link by clicking the settings icon and entering your profile URL.
    • Add custom platforms like YouTube manually.

You can also change the icon size and color, and preview them before publishing.

Step 3: Add Social Icons in the Middle of the Page

  1. Create or duplicate a section for your social media call-to-action (e.g., “Follow Us”).
  2. Click Add Element, then drag in the Social Icons element.
  3. Use the Edit button to:
    • Customize links
    • Adjust icon color and size
    • Set hover effects
    • Choose between vertical or horizontal layout
    • Add subtle animations like fade or scale

You can also change the section’s background to match your branding and improve visibility.

Step 4: Add Social Media Icons in the Footer

  1. Scroll to the footer and click Add Element > Social Icons.
  2. Customize the appearance just like before — but this time, make sure the icon colors contrast well with your footer background.
  3. Use the Visibility Settings to choose whether icons appear on desktop, mobile, or both.

Step 5: Save and Publish

After making all changes, click Update Website to push your changes live. You can also preview your site to confirm everything looks and works correctly.

Final Thoughts

Adding social media icons in Hostinger Website Builder is fast and highly customizable. Whether it’s in the header, content section, or footer — you now know how to link your site with your social presence seamlessly.

Still have questions? Drop them in the comments or explore more tutorials in our free Hostinger course.