<regions:togglable>
AJAX
ajax:delayedload ajax:event ajax:navigation ajax:region
Data
data:calendar data:column data:eventrepeater data:postrepeater data:productbrandrepeater data:productcategoryrepeater data:productrepeater data:repeater data:table data:template data:tree
Forms
forms:address forms:captcha forms:checkbox forms:checkboxgroup forms:codeeditor forms:combobox forms:datepicker forms:dialogbox forms:editbox forms:fileupload forms:form forms:hidden forms:money forms:officeuseregion forms:option forms:password forms:paymentmethod forms:radiobutton forms:radiobuttongroup forms:row forms:searchbox forms:signature forms:slider forms:spinbox forms:submitbutton forms:submitimage forms:submitlink forms:successcontent forms:textarea forms:timepicker
Layout
layout:gallery layout:productgallery layout:rotator layout:stepper layout:stepperpanel layout:tablist layout:tablistitem
Logic
logic:dependency logic:else logic:if logic:include logic:parse logic:variable
Navigation
navigation:breadcrumbs navigation:item navigation:primary navigation:secondary
Personalisation
personalisation:firstname personalisation:fullname personalisation:lastname personalisation:other
Standard
standard:embed standard:icon standard:image standard:link standard:script standard:tooltip standard:video
Templates
templates:button templates:card templates:column templates:fancybox templates:faq templates:flexlayout templates:header templates:row templates:section templates:styles templates:teammember templates:testimonial
Regions
regions:content regions:contentadditional regions:security regions:togglable
DESCRIPTION
ATTRIBUTES
applyClassWhenVisible
applyClassWhenVisibleTo
defaultVisible
id
label
labelArrowPosition
labelPosition
EXAMPLES
Simple Togglable Region
Togglable with Additional Region Content
Third Party
thirdparty:googlemap thirdparty:googlemapmarker

<regions:togglable> </...>

An area in a design which can be toggled on or off on a per page basis using a checkbox that appears in the design.

Content

Anything

Attributes

applyClassWhenVisible
string
Applies a CSS class to the element(s) specified by ApplyClassWhenVisibleTo
applyClassWhenVisibleTo
string
Applies the class specified by ApplyClassWhenVisible to elements matched by the selector

Example: #id1, .class2
defaultVisible
bool
Determines whether or not the togglable region is defaultly visible for newly created pages.
id
string
Give this control a unique id. Can be accessed in the client DOM (eg, document.getElementById('myid') or in the server DOM using [? $myid ?] or [? $('myid') ?]).
label
string
When editing page content, this will shown as the label of the tickbox.
labelArrowPosition
string
A specific position for the label arrow may be set.

If omitted, the arrow will appear in the most sensible location for the given label position.
labelPosition
string
Anchor the label at this position of the togglable region.
Default = 'topleft'.

Examples

Simple Togglable Region

Defines a region in a design which can be toggled on or off when editing pages.

HTML:

<regions:togglable id="footer_promotions" defaultvisible="true" label="Display Footer Promo Area"> Place Togglable Content here. </regions:togglable>

Togglable with Additional Region Content

Add a togglable region, which contains an additional editable content region.

HTML:

<regions:togglable id="footer_promotions" defaultvisible="true" label="Display Editable Footer Promo Area"> <regions:contentadditional id="content_additional_1" /> </regions:togglable>