Skip to main content

Post categories

  • Drupal Tips & Tricks
  • Drupal Howtos
  • Drupal Themes
  • X Twitter
  • youtube
Home
Drupal 4U
Drupal Development, Drupal Web Design, Drupal SEO
  • Home
  • Showcases
  • Services
  • Blog
  • Themes
  • About
  • Contact

Breadcrumb

  1. Home
  2. HowTos
  3. How to make the Drupal superfish menu work properly with the Drupal theme MD Alpine (7.x-2.6 )

How to make the Drupal superfish menu work properly with the Drupal theme MD Alpine (7.x-2.6 )

HowTos
July 24, 2014
Profile picture for user drupal
By drupal
  • facebook-f
  • twitter
  • envelope
  • print
50

The Alpine theme from Megadrupal (7.x-2.6 ) is supposed to work with the Drupal superfish menu. The installation and configuration works smoothly. But although the configuration instructions under http://megadrupal.com/forum/theme-support/alpine/514 are followed there is a very significant problem: The submenu only opens on click. Okay, this is a matter of taste. But the problem is, that the main menu link isn't working. The link is there and it even can be opened in a new window, but it doesn't open on click. To solve the problem you can do the following:

Solution

Step 1: Disable the option "Use a theme function for hyperlinks"

You find this option in the superfish menu block settings under "More options" (see picture).

Step 2: Edit the superfish.js (which has been modified by Megadrupal)

You find the file in the following folder: sites/all/libraries/superfish

Change the line

$$.click(function(){$(this).showSuperfishUl().siblings().hideSuperfishUl();});

to

$$.showSuperfishUl().siblings().hideSuperfishUl();

Step 3: Adjust the CSS formating for responsive screens

Now the "click function" is removed and the submenu opens on hover. This is fine for large screens but looks ugly on mobile screens, where the responsive stylesheet style-responsive.css is applied. Thus you can add some lines to the section @media (max-width: 767px) to make it look nicely. In my case I added:

.dropdown-menu {
position: static;
float: none;
background-color: rgb(34, 34, 34);
box-shadow: none;
border: none;
padding: 0px 0px;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
color: rgb(255, 255, 255);
background: none repeat scroll 0% 0% transparent;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a {
border-bottom: 1px solid rgb(51, 51, 51);
line-height: 25px;
}

How to make the Drupal superfish menu work properly with the Drupal theme MD Alpine (7.x-2.6 )
Troubleshooting

Read more articles

Newer
How to add rel=“author” attribute / the Google+ Publisher tag to Drupal
Older
Shadowbox gallery displays only the first image on a multi-image field (option "compact")
  • Log in to post comments
Profile picture for user drupal
drupal
50
1
min read
A- A+
  • facebook-f
  • twitter
  • envelope
  • print

Contact Drupal 4U

Get in touch for questions and our Drupal development, design and SEO services.

Contact Us

We aim to reply the latest within 48h.

About Drupal 4U

We are a group of Drupal designers, developers and webmasters and we launched this website to share our experience and knowledge with you. Drupal is a free software package that allows you to easily organize, manage and publish your content, with an endless variety of customization. Drupal is open source software maintained and developed by a very large community of developers and users.

  • X Twitter
  • youtube

Drupal Services

  • Drupal Web Design
  • Drupal Development
  • Drupal SEO
  • Drupal Migration

Drupal 4U

  • Services
  • Showcases
  • Themes
  • Blog
  • About

Drupal Links

  • Official Drupal Website
  • Drupal Answers
  • More Than Themes
  • Theme Forest
  • DXPR: Drupal for Marketers
2012 - 2025, Drupal 4U

Footer menu

  • Contact
Home
Drupal 4U
Drupal Development, Drupal Web Design, Drupal SEO
  • Home
  • Showcases
  • Services
  • Blog
  • Themes
  • About
  • Contact
Clear keys input element