I got a work to recreate a website. In that website, There is a menu bar which containing 17 main menu items and their sub menu. The problem is how to design a such a large menu bar. right now its look like this
I need to redesign this structure and i'am looking out for some decent way to display this links. My question is completed related to design.
Any suggestions would be a great help..
Thanks in advance.
No doubt, you should consider simplifying this menu by classifying and regrouping menu items. In this form your menu is simply not usable, so instead of trying to display this, try to simplify it first, and the solution will come naturally.
In other words - "divide to conquer".
There is always a way to classify 17 elements in not more then 5 or 6 on the top level.
A simple example - "Member ID" and "Member Search" could probably belong to a same "Member" Menu. You should also consider submenu items and not only these 17. They can probably be somehow reorganized and restructured so you have not more then 5-6 items in each group.
17 Main menu items are a lot for navigation bar.
look at the fullscreen nav in this website.u can try this or have an off-canvas like this website
Related
There are two different websites with drop-down menus, but only one is having the appropriate "branch-out" affect.
Picture 1 is the one not branching and picture 2 is doing what I want:
No Branch
Branch
The menu that is correct is using a tree menu widget and the other is not, only a breadcrumbs widget. As you can see I added a "Test Page" under Government, but it is simply at the bottom of the menu. If it's just a matter of inserting a Tree Menu widget to get the affect I want, I'll do that, but I wanted to see if there was another solution first. Thanks.
Looks like it could be an issue with the webpart used for the menu. So the one site showing correctly may have the levels set to the necessary depth whereas the other site may not. This doesn't seem to be the case though as the webpart is picking up the "Test Page" but not the "Tax Matters" page.
It could also be an issue with the overall design of the site's menu. Maybe the site's menu wasn't designed with 3 levels of depth on it. To check this you can go to the webparts transformation property and see if there are multiple levels setup to display that 2nd and 3rd level nested within one another.
Not knowing the configuration of your webpart or the transformation makes it a bit harder to actually troubleshoot.
I have menu in which there are two levels. After I added the third and fourth level of categories from the back end, I want the third sub-category in the menu to be displayed differently I want to change its appearance. Can i do it in back end custom design? Or where should I look for the code? I have tried editing the top menu p html
You should edit the relevant PHTML file in order to do this.
Sometimes you will have to edit menu.js as well written in prototype. if you are not familiar with it use a jQuery code.
I want to implement a screen to display a tree of comments in WP7. Each comment can have children comments and so on. Each child comment will be visually distinct from its parent via indenting
ie:
"comment text"
"Some child comment text"
"Some child comment text"
"some child comment text"
"comment text"
"Some child comment text"
What would be the best way to go about implementing this? I'd like to keep the implementation as simple as possible so initially I was thinking I could use a single ListBox and programmatically set the Padding/Margin of each comment/ListItem, depending on its depth in the tree. But I can't seem to get it working. Any examples, suggestions, recommendations, etc?
Edit: Doing some additional reading, it seems like a DataTrigger would have been perfect for this sort of thing http://www.codeproject.com/Articles/113152/Applying-Data-Templates-Dynamically-by-Type-in-WP7 ...But WP7 doesn't support triggers.
One other idea I had was to make the Margin/Padding a Property of the Comment class, and then databind to that...this should work, but I'm contaminating my Comment class with display information. Any ideas on how I could databind the Margin/Padding value but somehow not mix model & view codes?
You'll have to roll your own, either from scratch, or by assembling something out of existing controls. ListBox looks like a good bet for this purpose.
Take a peek at this MSDN thread (web archive - thread now moved/deleted), it has several suggestions about simulating a TreeView using a ListBox, and a claim (which I have not verified) that you can use System.Windows.Controls.TreeView in WP7 (with the caveat that you also need System.Windows.Controls.Toolkit).
The marked answer, written by Shaun Taulbee:
Tree view behaviour in a listbox could be mimiced with a bit of smarts in the collection handling. Features your classes would need to support that come to mind are
a collection whose elements supports retrieving child collections
similarly to be able to detect if an element has child collections
in the data template for the listbox show one element of the stackpanel for expansion state based on presence of children and whether or not expanded
in the data template for the listbox show one element of the stackpanel for indent which reflects the depth of the child - to accomplish this best you should have a collection that represents a flat version of your tree data to bind to - then when you insert items you can make the indent based on the indent of the parent item that was just clicked
when a node is clicked in the listbox you insert the children from that node into the flat collection that the listbox is bound to
when the node is clicked again the children are deleted from the flat collection
You could encapsulate all of this into some neat classes to provide a fairly simple reusable api I would imagine if you wanted.
This thread has a fair amount of noise, but down at the bottom there's a comment from Mark Chamberlain:
"TreeView is not a natural fit for the phone, you can emulate Treeview
in other ways, for example, with ListBox item templates, Pivot or with
other List patterns. It will depend on how many levels of the tree
you will have.
"For example, you can template your ListItem to contain a label and
another Listbox with same item template. Doing this you can emulate
as many drill in levels as you need to handle, but only one branch at
a time."
"You may be able to re-template the TreeView (source is also available
in the Silverlight Toolkit), but it isn’t a supported scenario, and
you would need to do a decent amount of work to get it looking good on
the phone from a design & re-templating standpoint."
The following should be good starting points, both altering the ItemTemplate for a ListBox control :-
http://3water.wordpress.com/2010/07/25/listbox-on-wp7/
http://weblogs.asp.net/psheriff/archive/2010/10/27/windows-phone-list-box-with-images.aspx
For WP8 you can use this one TreeView_WP8
I want to add dynamic menu table in inner pages based upon the tabs on the home page.
how to do that in joomla,please help me.
It sounds like you are trying to create a split menu where the link you click at the top determines the menu that shows up in a column/below. This is the native behavior for Joomla menus simply by setting the start and end levels in the menu module. Here is a good tutorial -
http://www.theartofjoomla.com/magazine/article/27-more-menu-tricks-the-split-menu-technique.html
Beware:: The split level menu feature in Joomla only works when the split equals TWO levels. If you want to build your site with a single master menu that spans 3 or more levels, this does not work. It looks like the internals of Joomla do not know how to track the parent properly (not really sure) when the menus are generated (probably an overstatement). Level 1:1 works, Level 2:2 works but then when you try to specify a menu starting at level 3, it breaks. In my case, I hacked the menu to check the pathways (breadcrumbs) list and derive what I wanted from it so I could determine the real parent of the items at level 3 (or other). Then I could get the items to generate proper. This was a disappointment in Joomla (v1.7). And then on top of this, you would then have to hack further to ensure that each menu item instance starting at 1 is highlighted proper. Perhaps the menus should be more closely coupled to the breadcrumbs pathway list.
I'm designing user interface and want to ask your advises how to make it more user-friendly. Please tell any suggestions and if you have ever seen implementation of something familiar please share the link.
University. There are 40+ specialities grouped into 5 faculties. User choose several he is interested in and than orders them by priority.
For example I am interested in "programming microcontrollers", "system analysis" and "experimental physic". I must find them quickly in "programming faculty", select them and then order - what I prefer most and what I prefer less then others I select.
Any ideas welcome :)
Checkboxes and radio buttons would be appropriate for this, for both websites and desktop applications.
In my case I'd use the faculty names as headers and then add the according specialities below them, prefixed by checkboxes and radio button next to each speciality, allowing the user to set the priority.
A picture is worth a thousand words:
http://i45.tinypic.com/2ex6jy0.png
I would go for the "List builder" design pattern.
The list builder contains two lists. On the left side you have the source list (ie. the complete list of faculties/specialties), and on the right side you have the source list (the items chosen by the user in prioritized order).
Between the lists you have two buttons. "Add" (arrow to the right) and "Remove" (arrow to the left), wich adds and removes items to the destination list.
In addition you put two buttons along with the destination list. These are used for rearranging the destination list.
Eg. "Move up" and "Move down" for moving the selected item up and down.
Se examples:
http://msdn.microsoft.com/en-us/library/aa511484.aspx#listBuilders
http://osdpl.fluidproject.org/designPatterns/List-Builder