Recommended Free Tools
In Hostinger AI Builder’s manual mode, open Add elements on the left, then drag an element into place or click it to add it to the selected section. Select the element to see its controls. Those controls vary by element, so text, buttons, images, and cards each have different editing options.
How to add an element
- Open your website in Hostinger AI Builder manual mode.
- Expand Add elements in the left-side panel.
- Drag the element to the position you want, or click it to insert it into the selected section.
- Select the inserted element to open its editing controls.
Hostinger’s guide lists text, running text, buttons, “Add to bag” buttons, images, galleries, video, shapes, cards, maps, Instagram feeds, contact and subscription forms, social icons, embed code, and search. Options depend on the element you choose. For example, images can come from the media library, Hostinger’s free image library, or an uploaded file; embed code can add a third-party widget. See Hostinger’s guide to adding and customizing elements for its full instructions.
As an Amazon Associate I earn from qualifying purchases.
Customize text, buttons, images, and cards
Text
Select a text element and choose its text-editing control to change the wording and formatting. Hostinger distinguishes changes to a particular text element from global changes to a shared text style. Its text instructions explain the available controls.
Buttons
Select a button to edit its label and destination. Hostinger lists links to a URL, a website page, a phone number, an email address, or a file. Button appearance controls include color, font, size, border, and corner radius. See the button guide.
#1 Best Overall
- HTML CSS Design and Build Web Sites
- Comes with secure packaging
- It can be a gift option
Images
Select an image to replace it from the media library, browse free images, or upload a file. Available settings include alt text, proportions, corner radius, hover effect, click action, shape, and animation. Hostinger states that the maximum image file size is 15 MB. See its image instructions.
Cards
A Card element can be customized with borders, a solid-color or gradient background, shadows, and sizing. Hostinger describes these options in its Card element guide.
Rank #2
Set links and adjust appearance
Links are not limited to buttons. Hostinger documents links on navigation, text, images, buttons, and social icons. Depending on the element, destinations can include web addresses, pages, files, sections, phone numbers, email addresses, or WhatsApp. For details, see Hostinger’s link instructions.
The Tool Desk
Outbyte PC Repair FREEClear out junk files and repair common Windows errorsFree Scan →Outbyte Driver Updater FREEFix the driver behind crashes, sound loss and screen glitchesFind Drivers →Use Styles for site-wide colors, text styles, button shapes, and animation choices. To change only one item, select that element; select a section to adjust its local settings. Global styles keep shared design choices consistent, while local controls let you tailor an individual item. Hostinger explains the distinction in its style guide.
Independent reader supportYour contribution helps us test, update, and keep practical guides available for everyone.Reorder, layer, and reuse elements
Open an element’s context menu for actions including cut, copy, paste, duplicate, rotate, bring to front, move forwards, send to back, move backwards, and delete. You can select multiple elements and move them together. Elements can also be moved between sections, with exceptions for slideshow, blog, and product sections. Hostinger’s organizing and layering guide lists the available actions.
To reuse one element, right-click it and select Copy, then go to a section or page and paste into an empty space. Hostinger says copy-and-paste handles one element at a time; that is separate from moving multiple selected elements together. Follow its copy-and-paste instructions if you need the exact steps.
Rank #4
Check the mobile layout separately
Switch to mobile view with the mobile icon in the upper toolbar. Hostinger says mobile elements initially follow the order in which they were added on desktop, but rearranging them on desktop does not automatically update their mobile order. Sort elements in mobile view to set that layout. Deleting an element or section on desktop also removes it from mobile, and vice versa. See Hostinger’s template customization instructions for mobile-view guidance.
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.
