{"id":766,"date":"2022-09-19T12:25:39","date_gmt":"2022-09-19T12:25:39","guid":{"rendered":"https:\/\/blog.hostinger.io\/support\/2022\/09\/19\/6570087-hostinger-website-builder-add-to-bag-buttons\/"},"modified":"2026-08-20T05:59:49","modified_gmt":"2026-08-20T05:59:49","slug":"6570087-hostinger-ai-builder-manual-code-add-to-bag-buttons","status":"publish","type":"post","link":"https:\/\/www.hostinger.com\/support\/6570087-hostinger-ai-builder-manual-code-add-to-bag-buttons\/","title":{"rendered":"Hostinger AI Builder: Add to bag buttons in manual mode"},"content":{"rendered":"

Add to bag<\/strong> buttons in Hostinger AI Builder manual mode appear by default in single-product sections<\/a><\/b> and on product pages<\/a><\/b>. You can also add them as individual elements and link them to your products<\/a><\/b>.<\/p>

Add an Add to bag button<\/h2>
    \n
  1. Expand the Add elements<\/b> panel on the left.<\/li>\n
  2. Find the Add to bag<\/b> button.<\/li>\n
  3. Drag and drop it anywhere on your page:
    \n\"\"<\/li>\n<\/ol>

    Configure the button<\/h2>

    Click on a button to see more options (edit, duplicate, hide, delete, resize):<\/p>

    \"Add<\/div>

    Click Edit product<\/b> to open its settings:<\/p>

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

    Product<\/b><\/p>\n<\/td>\n

    		\n

    General<\/b><\/p>\n<\/td>\n

    		\n

    Style<\/b><\/p>\n<\/td>\n<\/tr>\n

    \n

    Link the button to your product<\/p>\n<\/td>\n

    		\n

    Rename the button<\/p>\n<\/td>\n

    		\n

    Change the button style:<\/p>\n

      \n
    • \n

      Button color<\/p>\n<\/li>\n

    • \n

      Text color\/font\/size<\/p>\n<\/li>\n

    • \n

      Corner radius (button shape)<\/p>\n<\/li>\n<\/ul>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>

      Your Add to bag button is now linked to your product and styled to match your design.<\/p>\n","protected":false},"excerpt":{"rendered":"

      Add and customize Add to bag buttons in Hostinger AI Builder manual mode.<\/p>\n","protected":false},"author":581,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"include_on_kodee":true,"footnotes":""},"categories":[293],"tags":[],"class_list":["post-766","post","type-post","status-publish","format-standard","hentry","category-ai-builder"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/support\/6570087-hostinger-website-builder-add-to-bag-buttons\/","default":1},{"locale":"fr-FR","link":"https:\/\/www.hostinger.com\/fr\/support\/6570087-hostinger-createur-de-sites-web-boutons-ajouter-au-panier\/","default":0},{"locale":"lt-LT","link":"https:\/\/www.hostinger.com\/lt\/support\/6570087-hostinger-svetainiu-kurimo-irankis-mygtukai-prideti-i-krepseli\/","default":0},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/support\/6570087-hostinger-criador-de-sites-botao-de-adicionar-a-sacola\/","default":0}],"include_on_kodee":true,"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/766","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/users\/581"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/comments?post=766"}],"version-history":[{"count":4,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/766\/revisions"}],"predecessor-version":[{"id":16292,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/posts\/766\/revisions\/16292"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/media?parent=766"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/categories?post=766"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/support\/wp-json\/wp\/v2\/tags?post=766"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}