Principle

The basic component of a Mosaic based layout is called a tile. A layout is a combination of several tiles. 

A tile is a dynamic portion of a web page, it can be a text element, an image, a field, etc.

Using Mosaic, an editor can position tiles across the Mosaic grid.

Modifying existing Tiles

Each layout will come with a few tiles already set up.  In the Document layout, the Title, Summary, and Text field tiles are already on the page. 

Title Field

Mosaic Tiles - Title Field 

Summary Field

The Summary field is a plain text field, without any form of mark-up similar to the Summary field on a standard Plone Page.  The Summary also appears in search results via Plone’s search engine.

 Mosaic Tiles - Summary Field

Text Field

The Text field is a Rich Text field similar to the Text field on a standard Plone Page. When you click on this field, a TinyMCE toolbar will appear.

Mosaic tile: Text field with TinyMCE editing bar highlighted

When you are done making changes, click Save.

 Mosaic menu bar: Save button highlighted

The resulting page.

 Resulting saved page

Inserting a Tile

Let’s insert a Rich Text tile.

 

Removing a Tile

 Rich text tile with Delete button highlighted

 

Exercise: Change the Layout of the Front page

  1. Navigate to the front page, and add a new tile.

Solution

  1. Set Display to Mosaic layout.
  2. Click Edit and then select the "Document" layout.
  3. Select Layout, then choose Customize.
  4. Click Insert button, then choose Document Byline.
  5. Add a Document Byline to the bottom of the layout.
  6. Click Save.