0

I have a HTML snippet as below.

 <div id="mydivid" class="abcd xyz myclass">
....
...
</div>

I have wrote it in below way. but it doesn't shows the entire dive in wcmmode=disabled.

<div data-sly-test.editor="${wcmmode.edit || wcmmode.design}">
<div id="mydivid" class="abcd xyz myclass">
</div>
....
...
<div data-sly-test.editor="${wcmmode.edit || wcmmode.design}">
</div>
</div>

Is there any way to add "myclass" value to the class attribute alone only in author mode and not in preview or disabled mode of AEM page.

krish
  • 469
  • 1
  • 15
  • 34

2 Answers2

5

HTL provides better flexibility to write test conditions which avoids using the JSTL style if conditions. Your code can be easily written as shown below

<div id="mydivid" class="abcd xyz ${wcmmode.disabled ? '' : 'myclass'}"></div>

In case you don't want any classes in publish, then

<div id="mydivid" class="${wcmmode.disabled ? '' : 'abcd xyz myclass'}"></div>

The HTL specification for reference.

rakhi4110
  • 9,253
  • 2
  • 30
  • 49
0
<sly data-sly-test="${wcmmode.edit}">
<div id="mydivid" class="abcd xyz myclass">
</div>
</sly>
<sly data-sly-test="${wcmmode.disabled}">
<div id="mydivid" class="abcd xyz">
</div>
</sly>

Try this, as it will display your myclass only in edit mode, in wcmode=disabled mode, it will display the resepctive class without myclass