Next Tutorial
Drupal 7 Tutorial Part 15: Drupal 7 Advanced Taxonomy Concepts
Drupal 7 Tutorial Part 9: How to re order menu links using drag & drop / menu links weights
Hi Drupalers,
In last tutorial, we saw how to create a new menu from scratch. In this tutorial we are going to learn below mentioned topics.
- Changing order of menus using drag & drop / weight option inside menu edit page.
How to reorder menu links in drupal 7 ?
In last tutorial we created menu called "Administration Shortcuts" with two links. Let's reorder these menu links. You can see menu in the left side bar as shown below.

In the menu "blocks landing page" link appears first then "user listing". Let's change this order of menu links. To quickly navigate to administration of this menu, login as admin and hover on the block. You can see a wheel like icon on top. Click on that icon. Then, click on "list links" link to go to list of links in this menu. You will see something like below.

Now take your mouse on top of block landing page, hold the right mouse button and drag it to down. Once you drag it to down holding mouse button, screen will look like below.

By dragging the link downwards, you reordered the menu link. Now click on save below to save the changes. After saving go to home page to see the changes. Now user listing comes on top.
How to reorder menu links in Drupal 7 using weights ?:
In last section, we saw how to reorder menus using drag and drop feature. Let's see now how to reorder the menus using weight option. Both, will do the same job actually. Now by changing the weights let's reorder our menu links.
Open the list of "Administration Shortcuts" links just by following steps discussed above. You will see the page like in screen shot 2. As you see now "User listing" links appears first then "Blocks landing page" appears second. Let's change this order.
- Click on edit link next to "User listing" link. Then choose weight select box just above save button. You will see something like below.

- Remember lighter one floats and heavier one sinks. Means smallest number goes to top and highest number to bottom.
- As you see currently this menu link has weight -50 and "Blocks landing page" has weight -49. Since we know -50 < -49 "Blocks landing page" goes down.
- Change the menu link "user listing" weight to "-48" so that it goes below "Blocks landing page" since -49 < -48.
- After changing from -50 to -48 click on save. To see the change go to home page. Now "Blocks landing page" appears first. We normally adjust weights of menu links relatively to other links in the menu.
In drupal 7, where ever weights appears they follow the same rule. Lighter one floats and heavier one sinks. Means smallest number goes to top and highest number to bottom.
Hope, you learnt how to reorder menus and how to use weights concepts. Stay tuned for more tutorials.
Cheers,
Anil Sagar

11 comments
No Drag Icon
Hi Anil,
I have the silliest problem: unlike in your screen shot, I seem to be missing the little "drag" cross icon. Am I missing a setting? A module? Any help would be greatly appreciated!
Thanks for all your hard work!
Alli
Hi Alli
Please verify java-script is enabled in your browser and no java-script error in the page because of any custom code using firebug plugin in Firefox.
Cheers,
Anil Sagar
Hi Anil, It was turned on,
Hi Anil, It was turned on, but, I disable and re-enabled it after I updated my browser. When everything restarted, I had the options. Thanks for the tip!
I can't get the menu items to
I can't get the menu items to move. I click and drag but it doesn't move
Very impressed
Let me add my appreciation for the tutorials you have provided. I recently discovered Drupal and have been having difficulty with many of the concepts and techniques. Your use of natural 'human' language is especially appreciated. I look forward to seeing more installments.
Thank you
Hi J E Slone,
Thank you very much for your appreciation. It helps me to write more articles!
Cheers,
Anil Sagar
Your all tutorials are
Your all tutorials are awesome..
beginners can get allot from it..
Can you also produce stuff like that for drupal templating..
Thanks for the stuff..
Replace Home menu option with an house icon
Hi there,
Any trick for replacing a Home menu option with the House icon like in the admin menu ?
Great tuto !
Thanks a lot
Change the favicon
HI,
Just goto appearance>> select seven theme settings, then remove default favicon and upload your own icon.
Cheers,
Anil Sagar
RSS would be great
As I recommendation it would be great if the page had an RSS or something allowing us to follow you, I definitely will become your fan.
Hi
Thank you very much for following my articles. Here is the RSS feed link. http://www.anilsagar.com/rss.xml
You can subscribe to google feedburner also. Link is available on right side bar.
Cheers,
Anil Sagar
Post new comment