Moving Main Navigation Menu

  • Resolved MobileMiracles7

    (@mobilemiracles7)


    11 years, 11 months ago

    Hello,

    When I added my logo the menus messed up and I’m not sure how to fix them. Originally the menu was directly above the slider image in the header. I edited the code and moved the logo one line up which made the image space around the logo flush now the menus are overlapping and I’m not sure how to resolve this. I just would like the menu returned to the original position right above the slider.

    Here is the current screenshot of the page since I have a coming soon page up…

    https://imageshack.us/f/32/screenshot20130318at125.png/

    Here is the code before it was edited…

    wp_enqueue_script('easySlider1.5', get_bloginfo('template_url') . '/js/easySlider1.5.js', array('jquery'));
wp_enqueue_script('saas', get_bloginfo('template_url') . '/js/saas.js', array('easySlider1.5'));

wp_enqueue_script('jquery.cookie', get_bloginfo('template_url') . '/js/jquery.cookie.min.js', array('jquery'));
wp_enqueue_script('saas.twitter', get_bloginfo('template_url') . '/js/saas.twitter.js', array('jquery.cookie'));

?><!DOCTYPE html>
<html <?php language_attributes() ?>>
<head>
<meta content="<?php bloginfo('html_type') ?>; charset=<?php bloginfo('charset') ?>" />
<title><?php wp_title('&laquo;', true, 'right') ?> <?php bloginfo('name') ?></title>
<link href="<?php bloginfo('template_url') ?>/css/saas-common.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-griddler.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-<?php echo esc_attr(SaaS::getThemeOption('colorScheme')) ?>.css" rel="stylesheet" type="text/css" media="all" />
<!--[if IE]>
<script src="<?php bloginfo('template_url') ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<link rel="pingback" href="<?php bloginfo('pingback_url') ?>" />
<?php if (is_singular() && get_option('thread_comments')): wp_enqueue_script('comment-reply'); endif ?>
<?php wp_head() ?>
<!--[if lt IE 9]>
<script src="<?php bloginfo('template_url') ?>/js/saas-ie8.js" type="text/javascript"></script>
<![endif]-->
</head>
<body <?php body_class() ?>>
<div class="header">
	<div>
		<div class="center">
			<div class="topLinks"><?php wp_nav_menu(array('menu' => __('Top Links', 'saas'), 'theme_location' => 'top')) ?></div>
                        <h1 id="logo"><a href="<?php echo get_option('home') ?>/"><img      src="<?php bloginfo('template_url') ?>/images/logo.png" alt="<?php bloginfo('name') ?>" /></a></h1>
			<div id="ad"></a></div>
			<div class="nav"><?php wp_nav_menu( array('menu' => __('Main Nav', 'saas'), 'theme_location' => 'main', 'link_before' => '<span>', 'link_after' => '</span>')) ?></div>

    Here’s after I moved the logo up one and made the logo flush where I want it.

    wp_enqueue_script('easySlider1.5', get_bloginfo('template_url') . '/js/easySlider1.5.js', array('jquery'));
wp_enqueue_script('saas', get_bloginfo('template_url') . '/js/saas.js', array('easySlider1.5'));

wp_enqueue_script('jquery.cookie', get_bloginfo('template_url') . '/js/jquery.cookie.min.js', array('jquery'));
wp_enqueue_script('saas.twitter', get_bloginfo('template_url') . '/js/saas.twitter.js', array('jquery.cookie'));

?><!DOCTYPE html>
<html <?php language_attributes() ?>>
<head>
<meta content="<?php bloginfo('html_type') ?>; charset=<?php bloginfo('charset') ?>" />
<title><?php wp_title('&laquo;', true, 'right') ?> <?php bloginfo('name') ?></title>
<link href="<?php bloginfo('template_url') ?>/css/saas-common.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-griddler.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-<?php echo esc_attr(SaaS::getThemeOption('colorScheme')) ?>.css" rel="stylesheet" type="text/css" media="all" />
<!--[if IE]>
<script src="<?php bloginfo('template_url') ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<link rel="pingback" href="<?php bloginfo('pingback_url') ?>" />
<?php if (is_singular() && get_option('thread_comments')): wp_enqueue_script('comment-reply'); endif ?>
<?php wp_head() ?>
<!--[if lt IE 9]>
<script src="<?php bloginfo('template_url') ?>/js/saas-ie8.js" type="text/javascript"></script>
<![endif]-->
</head>
<body <?php body_class() ?>>
<div class="header">
	<div>
		<div class="center">
			<h1 id="logo"><a href="<?php echo get_option('home') ?>/"><img src="<?php bloginfo('template_url') ?>/images/logo.png" alt="<?php bloginfo('name') ?>" /></a></h1>
			<div class="topLinks"><?php wp_nav_menu(array('menu' => __('Top Links', 'saas'), 'theme_location' => 'top')) ?></div>
			<div id="ad"></a></div>
			<div class="nav"><?php wp_nav_menu( array('menu' => __('Main Nav', 'saas'), 'theme_location' => 'main', 'link_before' => '<span>', 'link_after' => '</span>')) ?></div>
Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter MobileMiracles7

    (@mobilemiracles7)

    **Update**

    I did some editing for the code and heres what I now have….

    https://imageshack.us/f/35/screenshot20130318at144.png/

    Basically all I need now is for the grey nav buttons to drop down to the line above the slider image. PLEASE HELP!!!
    The code is as follows…

    wp_enqueue_script('easySlider1.5', get_bloginfo('template_url') . '/js/easySlider1.5.js', array('jquery'));
wp_enqueue_script('saas', get_bloginfo('template_url') . '/js/saas.js', array('easySlider1.5'));

wp_enqueue_script('jquery.cookie', get_bloginfo('template_url') . '/js/jquery.cookie.min.js', array('jquery'));
wp_enqueue_script('saas.twitter', get_bloginfo('template_url') . '/js/saas.twitter.js', array('jquery.cookie'));

?><!DOCTYPE html>
<html <?php language_attributes() ?>>
<head>
<meta content="<?php bloginfo('html_type') ?>; charset=<?php bloginfo('charset') ?>" />
<title><?php wp_title('&laquo;', true, 'right') ?> <?php bloginfo('name') ?></title>
<link href="<?php bloginfo('template_url') ?>/css/saas-common.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-griddler.css" rel="stylesheet" type="text/css" media="all" />
<link href="<?php bloginfo('template_url') ?>/css/saas-<?php echo esc_attr(SaaS::getThemeOption('colorScheme')) ?>.css" rel="stylesheet" type="text/css" media="all" />
<!--[if IE]>
<script src="<?php bloginfo('template_url') ?>/js/html5.js" type="text/javascript"></script>
<![endif]-->
<link rel="pingback" href="<?php bloginfo('pingback_url') ?>" />
<?php if (is_singular() && get_option('thread_comments')): wp_enqueue_script('comment-reply'); endif ?>
<?php wp_head() ?>
<!--[if lt IE 9]>
<script src="<?php bloginfo('template_url') ?>/js/saas-ie8.js" type="text/javascript"></script>
<![endif]-->
</head>
<body <?php body_class() ?>>
<div class="header">
	<div>
		<div class="center">
			<h1 id="logo"><a href="<?php echo get_option('home') ?>/"><img src="<?php bloginfo('template_url') ?>/images/logo.png" alt="<?php bloginfo('name') ?>" /></a></h1>
			<div class="topLinks"><?php wp_nav_menu(array('menu' => __('Top Links', 'saas'), 'theme_location' => 'top')) ?></div>
			<div class="nav"><?php wp_nav_menu( array('menu' => __('Main Nav', 'saas'), 'theme_location' => 'main', 'link_before' => '<span>', 'link_after' => '</span>')) ?></div>
    Thread Starter MobileMiracles7

    (@mobilemiracles7)

    Resolved, thanks for the help, not.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Moving Main Navigation Menu’ is closed to new replies.