The extension or better the javascript behind it is not restricted to content elements only. You can use it everywhere, e.g. in your template or inside your extension. To make this happen you just need a little a little knowledge how the code needs to look like.
The HTML needs to look like this
<div class=”rgaccord1-nest”>
<h3 class=”rgaccord1-toggle”> Title 1</h3>
<div class=”rgaccord1-content”>
The content 1
</div>
</div>
<div class=”rgaccord1-nest”>
<h3 class=”rgaccord1-toggle”> Title 1</h3>
<div class=”rgaccord1-content”>
The content 1
</div>
</div>
I added a sample of this for tt_news which is saved in res/tmpl/tt_news-rgaccordion1.html but just for the list view! It looks like this in real: http://www.rggooglemap.com/dev/rgaccordion/tt-news.html
The HTML needs to look like this:
<div id=”rgaccord2-nest”>
<h3 class=”rgaccord2-toggle”> Title 1</h3>
<div class=”rgaccord2-content”>
The content 1
</div>
<h3 class=”rgaccord2-toggle”> Title 2</h3>
<div class=”rgaccord2-content”>
The content 2
</div>
</div>
I added a sample of this for tt_news which is saved in res/tmpl/tt_news-rgaccordion2.html but just for the list view! It looks like this in real: http://www.rggooglemap.com/dev/rgaccordion2/tt-news.html
According to a comment on my website this is the way how it should work with TV. This is not tested by me but thanks to Daniel V.
<TypoScript><![CDATA[10= RECORDS10.source.current=110.tables = tt_content10.wrap = <!--TYPO3SEARCH_begin--> | <!--TYPO3SEARCH_end-->10.conf.tt_content < plugin.tx_rgaccordion210.conf.tt_content.stdWrap.wrap = <div id="rgaccord2-nest">|</div>]]></TypoScript>
It would be great If someone could confirm this configuration and write a short note per mail or as comment on my website.
The script of this extension can also be used to create a very nice menue. This could look like this in German http://www.rggooglemap.com/dev/rgaccordion2/in-ein-menue-intergriert.html and English http://www.rggooglemap.com/en/dev/rgaccordion2/integrated-in-a-menu.html .
You will also find a sample of this menu inside the extension directory ext/rgaccordion/res/menu/menu.html.
The needed TS for this is:
# TS Code
lib.accordionmenu = HMENU
lib.accordionmenu {1 = TMENU
1 {wrap = <ul id="rgaccordmenu">|</ul>
noBlur = 1
expAll = 1
NO = 1
NO.wrapItemAndSub = <li>|</li>
NO.linkWrap = <span class="empty">|</span>
IFSUB <.NO
IFSUB.linkWrap = <span class="toggle">|</span>
IFSUB.doNotLinkIt = 1
ACTIFSUB <.NO
ACTIFSUB.linkWrap = <span class="open toggle">|</span>
}
2 <.1
2 {wrap = <ul class="content">|</ul>
NO.linkWrap >
IFSUB.linkWrap = <span class="toggle2">|</span>
ACTIFSUB.linkWrap = <span class="open toggle2">|</span>
}
3 <.2
3 {wrap = <ul class="content2">|</ul>
}
}
# Include the JS and CSS files
page.includeCSS.file7 = EXT:rgaccordion/res/menu/menu.css
page.includeJS.file1 = EXT:rgaccordion/res/menu/mootools.js
page.includeJS.file2 = EXT:rgaccordion/res/menu/menu.js
The values of the classes like “open”, “toggle”, “toggle2” need to stay like this as long as you don't change it in the needed js file too! “open” is required to open the current level (if selected).