Composer

Add the composer to a page template

You can only have one composer per page

Simply add to the page template this syntax

#$custom$#

This syntax will be replaced by the blocks selected by the user in the backoffice

Example:

page/free-content.html

<div id="main-content" role="main">
  #$list|hero$#
  <div id="site-content">
    #$custom$#
  </div>
</div>

On free-content page template, the content of the composer will be added where you have #$custom$#

Show a block in the composer

To allow a block to be picked in the composer, in Testeur edit the block and check "Is in composer"

When adding a block in the composer, try to check it works if added to any page, if re-ordering the block will not cause a code issue, etc... You can choose to add to the composer block that should not be added everywhere, but please warn the project managers. Indeed, the block will be accessible from any page, with a composer

Add screenshot to block / list

On the composer "Add block" modal, the user can see a screenshot of the blocks. This is also useful for pages to have a preview.

This needs to be defined at theme level, you have a folder screen where you can upload the images. For blocks, upload them in screen/block/key.png and for lists screen/block/key.png , with key being the name of your block (in the code).

Example for tc-theme

If you are not sure where to upload your image, you can look inside Tester where to add it

Default blocks in the Composer

Default Composer