WordPress.org

Ready to get started?Download WordPress

Forums

Customizr
[closed] Logo to be set ontop of the Menu - both centered (17 posts)

  1. MelissaGBM
    Member
    Posted 9 months ago #

    Hello,

    I know this has be recently asked but I cannot seem to find the thread. I would like to place the logo on a separate line to the Menu.
    Thanks in advance for the CSS code or further instructions on this.
    Ie. First line = logo - Centered
    Second line - Menu Centered

  2. rdellconsulting
    Member
    Posted 9 months ago #

    Step 1: Center the logo snippet. This is a php solution by @acub.

    Step 2:
    I had a CSS solution I used but didn't feel it was completely right. @acub has sent me a hybrid css/php solution which I need time to deploy on my own site. I'll then turn it into a Snippet.

    So try this as a temporary measure:

    /* center Header */
    .brand.span3 {
    float:          none;
    margin:         auto !important;
    }
    .row-fluid .navbar-wrapper {
    float:          none;
    margin:         0 auto;
    width:          90%;
    }
  3. matt84532
    Member
    Posted 9 months ago #

    @redell, you wrote:

    " @acub has sent me a hybrid css/php solution which I need time to deploy on my own site. "

    I'd love it if you could share that solution (with a caveat) on this thread soon. I've been chasing different ways to fix the centered header/centered menu problem, and I'd be more than willing to test a simpler solution than the one you provided (it seems to drift the center logo right in smaller viewpoints rather than remaining centered). Thanks!

  4. matt84532
    Member
    Posted 9 months ago #

    @rdell though I'll also test this temporary measure today. Thanks again for all your support.

  5. rdellconsulting
    Member
    Posted 9 months ago #

    It was my top priority today, but the Forum took over! Should have something to show tomorrow.

  6. acub
    Member
    Posted 9 months ago #

    @matt84532 the following solution displays logo, tagline and menu, all centered on top of each other. also, social links are removed from header:
    CSS (goes inside style.css of child theme):

    .brand.span10.offset1 {float: none;}
    .tc-header .outside {display: block;  text-align: center;}
    .navbar-inner .row-fluid .span7.site-description {display: none;}
    .navbar-wrapper .navbar.notresp.row-fluid { float: none; width: 90%; margin: 0 auto; }
    .navbar .navbar-inner {padding: 20px 0 0; }
    .navbar .nav {float: none; width: 100%; text-align: center;}
    .navbar .nav > li {float: none; display: inline-block;}
    .navbar .nav > li .dropdown-menu li {float: left; width: 100%; text-align: left;}
    @media (max-width: 979px) {
    .tc-header .brand {width: auto;}
    .row-fluid .offset1:first-child { margin-left: 0; }
    }

    PHP (goes inside functions.php of your child theme):

    // center the logo by switching TBs classes on brand div:
    add_filter('tc_logo_title_display', 'custom_center_brand');
    function custom_center_brand($output) {
    return preg_replace('/brand span3/', 'brand span10 offset1', $output);
    }
    
    // prevent the output of tc_social_in_header:
    add_filter('tc_social_in_header', 'prevent_social_in_header');
    function prevent_social_in_header($output) {
    return;
    }
    
    // remove span9 from navbar-wrapper:
    add_filter('tc_navbar_display', 'remove_span9_navbar_display');
    function remove_span9_navbar_display($output) {
    return preg_replace('/navbar-wrapper clearfix span9/', 'navbar-wrapper clearfix', $output);
    }

    @rdell: i appreciate your time and effort into unifying the solutions and posting only the good stuff so users don't get lost. feel free to use any of my bits in your guides. questions are welcome too :)

  7. matt84532
    Member
    Posted 9 months ago #

    @acub Thanks! I'll let you know how it works.

    I do think the placeholder to the social links may have been what was causing it to float right at different resolutions.

    I'll report back -- I'm actually going to remove all my hacks and edits from my child theme and rebuild it piece by piece to ensure a cleaner CSS, so I should get a good sense of how this works.

  8. MelissaGBM
    Member
    Posted 9 months ago #

    I appreciate your time everyone and thanks for the updates I will give them a go.

  9. MelissaGBM
    Member
    Posted 9 months ago #

    Thank you thank you thank you!!!! All worked!

  10. rdellconsulting
    Member
    Posted 9 months ago #

    Look out for the Snippet when it is published as it includes a commentary from @acub on how he developed this code. As an Intermediate user, I found it really informative and useful.

  11. matt84532
    Member
    Posted 9 months ago #

    @acub and @rdell Thanks so much for this!

    One question for @acub. In the email you sent to @rdell you wrote:

    "If it was possible, i’d also go for not outputing the tagline inside navbar, but it’s generated by the same function as the one outside, so we’re going to hide this one."

    I would like to not output the tagline at all (as it is contained already in a graphic logo) -- how might this be done?

  12. rdellconsulting
    Member
    Posted 9 months ago #

    That's another Snippet!

  13. matt84532
    Member
    Posted 9 months ago #

    Thanks!

  14. acub
    Member
    Posted 9 months ago #

    If you don't want to output the tagline, filter the output of tc_tagline_display and return nothing:

    // prevent output of tc_tagline_display:
    add_filter('tc_tagline_display', 'prevent_tagline_display');
    function prevent_tagline_display($output) {
    return;
    }

    However, I don't recommend this method for tagline, as search engines display the tagline right after your site name. So use the hiding technique provided by rdell above, but make sure the tagline is set to whatever words you want displayed by your name in search results.

  15. Thinking Elvish
    Member
    Posted 3 months ago #

    I have tried this, in css and in php, but it is not working. Any help would be greatly appreciated.

    thinkingelvish.com

  16. d4z_c0nf
    Member
    Posted 3 months ago #

    Thinking Elvish , what are you trying to achieve?

  17. Andrew
    Forum Moderator
    Posted 3 months ago #

    Sorry you'll need to continue this on your own thread Thinking Elvish.
    http://wordpress.org/support/theme/customizr#postform

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic