Custom Header Logo After Update

  • gl3nnnn

    (@gl3nnnn)


    12 years, 7 months ago

    Hey, recently I had a custom logo that stretched across the entire screen and I had the menu in a single row below the logo. It had a similar layout as http://www.joe-the-baker.com but now after the latest update it has changed back to the logo being compressed on the left on the original design and the CSS no longer works. Sorry I’m not great with CSS!

    This was the CSS I used 

    .navbar .nav > li > a:first-letter {
font-size: 22px;
}

.navbar .nav > li > a {
font-size: 20px;
padding: -5px -5px;
}

.navbar .nav {
display: block;
float:left;
margin: -40px -15px 0 0;
position: relative;
padding: -15px-15px -15px 0;
}

.navbar-wrapper .brand {width:100%;display:block;}
.navbar-wrapper .navbar {width:100%;float:right;}
.wpbb-header-spacer {
height: 10px.navbar .nav > li > a:first-letter {
font-size: 22px;
}

.navbar .nav > li > a {
font-size: 20px;
padding: -5px -5px;
}

.navbar .nav {
display: block;
float:right;
margin: -40px -15px 0 0;
position: relative;
padding: -15px-15px -15px 0;
}

.navbar-wrapper .brand {width:100%;display:block;}
.navbar-wrapper .navbar {width:100%;float:right;}
.wpbb-header-spacer {
height: 10px ;
}
Viewing 3 replies - 1 through 3 (of 3 total)
  • acub

    (@acub)

    12 years, 7 months ago

    That code is a complete mess. Not only you’re declaring most of it twice, but some lines have errors, rendering portions of it unusable by browsers. They have this nasty habit of halting on errors…

    Here’s the “cleaned up” version of your CSS:

    .navbar .nav > li > a:first-letter { font-size: 22px; }
.navbar .nav > li > a { font-size: 20px; padding: -5px -5px; }
.navbar-wrapper .navbar {width:100%; float:right;}
.navbar .nav { display: block; float:right; margin: -40px -15px 0 0; position: relative; padding: -15px -15px -15px 0;}
.wpbb-header-spacer { height: 10px; }

    I removed duplicates and also the rules for .navbar-wrapper .brand which doesn’t exist anymore: .brand div (the logo) has been removed fom the .navbar-wrapper div (the menu wrapper).

    For centering your logo, add this to the end of your child theme’s functions.php, before the ?> (which should always be alone on the last line of file), and not inside any existing accolades:

    add_filter('tc_logo_title_display', 'your_logo_title_display');
function your_logo_title_display($output) {
	return preg_replace('|brand span3|', 'brand span12', $output, -1);
}

    Note: functions.php of your child theme should not be a copy of the parent’s functions.php. It should only contain your own php functions. If you haven’t added any php to it yet, it should just be an empty php file.

    <?php

?>

    If that’s the case, add the php code I posted before on line 2, save, upload and you’re done.

    Thread Starter gl3nnnn

    (@gl3nnnn)

    12 years, 7 months ago

    Thanks a lot and apologies for the rubbish coding! Anyway of giving kudos on here?

    acub

    (@acub)

    12 years, 7 months ago

    Not that I know of. The first six characters of your reply did most of the job, though.

    Please mark as resolved if that’s the case.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Custom Header Logo After Update’ is closed to new replies.