Here are the prerequisite for this article:
If you need help setting up your website, perhaps you should first read How to setup a multilingual website with Drupal 7.
What I'll be covering in this article is how to create English-French bilingual menus. I'll be working from the English interface of my website. That's why you'll see a language prefix in each of the given URL (i.e. "en/...").
Alright, let's go!
en/admin/config/regional/i18n/variable,select the Source for the Main links in the list of variables to be translated & save the configuration. More about this a little later.
Now we need to create 2 custom menus: one for English and one for French. Note, we don't need & will not use the Main menu.
en/admin/structure/menu/addand create the English menu
Repeat the procedure and create the French menu
en/admin/structure/menu/addand create the French menu
en/admin/structure/menu, you should now see the following
Now we need to tell Drupal to bypass the Main menu which is enabled by default and, instead, use the custom menus we've just created.
Click on the Settings tab or go to
Look at the Source for the Main links selector. The 6 menus listed above should all appear as options in the drop down menu. Take a few seconds to read the help text that appears underneath this selector. Note the This is a multilingual variable which appears in bold. This is the direct result of the configuration we did at
en/admin/config/regional/i18n/variable. What it means is that the selection for Source for the Main links applies ONLY to the current interface. In other words, if you are in the English interface of your website (look for the "/en/" in the URL), the selection you're about to make & save will only apply to the English pages. So to set the Source for the main links for French pages, you must first switch to the French interface.
Make sure you fully understand this notion of multilingual variable otherwise you will likely run into trouble later on.
Assuming you are, as I am, on the English interface of your website
Repeat for French. Remember, that means you first have to switch to the French interface.
Now we need to add menu items, right? We need to populate MAIN ENGLISH MENU and MAIN FRENCH MENU.
Since we're working from a fresh D7 install, I'm assuming your default home page is something like "example.com/en". You can check this out by going to
en/admin/config/system/site-information. In the Default front page field, you should see node. That's the Drupal 7 installer default home page.
Adding the Home menu item:
en/admin/structure/menuand click list links for MAIN ENGLISH MENU.
Here are the settings for the Home menu:
Repeat for French
en/admin/structure/menuand this time click list links for MAIN FRENCH MENU.
That should do it. Go to your home page and try using the Languages block to switch from one language to another.
This is the way menus are setup on my website. Note that, at the time of writing this article, there are 5 French menus and only 3 English menus.
For the Contact menu on d7One, I fist added a category (
en/admin/structure/contact). And then created menu items in MAIN ENGLISH MENU and MAIN FRENCH MENU. In my case, both menu items have the same name (Contact) and path (contact). The only difference being the Parent link for the English Contact menu is set to MAIN ENGLISH MENU. The Parent link for the French Contact menu is set to MAIN FRENCH MENU.
Voilà. Hope this helps. Questions & comments welcome.
When you create an Article, if the custom menus we've just created (MAIN MENU FRENCH and MAIN MENU ENGLISH) are not listed in the drop down menu Parent item which appears when you click Provide a menu link in the Menu settings tabs, then you need to edit the Article content type.
Thanks to bobafett for asking, Luca Barbetti for answering and Jupiter for suggesting this update.