I've tried to google and read everywhere including here but no comprehensive tutorial can be found about this.
I want to totally change my topbar to something like this
<ul class="nav navbar-nav navbar-right">
<li>
Friends
</li>
<li>
Inbox
</li>
<li>
Dashboard
</li>
<li>
Settings
</li>
<li>
Logout
</li>
<li>
Announcements
</li>
</ul>
I can basically 'hard-code' this in topbar.php but i'm afraid I may not get the links right. Any best practices suggestions out there for this noob?
Elgg is designed to be plugin-centric, so by default it's expected that a lot of plugins may want to tap to main menu. There are three paths to follow:
Use tool in admin panel: Configure -> Appearance -> Menu Items
Unregister unnecessary menu items with elgg_unregister_menu_item and than rearrange them through plugin hook.
Downside of that is that adding new plugins may add unexpected menu items, but pro is that you may easily redistribute your code without worrying about synchronizing settings set via admin panel.
If you want to take control over whole menu rendering process, you'll want to override view navigation/menu/site and use any markup you desire. Links should be absolute. Use elgg_get_site_url() as the base.
Related
I am looking to get a custom WordPress nav output but I'm struggling to understand where to go with it.
At the moment, the default output for WordPress is this:
<ul>
<li>Link</li>
<li>Link
<ul><li>Link</li></ul>
</li>
</ul>
But what I need to output is the following:
<ul>
<li>Link</li>
<li>Link
<ul><div><span></span><li>Link</li><span></span></div></ul>
</li>
</ul>
Now I know there is the $before and $after in WordPress but unfortunately if you use this it adds it to every link rather than just the child li's that I want it to add them to.
I understand this would be done with using the custom walker method but to say I'm confused is an understatement! Can anyone point me in the right direction?
To modify the output HTML of the Wordpress menu you could use a walker script.
I'm not able to explain this in a simple way myself, but there are good tutorials out there.
As far as I know the default script that Wordpress uses looks like this, and you may with some reading and coding skills be able to create the walker you need from modifying this one with your preferred tags.
I want to display a contextual menu for example in the RedProducts section I want the menu to show:
RedProduct1
RedProduct2
etc, and also the same for BlueProducts, GreenProducts etc when they're selected.
Also it'd be great if these links can display a different class when they're selected. So for example:
<ul>
<li class="link"><a href="/redproduct1" >Red Product 1</a></li>
<li class="current"><a href="/redproduct2" >Red Product 2</a></li>
<li class="link"><a href="/redproduct3" >Red Product 3</a></li>
The Wordpress plugin "Advanced Menu Widget" now does this all for you, very quick and simple, took me ages to find it though.
Hope you are trying to do this. jsfiddle example.
This is how the "contextual menu" works. :) Simply hiding the sub menu and upon clicking the primary menu, it will open with the help of jQuery!
Just apply this to your WordPress menu. Don't forget to include the jQuery library.
I am making a site for a client and they would like a navigation item that has two words linking to two different places. The item is the last one, "twitter/facebook", to the right. Any ideas? http://pixinkdesign.com/clients1/TedX/
Thanks!
You can simply add the links to your template and style as required. They're not page of your site anyway so a simple link in the template should suffice.
Login to your admin panel and go to:
Appearance > Editor
and open up the Header.php file.
You'll see something like:
<ul id="menu">
<?php wp_list_pages('title_li='); ?>
</ul>
Which you can simply add to for your needs:
<ul id="menu">
<?php wp_list_pages('title_li='); ?>
<li>
Twitter
Facebook
</li>
</ul>
I'm trying to transform my primary link menu block in a jquery accordion menu (link text).
I've tested the Accordion Menu module for Drupal, but it does not function for me.
For my Primary Links Block I would have more or less this html output:
<ul id="accordion">
<li>
Recent Entries
<ul id="recent">
<li><span class="date">01.19.2009</span> Recent Entry Title</li>
<li><span class="date">01.15.2009</span> Recent Entry Title</li>
<li><span class="date">01.13.2009</span> Recent Entry Title</li>
<li><span class="date">01.11.2009</span> Recent Entry Title</li>
<li><span class="date">01.10.2009</span> Recent Entry Title</li>
</ul>
</li>
<li>
Recent Entries
</li>
<li>
Popular Entries
<ul id="popular">
<li><span class="date">08.16.2008</span> Popular Entry Title</li>
<li><span class="date">06.12.2008</span> Popular Entry Title</li>
<li><span class="date">04.12.2008</span> Popular Entry Title</li>
<li><span class="date">06.12.2007</span> Popular Entry Title</li>
<li><span class="date">03.12.2007</span> Popular Entry Title</li>
</ul>
</li>
<li>
Categories
<ul id="categories">
<li>Category Name <span class="count">7</span></li>
<li>Category Name <span class="count">4</span></li>
<li>Category Name <span class="count">15</span></li>
<li>Category Name <span class="count">29</span></li>
<li>Category Name <span class="count">8</span></li>
</ul>
</li>
</ul>
I have some primary links with child:
Territory
Map
Gallery
Products
Wine
Glasses
Contacts
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?
I'm sure that jQuery and jQuery UI are working well beacuse I've tested them with the above code in page.tpl.php.
Any ideas?
Thanks
Bye
EDIT
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
function basic_menu_tree($tree) {
return '<ul id="accordion" class="menu">'. $tree .'</ul>';
}
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
I want to customize only Primary Link menu block html and I can't believe there are no solutions...
Thanks
UPDATE
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)!
Bye
Overriding theme functions is the most basic thing done in themes.
Short version is, that if you create a function named [theme_name]_menu_item, that function will be used to generate the html instead of the default one: theme_menu_item. So yes this can be done in your template.php.
Note, the changes will affect all menu items, not just the ones in your primary link menu.
Long version
What's a problem to append jquery accordeon to standard primary menu output? There's everything you need for.
i want to add id tags to primary links menu..
it should look something like this:
<li><a id="home" href="#">Home</a></li>
<li><a id="about" href="#">About</a></li>
<li><a id="contact" href="#">Contact</a></li>
currently, it's just
<li>Home</li>
<li>About</li>
<li>Contact</li>
to change the address to "#" is it ok to use url aliases?
I just want to add attributes to l() when it creates the primary menu, thatz it in a nutshell..
any suggestions?
should i edit any file or create new function to do this job?
I'm using zen theme(just for an info)
many thanks..
It seems like you want to alter the links, so you can add some js tabs. If that is the case:
You shouldn't alter the href value of the links, since it will just break your navigation for those that doesn't use javascript.
If your aim is to add the id's to use them for js, your best option would be to add them using js.
In Drupal, there are some different ways to alter the output of the primary menu.
You can alter the drupal output for menus using theme_menu_item_link, this wont help much though, since, that function is used for all menu items.
Alternative you can handle creating the primary menu yourself in your template.php, but this is probably not worth the bother in this case.
Have you looked at using the Menu Class module? You can create menu class sets and then assign them to each individual menu items.
I use the Menu attributes module. Works great!