Drupal Theme Design Tutorial 2 - Mega Menus. This is the second installment in our ongoing series on unique drupal themeing techniques. As before, my goal is to inform you of the elements you need to design for and demonstrate how to make Drupal not look like Drupal. I just want to throw out a quick thanks for all the positive reactions we had to the first installment. It really helps to know that people are finding our tutorials useful.
We're going to take a quick look at what we are going to be accomplishing today. Good navigation is one of the hardest things to balance on a new site. There are many problems that come into play when we start talking about e-commerce and large corporate website with many tiers of navigation. What is the best way to convey all that information to the user? One of the best things that has come out of the last year or 2 has been widespread use of what are called "mega menus. " Regular primary navigation: After rollover: Just look at how many useful links and features we can squeeze into this area. 1. Tutoriel drupal 7- Créer un module de gestion de menu-deroulant - Modification du template. Add drop down menu support to Bartik.
The Bartik theme doesn't support drop down menus as standard and there are various ways of addressing this, mostly using modules such as superfish. Here's a way of adding them to a Bartik sub-theme, using a couple of theme function overrides and some CSS. We will: add the built in main menu block to the header regionremove Bartik’s main menu implementationapply some CSS to turn the menu into a drop down menu No additional modules required! Add main menu block to header region We will start by adding the main menu block to the header region.
When we refresh the page we should see another menu, albeit expanded, in the header. Remove existing menu First create a sub-theme of Bartik. We can see that in page.tpl.php of Bartik (bartik/templates/page.tpl.php) there’s a line <? Which renders a list of links. Function bartikdropdown_links__system_main_menu() {return null;} Add this to template.php of the sub-theme. Restyle the new menu We can do this by adding to template.php in our sub-theme. Tutoriel drupal 7- Créer un module de gestion de menu-deroulant - Modification du template. Add drop down menu support to Bartik. How to Create Dropdown Menus in Drupal. Nice Menus. Nice Menus enables drop-down/right/left expandable menus. It uses only CSS for most browsers, with minimal Javascript for IE6. (Version 2 uses the Superfish jQuery plugin for all browsers, with an option to disable JS, and falls back to CSS-only for browsers that can handle it.)
Three styles/types of menus are currently possible: horizontal, menus drop down; vertical, menus fly to the left; vertical, menus fly to the right. There is a handbook page that provides a list of sites that use Nice menus. Nice Menus creates blocks that may be associated with any existing site menu which can be placed wherever normal blocks can be placed in a theme. For themers, it is also possible to theme a menu as a Nice Menu directly by using the provided theme functions so a block is not necessary.
A specific theme function for the Primary Links menu is available. If you are having problems with Nice Menus, make sure you read the FAQ and search the issue queue to see if others have already addressed them. Views : afficher du contenu hierarchisé. Cet article est la traduction du billet de Michael Anello : Displaying Hierarchical Content. Vous connaissez Michael Anello : vous avez été nombreux à lire et, je n'en doute pas ;-) , apprécier son papier sur Blueprint CSS. Dans Displaying Hierarchical Content il aborde notamment une des fonctionnalités de Views : les relations.
Avec son accord, ses exemples ont été francisés et j'ai également détaillé le processus CCK de création des types de contenus personnalisés qu'il utilise pour l'article. Afficher du contenu de façon hiérarchisée est un besoin courant pour les sites pilotés par bases de données. Drupal vous offre une grande souplesse pour ces opérations et vous évite d'avoir à écrire la moindre ligne de code si vous utilisez deux modules qui ont déjà fait leurs preuves. Pour notre exemple, disons que vous allez réaliser un site sur les voitures.
Il proposera une liste de marques de voitures et les modèles qu'elles fabriquent. Le type de contenu Constructeurs automobiles.