To customize a template in Hostinger AI Builder, choose Manual during site setup, preview and apply a pre-made template, then use the editor’s Styles panel for site-wide design and the selected page, section, or element controls for local changes. Review the mobile layout separately. Choose carefully: Hostinger says you cannot switch a created site to a different template in place.
Choose and preview a template before creating the site
In Hostinger, open Websites, select your hosting plan, and choose Create website → AI Builder → Manual → Pre-made templates. Browse categories such as Portfolio, Fashion, Marketing, Events, and eCommerce, then preview a design and select Use template when you are ready. Hostinger says the categories help you browse; they do not change the editor tools available to a template. Hostinger’s template-selection guide explains the setup flow.
As an Amazon Associate I earn from qualifying purchases.
Template choice is fixed once the site is created. To use another template, you must create a new site, disconnect the domain from the old site, and connect it to the new one. That is different from changing the layout of the template you already chose: you can still edit its pages and sections, including making a section full width.
Set a consistent site-wide look with Styles
Open Styles in the left panel to adjust global colors, text, buttons, and animations. Text settings include headings, paragraphs, and navigation links. These global choices provide a consistent starting point, while individual elements and sections can still have their own styling. See Hostinger’s global styles instructions.
#1 Best Overall
Change a color throughout the site
- Open Styles → Colors.
- Choose Change beside the color you want to replace.
- Select a new color and accept it to apply the replacement across the site.
For a one-off color change, select the specific element, choose Edit, and use its local color controls. Header navigation has separate header settings, so adjust it there rather than assuming a general text change will cover every header detail.
Edit text, images, buttons, and other elements
Open Add elements in the left panel. Drag an item where you want it, or click an item to insert it into the selected section. Select the inserted element to view its settings. Hostinger’s available element types include text, running text, buttons, “Add to bag” buttons, images, galleries, video, and forms. Its support page reports 15 website elements in manual mode; that count is a vendor-reported feature total, not an independent measure. See Hostinger’s element guide.
Configure a button
Button settings have separate General and Style tabs. Use General to edit the button text and link target, choose whether a link opens in a new tab, and set the nofollow option. Use Style to adjust normal and hover fill and text colors, font, text size, and border radius. For details, consult Hostinger’s template customization guide.
Quick wins for a faster PC:
Clear out junk files and repair common Windows errorsFree Scan →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Repair Windows errors before they cause bigger problemsFix Now →Reshape the page with sections
Sections control larger blocks of page content; they are separate from the elements placed inside them. To add one, hover between two sections and choose Add section. Pick a section type or template, or start with a blank section. Select an existing section to change its background and layout settings, including snap-to-guide behavior, snap-to-element behavior, row height, and row gap.
Rank #3
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Section controls can also resize, anchor, duplicate, hide or show, delete, move sections up or down, and copy and paste them. Some sections can use a generated image background. Hostinger’s section guide covers these controls. Before replacing a whole template, consider whether adding, moving, or resizing sections will achieve the layout you want.
Manage pages and navigation
Use the Pages panel to add, rename, duplicate, or delete pages; edit a page URL; set the homepage; hide pages from navigation; add navigation links; create dropdowns; and reorder the menu. The navigation menu is in the header. To adjust its settings, select the header section. If the header is not visible, Hostinger notes that all pages may be hidden from the navigation menu.
Hostinger’s manual-mode overview and template customization guide describe the page and header controls.
Free tools Windows power users keep installed
One-click scans. No signup required.
Check and arrange the mobile layout
Choose the phone icon in the upper toolbar to switch to mobile view. The initial mobile order follows the order in which elements were added on desktop, but later desktop reordering does not automatically update that order. Sort and inspect the mobile layout independently.
Deleting an element or section in desktop view also deletes it from mobile view, and deletion in mobile view affects desktop too. Treat removal as a shared change, even though you can adjust the mobile arrangement separately. Hostinger explains these behaviors in its template guide and manual-mode overview.
Add optional features if the site needs them
- Blog: Add one from the Blog panel.
- Store or services: Hostinger’s eCommerce tools support physical and digital products, services, appointments, and donations.
- Custom code: Put code intended for the document head in the Custom code field in integrations settings. Use an Embed code element for code intended for the page body.
These additions are optional; they are not required to customize a template. Hostinger’s template customization guide covers these options.
Quick Recap
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
What’s actually slowing this PC down?
Pick the symptom - the matching free tool is one click away.
