Homepage Logo distorted

[uowlimited]

I posted a reply to this old thread, but as it’s been marked as ‘resolved’ I’m guessing that’s why I’ve not got a reply: http://www.swiftideas.com/forums/topic/logo-distorted/page/2/

In short, the logo in the header on my site is getting stretched and distorted, despite inputting its dimensions into the boxes given.

I can see roughly the issue – with the header layout on Center, the 3 header sections with the span4 class limit the logo to filling 1/3 of the width, whilst our logo is very wide but not tall. Thus, the height is stretched out of the aspect ratio, and the right and left sections of the header are practically empty.

Is there a CSS rule, or modifications to the PHP files, that I can make to perhaps change the right and left header sections to span2, and the central logo section to span8?

Or an even simpler fix?

[Kyle – SUPPORT]

Hi

Yes that’s correct, you will need to edit the sf-header.php file to change the left and right sections to span 2

– Kyle

[uowlimited]

I’m having a go at this, but it’s not working how I’m doing it.

I’ve created a sf-header.php file in my child theme with the same directory path, /includes/swift-framework/sf-content-display/sf-header.php – will this work or do I need to make changes directly to the theme?

I’ve made these changes:

if ($header_layout == "header-1") {

		$header_output .= '<header id="header" class="clearfix">'. "\n";
		$header_output .= '<div class="container">'. "\n";
		$header_output .= '<div class="header-row row">'. "\n";
		$header_output .= '<div class="header-left span2">'.sf_woo_links('header-menu', 'logo-left').'</div>'. "\n";
		$header_output .= sf_logo('span8 logo-center');
		$header_output .= '<div class="header-right span2">'.sf_aux_links('header-menu', TRUE).'</div>'. "\n";
		$header_output .= '</div> <!-- CLOSE .row -->'. "\n";
		$header_output .= '</div> <!-- CLOSE .container -->'. "\n";
		$header_output .= '</header>'. "\n";
		$header_output .= sf_mobile_search();
		$header_output .= '<div id="main-nav">'. "\n";
		$header_output .= sf_main_menu('main-navigation', 'full');
		$header_output .= '</div>'. "\n";

I think my mistake is obvious, but I don’t know it. The page still has the sections as span4s.

[Kyle – SUPPORT]

You would need to copy the whole of this function to your child theme’s functions.php file:

/* HEADER
    ================================================== */
    if ( ! function_exists( 'sf_header' ) ) {
        function sf_header( $header_layout ) {

– Kyle

[uowlimited]

Nice, I added it and the logo is back to its resplendent aspect ratio.

Perhaps you guys should add the 2/8/2 option for header layout, the 4/4/4 is the only current option but there’s barely any content in the header-left and header-right sections.

Cheers

[Kyle – SUPPORT]

Thanks for the suggestion, will take into consideration

– Kyle