Features

Add a component in a content page

Wrap a slot into a element with the attribut data-sycomponent containing the class name of your component:

<div data-sycomponent="\Project\Component\MyComponent">
    {MY_COMPONENT_SLOT}
</div>

Use the attribute data-sycomponent-args if your component constructor needs some arguments, in json format:

<div data-sycomponent="\Sy\Bootstrap\Component\Form\Contact" data-sycomponent-args='{"email": "contact@example.com", "subject": "New message from contact form"}'>
    {CONTACT_FORM}
</div>

Lock a zone from inline edition

All the content in a element with the attribute data-sylock are non editable with the inline edition mode:

<div data-sylock>
    This content can't be updated during inline edition mode
</div>

<p>
    This paragraph is editable. <span data-sylock>Only this sentence is not editable</span>
</p>

Sometimes we want to be able to edit content but we need to preserve the attributes of elements like in a accordion, tabs, carousel etc...

<div data-sylock="attributes">
    All the attributes of the parent and children elements are locked
</div>