CMS module Content Toggle (expand/collapse)

Content toggle plugin 1.3

What does this do?

It creates a div ("block") witch can collapse and expand by pressing the bar, it uses JQuery.

Download here!

How install it?

1) Extract all files in respective directories (lib/toggle/... plugins/... )

After refresh, Extensions>Tags will list a "toggle_close" tag and "toggle_start".
Now the plugin is installed.

2) Load Jquery
Make sure jQuery library is loaded by inserting this script. Make sure you enter this code between your section of your pagetemplate.
(Not needed if you already have Jquery installed)

you can use this:

 <script type="text/javascript" src="lib/toggle/jquery.js"></script>
 
</head>

Or use jQuery script from Google:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

Edit TinyMCE settings for easy use. (optional)

Goto admin / Extentsions /TinyMce WYSIWYG
open tab Advanced, scroll down and edit "Custom dropdown:"

add this code or change original:
---|--- Start expand/collapse-area|{toggle_start title=\'This is my expandable area\'} End expand/collapse-area|{toggle_close} ---|---

and save
now you can use the icon "Specific Dropdown-menu" in TinyMCE menubar.

How do I use it?

Just insert the tag into your content or template like: {toggle_start title="text line for the top bar"}
and close it with {toggle_close}

For example:
{literal} {toggle_start title="Web Design & Development" width="700" status="active"} HTML code like pictures, text, ... <h3>Need a Website?</h3> <p> ... www.web2do.be ...</p> {toggle_close} (This 'll show contentoggle window, expanded and 700 width)

Change the looks

For personal changes you can edit the top bar (< your cms root >/lib/toggle/trigger.gif) like this example:

You can also adjust the looks by adjusting the CSS file : (< your cms root >/lib/toggle/stylesheet.php)

Parameters

(optional) title="some text here" - Display title in bar.
(optional) status="active" - This 'll show the content, if omitted the content 'll be collapsed by default.

(optional) width="700" - Controls the width of your content.
if not set then default width = 625px;
Warning: when using multiple content toggle windows it only needs to be set in the first toggle definition. Else this settings won't work.