HTML widget

The Custom block’s HTML widget is a handy instrument when you want to add an HTML third-party code snipped to your website. It works similarly to the HTML embed block. However, the HTML widget gives you opportunities to combine custom html code snippets with several widgets into one block. 

Adding HTML widget

  1. Add the Custom block to your page.
  2. Click the yellow Add widget button to open the Widget library, find the HTML widget, and click it to add to the block.

    No-logo-HTML-widget-1.png

After this, you can embed the code snippet and add more widgets to the block. 

Also, you can start by adding columns and then add the HTML widget to one of them. This is how you can have an embedded social media feed on one side and a text portion and/or media on the other. And when you put two HTML widgets in the columns next to each other you can have, for example, multiple blog posts from Tumblr embedded side by side.

Adding custom code to the HTML widget

  1. Click the HTML code widget you’ve added to the block to enable its controls. 
  2. Click the </> Custom HTML icon to open the custom HTML window.

    No-logo-HTML-widget-2.png
  3. Write or paste the code snipped into the field and click Submit. The code validation feature will notify you if the code contains any errors that may conflict with the way Sitebuilder works.

 

Note: The code will not be executed while you are working in the Sitebuilder. It will only be executed in the Preview mode or on the published site.

Combining the HTML widget with other widgets

Sitebilder’s Custom block allows you to create a unique combination of widgets in one block. So, after adding the HTML widget to the block you can also add grid and columns and add more widgets from the list. 

When you add new widgets to the block, they appear on top or below each other (if it’s not a grid). But you can change their positions by dragging them up and down to the place you like inside this particular block. 

Here’s the video of how you can change the HTML widget placement inside the Custom block. 

Was this article helpful?
0 out of 0 found this helpful