If you’re using the Hostinger Website Builder and want to embed custom code — such as an HTML widget, third-party form, or even custom JavaScript — this guide walks you through the process step by step.
Step 1: Log in to Your Hostinger Account
Start by logging into your Hostinger account. Once inside, navigate to the Websites section, and next to the site you want to modify, click Edit Website.
Step 2: Add a Blank Section
Once you’re inside the editor, you need a dedicated space to place your custom code. Click on Add Section, then choose Blank Section. This gives you a clean area to work with.
Step 3: Insert the Embed Code Element
Click the plus (+) icon or Add Element, then scroll down to find the Embed Code element. Drag and drop it into your blank section.
Step 4: Enter Your Custom Code
Click on Enter Code, remove any placeholder content, and paste your custom HTML, CSS, or JavaScript. If you don’t have any code yet, tools like ChatGPT can help you generate it.
Step 5: Save and Publish
Click Embed Code, then hit Update Website to publish your changes. To verify that your embedded content is working, click View Site and check the live preview.
Note: Some custom code elements may only show properly on the live site rather than in the editor.
Why Use Custom Code in Hostinger?
Embedding code allows you to integrate third-party services, track users with analytics, customize visuals, and add interactive functionality that goes beyond what the drag-and-drop builder offers.
Learn More with My Free Hostinger Course
Want to take your Hostinger skills to the next level? Get free access to my Hostinger Website Builder Masterclass and other courses by visiting: https://academy.dotcom.builders
You’ll learn:
- Website setup & layout design
- Menus and navigation
- Blogging & SEO
- E-commerce configuration
- Analytics & integrations
Join today — it’s free, and designed to help you build stunning, high-performing websites with Hostinger.