Insert custom HTML code

HTML is a markup language used to create web pages. You can add your own HTML code to the content and category pages of your shop.

This allows you to:

  • Embed widgets, trust seals, or iFrames
  • Integrate social media feeds
  • Extend design options, e.g. when inserting images
  • Insert tables, buttons, and other elements
  • Define anchor points so visitors can jump to specific sections of a page

Caution

Custom HTML code can negatively affect the design, functionality, or responsive behavior of your shop. Changes are made at your own risk. Always review your shop after making changes. Customer service is not provided for issues caused by custom HTML.
Automatic updates to the shop software can affect the program code. Therefore, check regularly to ensure that your custom HTML code still works as intended.
Some visitors may not see the inserted elements, for example due to cookie settings.

How to insert your own HTML code

  1. In the sidebar of the administration, navigate to Editor.
    The Editor opens.
  2. Navigate to Pages.
  3. Select the page to edit or add a new page.
    A preview of the page opens on the right-hand side.

    Info

    You can add custom HTML only to content and category pages. It is not supported on legal, product, or checkout pages.
    Custom HTML is valid only for the page where it is inserted.
  4. Navigate to Content elementsHTML.
  5. Drag the Custom HTML element to the desired position.
    You can only drop content elements into the blue areas of the page.
  6. Select Add HTML.
    The view Add HTML appears.
  7. Enter your custom HTML code.
    To clear the field and start over, select Reset at the bottom left.
  8. Select Save.

You have added a custom HTML element to your shop.

To verify your changes, select View your shop in the top bar.

To edit the code again, hover over the element and select Edit.

Info

Your shop software automatically checks whether the HTML code is valid.

How it looks

  • The HTML code itself is not displayed on your website. Only the visual output generated by the inserted code will be displayed.
  • To make the custom elements on your website more easily identifiable, this grey info box is always displayed alongside those elements in your Editor. It is not displayed on your actual website.
    Grey HTML info box
  • The grey info box is placed at the location where you dragged and dropped the content element. Depending on your HTML code, the related visual output may appear above the info box or elsewhere on the page.

Was this article helpful?