logo
Ask your WordPress questions! Pay money and get answers fast! (more info)

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.

$10
Spry menu bar javascript drop down not working.

I have a working spry navigation within the html part of the site. I want to match this navigation within the wordpress pages. The drop down menu function does not work as I have set it up in wordpress. I need help to get this working.



The url to an html part of the site is here:
http://thelastcropfilm.com/index-test.html

Here is a url to a wordpress page within the site that has the same nav bar with drop down functionality NOT WORKING:

http://thelastcropfilm.com/blog/california-events/



I have placed my html spry nav bar within the header.php and the links to the script and css in the head of the header.php as follows:

I added these links into the head of the header.php

<script src="../../../../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../../../../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />


Find it here:


<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <div id="main">
*
* @package WordPress
* @subpackage Twenty_Ten
* @since Twenty Ten 1.0
*/
?><!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php
/*
* Print the <title> tag based on what is being viewed.
*/
global $page, $paged;

wp_title( '|', true, 'right' );

// Add the blog name.
bloginfo( 'name' );

// Add the blog description for the home/front page.
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) )
echo " | $site_description";

// Add a page number if necessary:
if ( $paged >= 2 || $page >= 2 )
echo ' | ' . sprintf( __( 'Page %s', 'twentyten' ), max( $paged, $page ) );

?></title>

<link rel="profile" href="http://gmpg.org/xfn/11" />

<script src="../../../../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../../../../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />


<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
/* We add some JavaScript to pages with the comment form
* to support sites with threaded comments (when in use).
*/
if ( is_singular() && get_option( 'thread_comments' ) )
wp_enqueue_script( 'comment-reply' );

/* Always have wp_head() just before the closing </head>
* tag of your theme, or you will break many plugins, which
* generally use this hook to add elements to <head> such
* as styles, scripts, and meta tags.
*/
wp_head();
?>



</head>



The rest of my header starting at the body tag, is here and you can see I have replaced wordpress header and divs with my own which includes the drop down menu bar:


<body <?php body_class(); ?>>
<div id="wrapper" class="hfeed">
<div id="header">
<img src="../../../../images/the-last-crop-film.png" width="901" height="138" alt="the last crop film" longdesc="http://thelastcropfilm.com" />
<div id="topNav">



<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a href="http://thelastcropfilm.com/index-test.html">Home</a></li>
<li><a href="../../../about-director-statement-bio-jeff-annie-main.html">About</a></li>
<li><a class="MenuBarItemSubmenu" href="#">Farm Issues</a>
<ul>
<li><a href="../../../family-farm-issues-preservation-agricultural-easement.html">Farm Preservation</a>
<li><a href="../../../farm-succession-issues-family-farmland- views.html">Farm Succession</a>
<li><a href="../../../regional-foodsheds-watershed-sustainable-water-table-agriculture-research-maps.html">Regional Foodsheds </a>
</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Video/Media</a>
<ul>
<li><a href="../../../video-film-version-edits-farm-agriculture.html">Video</a>
<li><a href="../../../media.html">Media</a>

</li>
</ul>

<li><a class="MenuBarItemSubmenu" href="#">Events</a>
<ul>
<li><a href="../california-events">California Events</a>
<li><a href="../national-events">National Events</a>
<li><a href="../other-event-calendars">Other Event Calendars</a>
<li><a href="../screenings">Screenings</a>

</ul>
</li>
<li><a class="MenuBarItemSubmenu" href="#">Blogs</a>
<ul>
<li><a class="MenuBarItemSubmenu" href="http://goodhumus.com/Pages/Newsletters.htm" target="_blank">Good Humus</a>

</ul>

</li>
<li><a href="../../../donate-the-last-crop-film-farm-conservation-succession.html">Donate</a></li>
<li><a href="../../../contact-questions-comments-opinions.html">Contact</a></li>

<li class="joinList"><a href="http://thelastcropfilm.us2.list-manage.com/subscribe?u=7d81b42aa5bccfe0656ece043&id=38490757ac" target="_blank">Join our mailing list</a></li>


<li class="like"> <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fthelastcropfilm.com&layout=standard&show_faces=false&width=75&action=like&font=arial&colorscheme=light&height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:25px;" allowTransparency="true"></iframe></li>
<li class="socialLinks"><a href="http://www.facebook.com/pages/THE-LAST-CROP/150006384342" target="blank" ><img src="../../../../images/facebook-icon.png" border="0"></a></li>
<li class="socialLinks"><a href="http://www.youtube.com/user/SchultzChuck" target="blank"><img src="../../../../images/you-tube.png" border="0"></a></li>
<li class="socialLinks"><a href="http://vimeo.com/7026032" target="blank"><img src="../../../../images/vimeo.png" border="0"></a></li>
</ul></div>
<!-- end #header --></div>

<div id="main">


Thanks for taking a look.

Nancy

This question has been answered.

Nancy Rodger | 06/08/11 at 3:33pm Edit


(2) Possible Answers Submitted...

See a chronological view of answers?

Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

  • avatar
    Last edited:
    06/08/11
    4:18pm
    Linda says:

    HI, I think your WordPress needs the DOCTYPE identified. You have this on your WordPress site:
    <!DOCTYPE html>

    try this...
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    Linda

    • 06/08/11 7:57pm

      Nancy Rodger says:

      This code:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

      does not appear in the original header.php

  • avatar
    Last edited:
    06/08/11
    6:35pm
    Kristin Falkner says:

    This is at the bottom of your HTML version and not at the bottom (in the footer.php) of your WordPress version:

    <script type="text/javascript"> 
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
    </script>


    It should probably be placed -- with the relative image links adjusted -- before the closing </body> tag of the footer.php file in your theme.

    Previous versions of this answer: 06/08/11 at 6:35pm

    • 06/08/11 7:49pm

      Nancy Rodger says:

      BINGO!!!!! Thank you!

      :)))

This question has expired.



Nancy Rodger had additional discourse to offer.

Nancy Rodger voted on this question.



Current status of this question: Completed



Warning: Please do not give out any FTP or ssh credentials to anyone, unless you trust them completely. Giving out login details is dangerous.

If the asker does not get an answer then they have 10 days to request a refund.