{settings.responsiveimages.backendlayout.{backendlayout}}
{backendlayoutConfig.{data.colPos}}
frame-size-default
frame-{data.frame_class}
frame-type-{data.CType}
frame-layout-{data.frame_layout}
frame-dataitem-class-{data.data_layout_itemClass}
frame-carousel-{data.activate_carousel} frame-carousel-arrows-{data.activate_carousel_arrows} frame-carousel-dots-{data.activate_carousel_dots}
frame-background-{f:if(condition: data.background_color_class, else: 'none', then: data.background_color_class)}
frame-space-before-{f:if(condition: data.space_before_class, else: 'none', then: data.space_before_class)}
frame-space-after-{f:if(condition: data.space_after_class, else: 'none', then: data.space_after_class)}
frame-space-inner-before-{f:if(condition: data.custom_space_inner_before, else: 'default', then: data.custom_space_inner_before)}
frame-space-inner-after-{f:if(condition: data.custom_space_inner_after, else: 'default', then: data.custom_space_inner_after)}
{f:if(condition: data.grid, then: 'frame-grid-{data.grid}')} {f:if(condition: data.grid_sm, then: 'frame-grid-sm-{data.grid_sm}')} {f:if(condition: data.grid_md, then: 'frame-grid-md-{data.grid_md}')} {f:if(condition: data.grid_lg, then: 'frame-grid-lg-{data.grid_lg}')} {f:if(condition: data.grid_xl, then: 'frame-grid-xl-{data.grid_xl}')}
{f:if(condition: data.grid_gutter, then: 'frame-{data.grid_gutter}', else: 'frame-default-gutters')}
{f:if(condition: data.grid_alignment, then: 'frame-{data.grid_alignment}')}
{f:if(condition: data.imageborder, then: 'frame-imageborder', else: 'frame-no-imageborder')}
{data.custom_class}
{f:if(condition: backgroundImage.0, then: 'frame-has-backgroundimage', else: 'frame-no-backgroundimage')}