6/20

Layout Chooser

This component lets you pick a specific grid layout for your section, column component or inside a accordion and tab. You could modify which layout group or specific layout should be available to your users.

You could also add more layouts by modifying the layout chooser html file. It's a very simple html which reflexs the layout of the output.

Customizing

You'll find the LayoutChooser in webresources\jsFields. You will find all the layout blocks at the top and the necessary CSS classes in the style block. Feel free to modify it to your needs.

If you want to add or remove some of the groups or single grid layouts you can add following to the parameters in the dialog definition.

layout:
  required: true
  label: Layout
  $type: javascriptField
  fieldScript: /magnolia-central-module/webresources/jsFields/layoutSelector.html
  height: 430 
  parameters:
    columns: true
    headings: true
    bentos: true
    repeater: true

If you only want to deactivate one layout from a group, you can also deactivate just this one.

Here is a list of all available options:

layout:
  ...
  parameters:
    columns: true #Entire Group
    columns1: false
    columns2: true
    columns3: true
    columns4: true
    columns5: true
    columns6: true
    columns7: true
    
    headings: true #Entire Group
    withHeading1: true
    withHeading2: true
    withHeading3: true
    
    bentos: true #Entire Group
    bento1: true
    bento2: true
    bento3: true
    bento4: true
    
    repeater: true #Entire Group
    repeater1: true
    repeater2: true
    repeater3: true

Changelog

6/20

Color Chooser

Contact the author

Marvin Kerkhoff

Business contact