How to get company logo and menu in top bar?

  • Anonymous

    #7015

    I would like to use the top bar for the main menu (aligned to the right). I’d like to put my company logo there as well Aligned to the left.

    Is this possible?

    Anonymous

    #36487

    An other possibility is to put the navigation bar above the header. Is this possible? (NB Still i would like to put logo company is navigation bar.)

    Anonymous

    #36488

    Searching the forums I figured it all out for the menu line.

    I increased the top bar height:

    #top-bar {
    height: 80px;
    }

    then I moved the menu in place:

    #header-menu-wrap {
    position: relative!important;
    top: -180px;
    left: 0;
    z-index: 15;
    }

    positions dependent on the height of the header

    the z-index is relevant otherwise the menu will disappear behind the top bar…

    But how do I get my Company logo in the topbar and on top of the menu line?

    Anonymous

    #36489

    Any link to site will be great.

    From your username link (http://parsprophoto.com/wp/) I don’t see anything as described above. This also applies to the thread of navigation height, so I’m little confused…

    Anonymous

    #36490

    Put code in between backtick (

    Code:
    `

    ) characters. It’s usually located above the Tab key on your keyboard.

    TobiF

    #36491
    Quote:
    But how do I get my Company logo in the topbar and on top of the menu line?

    Include a link to your logo as a feature of the menu in your CSS code.

    Edit1:

    I googled a bit, and here’s a page, which describes what you can do:

    http://www.csstutorial.net/css_misc_images.php

    I suggest you use CSS to apply a background image to some div element in the header.

    Anonymous

    #36492
    Quote:
    I don’t see anything as described above. This also applies to the thread of navigation height, so I’m little confused…

    website I have multiple instances running on my server. This is the one I am trying to improve right now.

    Anonymous

    #36493

    Well, ain’t that a pretty mess :).

    Of course, you didn’t use child theme. Your top bar IS disabled. I’m looking at site from laptop (1366×768) and for some reason I have horizontal scroll. You have good vision for your site, but I think you went on wrong path with this.

    At this moment you have logo flatten in header image (wood). You will have to cut it out and save it independently as png or jpg. Than you can do some things like put it as background for some div element like TobiF said.

    Did you now that you can use custom menu in widget? And if you enable top bar and attach custom menu widget with some action hook you will get same result but with no altering in main theme code.

    Anyway, can you explain more precise where do you want logo to be. Maybe some image included :). Above the menu? Inline with menu?

    Mod

    Kenneth John Odle

    #36494

    Ah, horizontal scroll.

    That header image is nearly 1 MB in size. You need to reduce it quite a bit.

    Quote:
    the z-index is relevant otherwise the menu will disappear behind the top bar.

    Yes, this is why the menu is usually beneath a header on most sites: because drop-downs cover the header image, which is valuable real estate.

    Quote:
    But how do I get my Company logo in the topbar and on top of the menu line?

    Have you tried using a Graphene action hook widget area?

    http://blog.kjodle.net/2011/11/04/graphene-action-hook-widgets-an-easy-way-to-modify-your-blog/

Viewing 9 posts - 1 through 9 (of 9 total)

  • You must be logged in to reply to this topic.
Graphene Themes Forum