SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Member
    Join Date
    Apr 2013
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Move Navigation bar & horizontal coloured bar

    Hello!

    I'm looking for someone to help me move the navigation menu from where it is now to the top right (as seen in the attached image)
    http://occasionfunder.com

    Also place a horizontal coloured bar (again as seen in the attached image)

    Any ides on how this can be done?

    Thanks

    Sammenu.jpg

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Hi samrowe. Welcome to the forums.

    Your screen shot doesn't look a lot like the page you linked to, and it's not really clear what you want. Seems like the menu is top right already. Have you fixed this?

  3. #3
    SitePoint Member
    Join Date
    Apr 2013
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Ralph,

    I haven't fixed this. Apologies I meant move from the current position to the top left like the attached example.

    If you look at http://occasionfunder.com your see the current navigation on the top right Home | About us | etc a I need this moving to the top left in the grey area like the attached example.

    With a pink strip that runs below that (again like the attached example)

    Thanks

    Sam

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    OK, moving the menu to the left is easy enough. Change this (main.css, line 199):

    Code:
    .top-right {
    float: right;
    width: 55%;
    }
    to this:

    Code:
    .top-right {
    float: left;
    }
    As for the pink part, it doesn't look like you are ready for that yet. What do you want to do with the Home, About Us links etc?

  5. #5
    SitePoint Member
    Join Date
    Apr 2013
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Are you sure its main.css? Can't seem to find that on line 199.

    I want to remove the nav bar in its current position and just have the pick flow left to right like the attached example.

    Thanks for you help.

    Sam

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by samrowe View Post
    Are you sure its main.css? Can't seem to find that on line 199.
    It's definitely there.

    I'm confused about what you want to do, though. You have two menus there. Which do you want top left? Which do you want to get rid of? The code I posted relates to the login menu.

  7. #7
    SitePoint Member
    Join Date
    Apr 2013
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hey Ralph,

    Apologies Ive not been clear. Please see attached what I would like to do.



    I want to take the existing menu Home / about / etc and move that into the grey area in the top left in the same style as the Signup/Register & then delete the existing menu.

    I wish for the menu to be editable if I need to add pages using the menu function within wordpress.

    Thanks

    Sam

  8. #8
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    OK, I see now. Well, everything I said above is void, then. You have some major surgery to perform, in that case. I guess the first step is to dig into your WP templates and move the menu into the class="container" div. At first it will look shocking, but no matter. The styling comes later. First you need to get it into the right place.

    I don't know where that code will be, but look in a few places such as header.php.

    Unfortunately, the code you are working with is pretty messy, so this won't be pretty.


Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •