Drupal a rozbalovací menu se dvěma sloupečky

Rozbalovací menu je běžná věc, kterou najdete téměř na všech webech. V Drupalu ji lze řešit několika způsoby. Tento návod vám ukáže možnost sestavení rozbalovacího navigace, kdy podmenu je rozděleno do dvou sloupců.
reklama

Po dlouhé době jsem se konečně dostal k tomu, abych vám připravil další videonávod věnovaný redakčnímu systému Drupal. Vyzbrojen novým softwarem (ScreenFlow) a sluchátky s mikrofonem od Logitechu jsem se pustil do práce.

Ve videu najdete ukázku vytvoření dvousloupcového rozbalovacího menu pomocí modulu Superfish. Ukázka probíhá na testovacím webu využívajícím vzhled Danland. Seznam odkazů pro stažení zmiňovaných témat a modulů je zde:

V návodu uvidíte sestavení struktury menu, nastavení rozbalování, správné zprovoznění modulu Superfish v tématu vzhledu Danland, sestavení dvousloupcové rozbalovačky a nastylování menu Superfish tak, aby zapadalo do vzhledu Danlandu.

CSS, které v tomto návodu pro Drupal zmiňuji, můžete zkopírovat odtud:

.sf-menu.sf-style-default{ margin-top: 0; }

.sf-menu{ line-height: 0.9; }

.sf-menu.sf-style-default li, .sf-menu.sf-style-default.sf-navbar { background: transparent; }

.sf-menu.sf-style-default a, .sf-menu.sf-style-default a:visited { color: #fff; }

.sf-menu.sf-style-default li:hover,

.sf-menu.sf-style-default li.sfHover,

.sf-menu.sf-style-default a:focus,

.sf-menu.sf-style-default a:hover,

.sf-menu.sf-style-default a:active { background: #295b8f;  outline: 0; }

.sf-menu.sf-style-default li li{ background: #295b8f; }

.sf-menu.sf-style-default li li a:hover{ text-decoration: underline; }

Zde pak máte samotné slíbené video s návodem pro rozbalovací menu v Drupalu.

Připomínám, že tématu rozbalovacího menu v Drupalu jsem se věnoval i dříve, například v článku Jak na rozbalovací menu v Drupalu jen s CSS a bez doplňkových modulů.

Tagy
Autor článku: Jan Polzer

Tvůrce webů z Brna se specializací na Drupal a Symfony. Obojí také školím spolu se základy SEO. Jsem Acquia Certified Developer a Site Builder a napsal jsem několik knih o Drupalu. Ve volných chvílích cestuji a podnikám výlety. Více se dozvíte na mém firemním webu.

reklama

Komentáře k článku

návštěvník

Dobrý den,

Dle Vašeho videonávodu vše funguje výborně ve FIREFOXU, ale už ne v GOOGLE CHROME.
( používám STARK ). V GOOGLE CHROME se menu nezobrazí. Děkuji za radu. Jirátko

Přidat komentář

Filtered HTML

  • Povolené HTML značky: <a href hreflang> <em> <strong> <cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <p> <br>
  • Řádky a odstavce se zalomí automaticky.
  • Web page addresses and email addresses turn into links automatically.

Odesláním komentáře souhlasíte s podmínkami Ochrany osobních údajů

reklama
Sledujte Maxiorla na Facebooku

Maxiorel na Facebooku

Poslední komentáře
reklama
Nové diskuze
reklama
Hosting pro Drupal a WordPress

Hledáte český webhosting vhodný nejenom pro redakční systém Drupal? Tak vyzkoušejte Webhosting C4 za 1200 Kč na rok s doménou v ceně, 20 GB prostoru a automatické navyšováním o 2 GB každý rok. Podrobnosti zde.

Knihy o Drupalu

Kniha Drupal 8 Kniha Drupal 7 333 tipů a triků pro Drupal
Více na KnihyPolzer.cz

Co píší na Interval.cz
@maxiorel na Twitteru

Maxiorel na Twitteru