How to Add HTML to Hostinger Website Builder
Want to add HTML to Hostinger without touching templates? The builder offers two spots for third-party code. Below you will find which one fits each ElectricBlaze widget and what to do when a snippet refuses to appear.
Which Hostinger product runs your site?
Hostinger sells two different ways to build a website, and the instructions differ completely:
- Hostinger Website Builder (also branded Hostinger AI Builder). A drag-and-drop editor where you arrange elements on a canvas. This page is about it.
- WordPress hosted on Hostinger, managed from hPanel. Here the dashboard is ordinary WordPress, so follow the WordPress instructions instead.
Inside the builder there are two tools for outside HTML. The Embed code element sits on one page, in the spot where you drop it. The Custom code field under Integrations applies to every page; Hostinger places script tags from it at the end of the page body automatically.
Hostinger Website Builder embed code: step by step
First grab your two-line widget code in ElectricBlaze, then return to the builder.
-
Launch the editor and pick the target page from the page list.
-
Open the Add elements panel on the left and drag the Embed code element onto a section.
-
Click the element, choose Enter code, paste the HTML snippet and confirm with Embed code.
-
Drag the element handles to set its width and height, then press Update website and check the published address.
The builder canvas shows a placeholder instead of running third-party scripts, so an empty-looking box while editing is normal.
Page element or site-wide code?
Feeds that belong in the page flow
Instagram, Facebook, TikTok and X (Twitter) feeds go into an Embed code element. The element keeps a fixed frame, so the Hostinger embed code height must match the layout you chose: a one-row slider needs a short box, a gallery with three rows needs a tall one.
Floating buttons and players
A Popup Chat bubble, or a Music Player in floating mode, should hover in a corner of every page. Placed inside an element, it stays locked in that rectangle. Use site-wide HTML instead: open More (⋯) in the builder, go to Integrations, paste the snippet into Custom code and update the website.Desktop and mobile
Hostinger stores phone layouts apart from desktop ones. Preview the mobile version before publishing: columns in a feed stack on narrow screens, so the element often needs extra height there.
Whichever way you add HTML to Hostinger, the widget content itself loads from ElectricBlaze, so the HTML snippet stays short.
Hostinger embed code not working: common causes
- Nothing visible on the live site. Did you press Update website after pasting? New HTML stays in the draft until you do. Then clear the browser cache.
- Bottom rows cut off. The element is shorter than the widget. Drag its lower edge down or reduce rows in the ElectricBlaze Layout tab.
- Chat bubble trapped in a box. The code lives in a page element. Remove it and paste into Integrations → Custom code.
- “Embed code is too large” error. This comes from images pasted as
data:imagetext in other code, not from the two-line widget HTML. - Two snippets broke each other. In the Custom code field paste each snippet below the previous one, never inside it.
Still stuck? Send the page address to [email protected] and we will take a look.
Widget guides for Hostinger
Pick a widget to see its Data and Layout settings plus the placement that suits a Hostinger page.
-
How to add Instagram Feed to Hostinger
-
How to add TikTok Feed to Hostinger
-
How to add YouTube Feed to Hostinger
-
How to add Twitter Feed to Hostinger
-
How to add Twitch Feed to Hostinger
-
How to add Facebook Feed to Hostinger
-
How to add Popup Chat to Hostinger
-
How to add Music Player to Hostinger
-
How to add Pinterest Feed to Hostinger
-
How to add Vimeo Feed to Hostinger
-
How to add Simple Shop to Hostinger
Hostinger custom code: questions
How to add HTML code in Hostinger website builder on a single page?
Drag an Embed code element onto that page only and paste the HTML there. Elements added to one page do not repeat elsewhere, unlike code in Integrations.
How to add HTML code to Hostinger website head section?
The Integrations Custom code field accepts meta, link and style tags, which go to the head. Widget scripts do not need the head.
Are there free Hostinger widgets?
The builder has its own elements such as forms and maps. For social feeds, a chat button or a music player, the ElectricBlaze Free plan covers five widgets with 1,000 views a month.
Why does the widget look blank in the editor?
The editor does not execute embedded HTML scripts. Open the published address to see the real result.
Can I reuse one widget on another Hostinger site?
Yes. The same HTML works on any number of websites. Views from every copy count toward your monthly view allowance.
Get widget code for Hostinger
Make a widget on the Free plan and have it running on your builder site shortly after.
Create a widget