Forums

In edit mode ccm code showing in accordion

Permalink
Hi,

I'm building a site with a zozo accordion as part of some of the pages. This works fine however the trouble is whenever in edit mode it fills the accordion up with ccm javascript code. It looks like the <li>'s for the menu which is displayed when you click on a block region (see attached pic). How can I stop this displaying in edit mode.

The block displays perfectly outwith edit mode.

The structure for a zozo accordion is an <ul> for the wrapper with id #accordion, then each sub drawer is an <li> with <h3> title and a <div> wrapping that item's content. I think I need to change the scope of something somewhere to prevent this happening.

Accordion region code is:
<!-- Accordion / Technical Details -->
          <div class="listing-wrapper">
            <ul class="accordion-container" id="accordion">
              <?php 
                $a = new Area('Accordion');
                $a->display($c);
                ?>
            </ul>
          </div>
<!-- End Accordion / Technical Details -->


to which I add a block to each section that is basically a table wrapped in <li></li> for each accordion drawer.

Any help would be much appreciated.

1 Attachment

 
JohntheFish replied on at Permalink Best Answer Reply
JohntheFish
You can place a test for edit mode and only output the critical class or id marker the accordion script keys on when not in edit mode.

eg
if (!Page::getCurrentPage()->isEditMode()) {
  echo accordion_marker
}
danielcwaghorn replied on at Permalink Reply
Got it working by doing this: 
<!-- Accordion / Technical Details -->
          <div class="listing-wrapper">
            <?php if (Page::getCurrentPage()->isEditMode()) {
                  $a = new Area('Accordion');
                  $a->display($c);
                } else {
                echo '<ul class="accordion-container" id="accordion">';
                $a = new Area('Accordion');
                $a->display($c);
                echo '</ul>';
                } ?>
          </div>
<!-- End Accordion / Technical Details -->


which is only outputting the <ul> when not in edit mode. I could have had it output the marker in the drawer blocks but it's not necessary in this case.

Many thanks for your help.