On Monday 14 Feb 2011 8:06:22 pm Harald C. wrote: > Hi, > > I would like to include a jQuery (or similar) Accordion widget in one of > the pages of a PMWiki. > This would require > (1) to insert a call to one or two JavaScript files for that page only > (2) include a css file in the head section for that page only
1. Install jquery, jquery.ui and jquery.ui.accordion User this as reference: http://jqueryui.com/demos/accordion/default.html 2. If the intended page is Main.HomePage create Main.HomePage.php file in local folder. add the lines below with correct .js and .css paths -------------snip $HTMLHeaderFmt[] = " <link href='$PubDirUrl/path/to/jquery.ui.all.css' rel='stylesheet' />"; $HTMLHeaderFmt[] = " <script src='$PubDirUrl/path/to/jquery-1.4.4.js'></script> <script src='$PubDirUrl/path/to/jquery.ui.core.js'></script> <script src='$PubDirUrl/path/to/jquery.ui.widget.js'></script> <script src='$PubDirUrl/path/to/jquery.ui.accordion.js'></script> "; $HTMLHeaderFmt[] = " <link href='$PubDirUrl/path/to/custom.css' rel='stylesheet' />"; $HTMLHeaderFmt['accordion'] = " <script> $(function() { $( \"#accordion\" ).accordion(); }); </script> "; ------------------ > (3) apply the prescribed HTML markup in that page where the accordion > should appear like: > > <div id="accordion"> > <h3 class="accordion_header"><a href="#">First header</a></h3> > <div class="accordion_content">First content</div> > <h3 class="accordion_header"><a href="#">Second header</a></h3> > <div class="accordion_content">Second content</div> > ... > </div> > 3. Add sample wiki text in Main.HomePage ---------snip (:div0 id=accordion:) !!![[#a | Section 1]] >>acc<< Some text in the first section. a bit more... >><< !!![[#a | Section 2]] >>acc<< second section content goes here.... >><< !!![[#a | Section 3]] >>acc<< third section content goes here.... >><< (:div0end:) ------------ NOTE: !!![[#a | Section 1]] produces: <h3><a href='#a'>Section 1</a></h3> and not <h3 class="accordion_header"><a href="#">First header</a></h3> If you are planning to use the default accordion provided by Jquery this should work. See: http://jqueryui.com/demos/accordion/ Regards, V.Krishn > In the page I only need the header and content of the accordion sections > to be editable. > > For (1) I found several recipes but don't know which one to use in this > case; for (2) and (3) I don't know how to proceed. > > Could someone please help me? > > Thanks, > Harald > > _______________________________________________ > pmwiki-users mailing list > [email protected] > http://www.pmichaud.com/mailman/listinfo/pmwiki-users _______________________________________________ pmwiki-users mailing list [email protected] http://www.pmichaud.com/mailman/listinfo/pmwiki-users
