Note that there are some explanatory texts on larger screens.

plurals
  1. PODrupal 6x - Primary Links jquery accordion menu
    text
    copied!<p>I'm trying to transform my primary link menu block in a jquery accordion menu (<a href="http://jqueryui.com/demos/accordion/#collapsible" rel="nofollow">link text</a>). I've tested the Accordion Menu module for Drupal, but it does not function for me.</p> <p>For my Primary Links Block I would have more or less this html output:</p> <pre><code> &lt;ul id="accordion"&gt; &lt;li&gt; &lt;a href="#recent" class="heading"&gt;Recent Entries&lt;/a&gt; &lt;ul id="recent"&gt; &lt;li&gt;&lt;span class="date"&gt;01.19.2009&lt;/span&gt; &lt;a href="#"&gt;Recent Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;01.15.2009&lt;/span&gt; &lt;a href="#"&gt;Recent Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;01.13.2009&lt;/span&gt; &lt;a href="#"&gt;Recent Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;01.11.2009&lt;/span&gt; &lt;a href="#"&gt;Recent Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;01.10.2009&lt;/span&gt; &lt;a href="#"&gt;Recent Entry Title&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt; &lt;a href="#recent" class="heading"&gt;Recent Entries&lt;/a&gt; &lt;/li&gt; &lt;li&gt; &lt;a href="#popular" class="heading"&gt;Popular Entries&lt;/a&gt; &lt;ul id="popular"&gt; &lt;li&gt;&lt;span class="date"&gt;08.16.2008&lt;/span&gt; &lt;a href="#"&gt;Popular Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;06.12.2008&lt;/span&gt; &lt;a href="#"&gt;Popular Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;04.12.2008&lt;/span&gt; &lt;a href="#"&gt;Popular Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;06.12.2007&lt;/span&gt; &lt;a href="#"&gt;Popular Entry Title&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;span class="date"&gt;03.12.2007&lt;/span&gt; &lt;a href="#"&gt;Popular Entry Title&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt; &lt;a href="#categories" class="heading"&gt;Categories&lt;/a&gt; &lt;ul id="categories"&gt; &lt;li&gt;&lt;a href="#"&gt;Category Name&lt;/a&gt; &lt;span class="count"&gt;7&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Category Name&lt;/a&gt; &lt;span class="count"&gt;4&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Category Name&lt;/a&gt; &lt;span class="count"&gt;15&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Category Name&lt;/a&gt; &lt;span class="count"&gt;29&lt;/span&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Category Name&lt;/a&gt; &lt;span class="count"&gt;8&lt;/span&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;/ul&gt; </code></pre> <p>I have some primary links with child:<br></p> <ul> <li>Territory <ul> <li>Map</li> <li>Gallery</li> </ul> </li> <li>Products <ul> <li>Wine</li> <li>Glasses</li> </ul> </li> <li>Contacts</li> </li> </ul> <p>Devel Themer Module says that I must override "theme_menu_item" function but I don't know how to proceed. Can I reach my goal only editing this function in the "template.php" file?</p> <p>I'm sure that jQuery and jQuery UI are working well beacuse I've tested them with the above code in page.tpl.php.</p> <p>Any ideas? Thanks Bye<br></p> <p>EDIT<br><br> I've read a lot of docs and drupal forums, but I can't find a similar request. I can simply edit only primary links html without child using this code that add id tag to ul</p> <pre><code>function basic_menu_tree($tree) { return '&lt;ul id="accordion" class="menu"&gt;'. $tree .'&lt;/ul&gt;'; </code></pre> <p>} </p> <p>The problem comes with child ul, in fact the above function add id="accordion" tag also on child ul with bad effect to jquery script</p> <p>I want to customize only Primary Link menu block html and I can't believe there are no solutions... Thanks</p> <h1>UPDATE</h1> <p>I've resolved using above function in template.php file and adding a header class through jquery script to primary link parents to setting jquery ui accordion header options (http://jqueryui.com/demos/accordion/#option-header)!</p> <p>Bye</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload