Results 1 to 6 of 6

Thread: {solved] Accordion in MM list ?

  1. #1
    User
    Join Date
    04-01-10.
    Posts
    289

    Default {solved] Accordion in MM list ?

    Hi everyone,

    I'm looking for how to display MM list items as accordions. My items are :
    - H2
    - Text
    - Text
    - Text

    - H2
    - text
    - text
    - text

    H2 must be the toggler to make the three text blocks visible or not.

    js_accordion is activated. I tried to copy ce_accordion code but with no success. Thanks for your help.
    Last edited by charled; 07/26/2021 at 02:03. Reason: Solved

  2. #2
    User zonky's Avatar
    Join Date
    11-29-11.
    Location
    Berlin
    Posts
    159

    Default

    Quote Originally Posted by charled View Post
    Hi everyone,

    I'm looking for how to display MM list items as accordions. My items are :
    - H2
    - Text
    - Text
    - Text

    - H2
    - text
    - text
    - text

    H2 must be the toggler to make the three text blocks visible or not.

    js_accordion is activated. I tried to copy ce_accordion code but with no success. Thanks for your help.
    Did I understand correctly that your items are output as follows?

    HTML Code:
    Item 0:
    - H2
    - Text
    - Text
    - Text
    
    Item 1:
    - H2
    - text
    - text
    - text
    If so, you must adapt your template "metamodels_*.html5" accordingly. I would proceed as follows:

    * Create a test page and insert an accordion with two elements - check in the FE whether everything is OK.
    * look at the source code and build the corresponding DIVs and CSS classes into your MM template.
    * you don't have to insert js_accordion.html in the layout - you can also insert the content of the template at the end of your MM-template.

    Note that you only have to output one accordeon block in the "foreach" loop that goes through all the items - all the others are created by the loop.
    Last edited by zonky; 07/24/2021 at 11:49.

  3. #3
    User
    Join Date
    04-01-10.
    Posts
    289

    Default

    Hi Zonky,
    Thanks for your answer. I tried. I will try again ;-)

  4. #4
    User zonky's Avatar
    Join Date
    11-29-11.
    Location
    Berlin
    Posts
    159

    Default

    post your template if it does not work

  5. #5
    User
    Join Date
    04-01-10.
    Posts
    289

    Default

    Ok, this works but...

    1. I think the problem was here
    PHP Code:
     <div class="<?= $this->toggler ?>"<?php if ($this->headlineStyle): ?> style="<?= $this->headlineStyle ?>"<?php endif; ?>>
    PHP Code:
    $this->toggler 
    is empty as it is not a real ce _accordion. So it outputs with ID="".
    So I replaced it by
    PHP Code:
    id="ui-id-<?php echo $arrItem['raw']['alias']; ?>"
    2. But there is a still little problem : the first item is automatically deployed when the page is loaded. Don't see how to close it by default.

  6. #6
    User
    Join Date
    04-01-10.
    Posts
    289

    Default

    And finally I found.
    Code:
    active= false,
    in j_accordion options.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •