Drop Down Menu Mod

[Dan Nickerson]

IN VERSION 2.2 WE ADDED DROP DOWN SUPPORT AND THIS MOD IS NO LONGER NECESSARY

We have customers who requested drop down menu support for Socrates

I've created a mod that will now allow you to use a drop down menu to replace your primary navbar.

I want to emphasize that this is for semi-advanced users, and I would like to request that you not ask us about customization..

The plugin you'll be installing has lots of info on this on their site.

Here's my drop down menu test installation.

http://socratestheme.com/dropdown/

Here's the exact process I used to install it.

Step 1: Install the PixoPoint Menu Plugin via the plugin dashboard.

Step 2: You need to edit the header.php file in Appearance > Editor

Replace

<!-- Main Nav -->
<?php if (!$primaryNav['display']) { ?>
<div class="im-nav"><a href="<?php bloginfo('url') ?>/wp-admin/admin.php?page=functions.php">Please configure in Socrates Admin Panel</a></div><!-- /close im-nav -->
<?php } else if ($primaryNav['display'] == 'block' ){ ?>
<div class="im-nav">
<?php
socrates_generate_nav_links($primaryNav, '');
?>
</div><!-- /close im-nav -->
<?php } else {?>
<div class="im-nav" style="background:none"></div><!-- /close im-nav -->
<?php } ?>

<!-- Search Form -->
<div id="im-searchForm">
<form method="GET" action="<?php bloginfo('home'); ?>/">
<input type="text" name="s" class="searchBox" id="s"
onblur="this.value=(this.value=='') ? 'search' : this.value;"
onfocus="clearText(this);" value="" />
<input type="image" id="searchBtn" name="searchBtn"
src="<?php bloginfo('template_url'); ?>/images/search.png"
onmouseover="this.src='<?php bloginfo('template_url'); ?>/images/searchOv.png'"
onmouseout="this.src='<?php bloginfo('template_url'); ?>/images/search.png'" border="0" />
</form>
</div>
<?php } ?>
<!-- END HEADER SECTION -->

with

<!-- Main Nav --> <div class="ddnav">
<?php if (function_exists('pixopoint_menu')) {pixopoint_menu();} ?></div>
<!-- /close im-nav -->


<!-- Search Form -->
<div id="im-searchForm">
<form method="GET" action="<?php bloginfo('home'); ?>/">
<input type="text" name="s" class="searchBox" id="s"
onblur="this.value=(this.value=='') ? 'search' : this.value;"
onfocus="clearText(this);" value="" />
<input type="image" id="searchBtn" name="searchBtn"
src="<?php bloginfo('template_url'); ?>/images/search.png"
onmouseover="this.src='<?php bloginfo('template_url'); ?>/images/searchOv.png'"
onmouseout="this.src='<?php bloginfo('template_url'); ?>/images/search.png'" border="0" />
</form>
</div>

<?php } ?>
<!-- END HEADER SECTION -->

Step 3: Edit Style.css in Appearance > Editor

Find..

.im-topAds { padding:0px 10px; margin:-15px 0px 10px; height:90px;}

And change to

.im-topAds { padding:0px 10px; margin:0px 0px 10px; height:90px;}

Add to bottom of stylesheet..

.ddnav { top:-18px; position:relative; z-index:4; padding:5px 0px 0px 4px; width:973px;}

Once you've completed these 3 steps you can then use the PixoPoint Menu settings panel for the rest of setup.

You can control all aspects of the font design, color, height, size, backgrounds etc, using their own CSS.

You can add pages, categories, links, posts, comments etc to the drop down.

I have to admit it's pretty sweet.

[JustBlogn]

Is it possible that this will be included as an option in a future upgrade? Since I'm not a semi-advanced user, I'll assume I shouldn't attempt this on my own, yet it is something I need.

[Dan Nickerson]

It's possible we'll have a switch for it in the nav section in a future update, not sure as of yet. It depends if people use it.. most people don't.

Honestly, you already know how to edit the files. As long as you have a backup of your header.php file, you're advanced enough to try it.

[ssheldon]

Hi Dan,

Which file would I edit to add the menu to the sidebar? I am using the 300px left sidebar option.

By edit, I mean add the line of code:

<?php if (function_exists('pixopoint_menu')) {pixopoint_menu();} ?></div>

I tried the obvious sidebar.php and sidebar2.php

Thanks!

Sue

[Dan Nickerson]

There's nothing to be added to the sidebar.. this is for the primary navbar only, it won't work in sidebars.

[ebepower]

Hi, thanks for the clear, easy instructions!

One quick question, step 3 says to add to the bottom of style.css the following code:

.ddnav { top:-18px; position:relative; z-index:4; padding:5px 0px 0px 4px; width:973px;}

but I noticed that exact code is already there. Is it supposed to occur twice? Or are we good-to-go with it there once?

Thanks!

P.S. you're right... the drop down menu is pretty sweet!

[lynnth]

Good to go once it is there.

[Dan Nickerson]

I decided to add the ddnav css to version 2.03 for convenience.

[Stephen]

Dan,
Just installed 2 days ago and I must admit I can't get this plugin configured even after going to Pixo site. Can't find a Video on it either that is any good.
I have double checked all the mods made that were posted here and they are correct.
I normally don't consider myself stupid...but I'm leaning towards it this time..lol. No one else seems to have a problem with it.

I'm using WP 3.01 and Soc 2.03. Win 7 32 bit...Firefox 3.6

Dan, I know you don't want to get involved with this plugin, but do you think you could post some SCREENSHOTS of the plugin settings from your Test Sight?....also do you change any Nav settings in Socrates after installing?

Dan on your Test Site I noticed you don't have an ad in the 728x90 HTML Advertising Code Box.
When I set up the plugin it automatically puts all my pages across the Nav Bar which I assume is normal...however when I try to setup a PAGE button with a drop down for my other pages...everything dissapears from the Nav Bar except the HOME Tab and my
728 X 90 add is pushed over and forces my rotating 220 add down on the right..but there is No Button showing or dropdown menu. Maybe the text is white against the white background from behind the ad...,but there is no Page button showing so I don't think that is it. BTW Pixo has disabled the CSS editing in the plugin while they fix a problem with it they said.
Have you tried a 728X90 ad under the bar on the test site to see what it does?
I think the problem is I just can't figure out the settings of the plug-in correctly. I have tried different ways and nothing???
That's why I asked for a couple of SCREENSHOTS of your settings on the TEST site to point me in the right direction. I think that would help tremendously.

Best Regards,
Stephen

[AlexWebley]

No one else seems to have a problem with it.

You are not the only one. I stopped using Socrates because I could not get the drop down menu right in the end, despite trying various methods and spending a lot of time.

I still have the theme, which I like a lot, and may use it on other sites for which a simple menu is fine. Alternatively, the menu 'situation' may improve down the track. Anyhow, I had to move on past the issue and use another theme.

Perhaps you could pay someone to fix your issue? I did not take that route - in my case was easier to buy another theme; though I did miss out on some of the core Socrates functionality.