{"id":928,"date":"2022-08-02T11:23:05","date_gmt":"2022-08-02T11:23:05","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/08\/02\/6435894-hostinger-website-builder-how-to-add-and-customize-website-elements\/"},"modified":"2026-09-04T04:16:18","modified_gmt":"2026-09-04T04:16:18","slug":"6435894-hostinger-ai-builder-manual-mode-how-to-add-and-customize-website-elements","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6435894-hostinger-ai-builder-manual-mode-how-to-add-and-customize-website-elements\/","title":{"rendered":"Hostinger AI Builder: How to add and customize website elements in manual mode"},"content":{"rendered":"

Website elements are items that you can use to populate your web pages. In other words, website elements are texts, images, buttons, videos, and so on.<\/p>

Add an element to your page<\/h2>

While using Hostinger AI Builder manual mode<\/a><\/b>, you can find all available elements by expanding the Add elements<\/b> panel on the left.<\/p>

Drag and drop any element to the preferred place on your website or click on an element, and it’ll be automatically inserted into a selected section:<\/p>

\"\"<\/div>

Customize an element<\/h2>

Feel free to customize every element however you like. Click on it and explore its settings:<\/p>

\"\"<\/div>
Learn how to organize and layer elements<\/a> when working with multiple overlapping items on a page.<\/div>
<\/div>

Type of element<\/h2>

You may choose from the following elements:<\/p>

\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n
\n

Text<\/a><\/b><\/p>\n<\/td>\n

\n

Use text elements to populate your website with high-quality content learn how to change<\/strong><\/a><\/span> the text style<\/a><\/b>, including a new shimmering text effect for added visual flair
\n<\/b><\/p>\n<\/td>\n<\/tr>\n

\n

Running text<\/strong><\/a><\/p>\n<\/td>\n

\n

Add a line of text that runs infinitely across the screen — a good way to highlight discounts, announcements, or other important information<\/p>\n<\/td>\n<\/tr>\n

\n

Button<\/a><\/b><\/p>\n<\/td>\n

\n

Buttons are great call-to-action elements; learn how to add links<\/a><\/b> <\/b>to your buttons<\/p>\n<\/td>\n<\/tr>\n

\n

“Add to bag” button<\/a><\/b><\/p>\n<\/td>\n

\n

Create products<\/a><\/b>, link them to these buttons, and sell them online easily<\/p>\n<\/td>\n<\/tr>\n

\n

Image<\/a><\/b><\/p>\n<\/td>\n

\n

You may browse our free image library or upload your own pictures<\/p>\n<\/td>\n<\/tr>\n

\n

Gallery<\/a><\/b><\/p>\n<\/td>\n

\n

The gallery element allows you to showcase your favorite pictures in a gallery view<\/p>\n<\/td>\n<\/tr>\n

\n

Video<\/a><\/b><\/p>\n<\/td>\n

\n

Our native video element supports YouTube and Vimeo videos; learn how to add a Facebook video<\/a> <\/b>or upload a video from your local device<\/a><\/b><\/p>\n<\/td>\n<\/tr>\n

\n

Shape<\/a><\/b><\/p>\n<\/td>\n

\n

Use various geometric figures to perfect the design of your website<\/p>\n<\/td>\n<\/tr>\n

\n

Card<\/a><\/b><\/p>\n<\/td>\n

Add a styled container to create modern card-style layouts; the Card element supports borders, background fills (solid colors and gradients), preset or custom drop shadows, and flexible sizing<\/td>\n<\/tr>\n
\n

Map<\/a><\/b><\/p>\n<\/td>\n

\n

Add a map to help your customers find your business more easily<\/p>\n<\/td>\n<\/tr>\n

\n

Instagram feed<\/a><\/b><\/p>\n<\/td>\n

\n

Use the Instagram feed <\/b>element to embed your Instagram posts on your website<\/p>\n<\/td>\n<\/tr>\n

\n

Contact form<\/a><\/b><\/p>\n<\/td>\n

\n

Let your clients reach out to you by submitting a contact form on your website<\/p>\n<\/td>\n<\/tr>\n

\n

Subscription form<\/a><\/b><\/p>\n<\/td>\n

\n

To create a mailing list, add the subscription form element to your website and collect email addresses easily<\/p>\n<\/td>\n<\/tr>\n

\n

Social icons<\/a><\/b><\/p>\n<\/td>\n

\n

Use this <\/b>element to add links to your social media profiles<\/p>\n<\/td>\n<\/tr>\n

\n

Embed code<\/a><\/b><\/p>\n<\/td>\n

\n

The embed code element allows you to integrate various third-party widgets into your website: calendars, countdown timers, pop-ups, and many more<\/p>\n<\/td>\n<\/tr>\n

\n

Search<\/a><\/b><\/p>\n<\/td>\n

\n

Use this element to let visitors search your products, blog posts, and general website content; learn how to configure what it searches and enable a dedicated search results page<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>

Additional resources<\/strong><\/p>