Superblocks

We had a use case where simple Sir Trevor blocks had to be associated together. One section may have a title, subtitle, some text, and an image. Another may have a title, YouTube video, and a carousel.

A new block was created that could contain other Sir Trevor blocks. These Superblocks are defined on an application level and can be re-used across Entities.

Real world example

If we look at this section from the chivas.com site:

In Cornerstone the superblocks are listed like this:

And look like this when expanded:

Under the hood

That consists of 2 titles, a YouTube video, and a carousel of images for the animated background. That uses this definition from the app/config/sir_trevor_superblocks.yml file:

fancy_video:
    name: "Fancy Video"
    description_format: 'data[1].data.text'
    subtypes: [Heading,Youtube,Carousel]
    json: '{"data":[{"type":"heading","data":{"format":"html","text":"Small top heading","headingType":"H3"}},{"type":"heading","data":{"format":"html","text":"Main heading","headingType":"H2"}},{"type":"heading","data":{"format":"html","text":"Small bottom heading","headingType":"H3"}},{"type":"youtube","data":{}},{"type":"carousel","data":{"carousel":""}}]}'

This is saved to the body_text field of this Product Entity as:

{
	"type":"super",
	"data":{
		"superblockType":"intro_block",
		"data":[
			{
				"type":"heading",
				"data":{
					"format":"html",
					"text":"Chivas Regal 12",
					"headingType":"H2"
				}
			},
			{
				"type":"heading",
				"data":{
					"format":"html",
					"text":"Smooth, rich and generous",
					"headingType":"H3"
				}
			},
			{
				"type":"text",
				"data":{
					"text":"<p>Chivas Regal 12 is a blend of many different malt and grain Scotch whiskies, matured for at least 12 years. This rich, smooth blend combines style with substance and tradition.</p>",
					"format":"html"
				}
			}
		]
	}
}

Adding Application support

To add Superblock support to an Application, add "Superblock" to the json array in the relevant section in the application_settings table:

select *
from application_settings
where name='sir_trevor_blocks_enabled'
and application_id=19

And then add the definitions to the app/config/sir_trevor_superblocks.yml file.