Configuration 

Look's options apply 

Everything Look offers applies unchanged: the default scale and maximum height of the previews in the extension configuration, and the feature flags editOverlay (click to edit), allowSiteScripts (Camino's JavaScript inside the frame) and allowMedia (videos). See the Look documentation.

The preview templates 

The site set maps the Camino content types to two templates.

Resources/Private/Templates/Preview/Content.html serves all types:

<look:backend.contentPreview
    record="{record}"
    bodyClass="{look:site.setting(pageUid: record.pid, name: 'camino.colorScheme')}"
    css="{0: 'EXT:theme_camino/Resources/Public/Css/main.css'}"
    js="{0: 'EXT:theme_camino/Resources/Public/JavaScript/main.js'}" />
Copied!
  • record makes Look render the element with the frontend TypoScript of its page in a separate request.
  • bodyClass puts the colour scheme from the site settings on the body of the preview frame, as Camino does on the website.
  • css and js load Camino's stylesheet and script inside the frame. The script only runs when allowSiteScripts is enabled.

Resources/Private/Templates/Preview/Teaser.html is the same with height="340" and serves camino_textmedia_teaser. Teasers in the sidebar can get tall (image plus text); the fixed height keeps the page module compact, the fade-out shows editors that the element continues.

Adjusting the mapping 

The mapping is plain page TSconfig in the site set:

Configuration/Sets/typo3-look-camino/page.tsconfig (excerpt)
mod.web_layout.tt_content.preview {
  camino_hero = EXT:look_camino/Resources/Private/Templates/Preview/Content.html
  camino_textmedia_teaser = EXT:look_camino/Resources/Private/Templates/Preview/Teaser.html
}
Copied!

To change the height, the assets or the body class for one type, point that type to a template of your site package in your own page TSconfig, which loads after the set. To keep Camino's summary for a type, point the type back to Camino's own preview template:

mod.web_layout.tt_content.preview.camino_sociallinks = EXT:theme_camino/Resources/Private/Templates/ContentPreviews/Linklist.fluid.html
Copied!

Using the pattern in your own project 

For a theme other than Camino, take the three pieces of this extension and adjust them in your site package:

  1. A preview template that hands the record to Look and loads the stylesheet of your theme (css, optionally js and bodyClass).
  2. Page TSconfig that maps your content types to that template via mod.web_layout.tt_content.preview.<CType>.
  3. A site set, or your existing one, that ships the TSconfig.

Nothing else is needed; this extension has no PHP. The Look documentation explains the view helper arguments and when to prefer Content Blocks with Fluid Components instead of the TypoScript way.