Blocs allows you to easily integrate raw HTML into your projects using the HTML widget. This feature is exceptionally useful as it can be used to add additional functionalities to your Blocs projects that are currently not available yet.

PLEASE NOTE: The HTML widget is only designed for the injection of plain HTML code. It is highly recommended that you create your own backups of files if you want to attempt to paste code in that contains Javascript or any other programming language type as it may cause the file to corrupt and the Blocs software to crash. Additional code snippets such as javascript should be used in the header and footer code areas found in the page settings.

Adding an HTML Widget
To add an HTML widget to a page, press the D key to enter drop mode, then hit the 0 key to view the Bric library. Using the search field in the Bric library, type HTML. The Brics will be filtered to show only the HTML widget, which will be automatically loaded into the current active drop space.

html-search

Hit the Return key to hide the Bric library and then move the cursor to the area you wish to add the HTML widget and left click to set it in place on your page. Take care to exit drop mode by pressing the D key before attempting to access the widgets code editor.
 

Inputting Code
Once you have an HTML widget in place on your page you can edit the code that resides within it. Making sure you are no longer in drop mode, move the cursor over the HTML widget to reveal the hover marker. Once this marker is revealed left click and the HTML widget will be activated for editing. Now right click and from the contextual menu that appears, select Edit Code or alternatively click the button in the sidebar labelled Edit Code.

edit-code

The Blocs code editor will now open allowing you to input any custom HTML code you desire. All changes you make to the code will be reflected within your Blocs project in real time.

IMPORTANT: The HTML widget is only designed for the injection of plain HTML code. It is highly recommended that you create your own backups of files if you want to attempt to paste code in that contains Javascript or any other programming language type as it may cause the file to corrupt and the Blocs software to crash. Additional code snippets such as javascript should be used in the header and footer code areas found in the page settings.

Please Note: Any user interface elements such as text, buttons or links that are created using code in an HTML widget can not be selected for editing using the standard sidebar options. The normal behaviour when trying to select elements inside an HTML widget is that the HTML widget will be selected.

code-editor
 

Trouble Shooting
The HTML widget can be used to paste in any 3rd party code snippets from other services, there is no way to check full compatibility for all snippet types, so you may from time to time come across a piece of code that doesn’t work when pasted in.

If you come across an issue, contact support in-app via the apps main menu Help > Contact Customer Support. Take care to include as much information as possible, including any code snippets you may have tried to use.

contact-support