Archived topic
Duplicated logo when switching from Floats to Flexbox
11 replies · Started by Danuta on July 19, 2021
Hi there :)
I decided to finally switch my blog from Floats to Flexbox.
Everything works fine except the logo. Now it's displaying twice :D :D :D Link --> https://kobiecefinanse.pl
I like my logo, but let's not overdo it ;)
In Chrome Dev tools I see that this code for logo is duplicated:
<div class="site-logo"> <a href="https://kobiecefinanse.pl/" title="Kobiece Finanse" rel="home"> <img class="header-image is-logo-image" alt="Kobiece Finanse" src="https://i1.wp.com/kobiecefinanse.pl/wp-content/uploads/2018/07/cropped-blog-kobiece-finanse-logo-e1531945909889-1.png?fit=700%2C140&ssl=1" title="Kobiece Finanse" width="700" height="140"> </a></div>
I tried to fix it by deleting cache and also switching off WP Super Cache & Autoptimize plugins - the problem still exists.
I use child theme, but I don't see any suspicious code there...
Some time ago I've added this snippet to functions.php in my child teheme:
https://generatepress.com/forums/topic/how-to-set-height-and-width-for-the-logo-image/#post-1563234
But now even when I remove it, it doesn't solve the issue.
Could you help me, please? :)
Hi Danuta,
This is what I see on your site, it looks normal, I don't see 2 logos.
https://www.screencast.com/t/a5UhKCBE74
Is there any specific page I should be looking at?
If it's not what you see, try clearing your browser cache as well.
Let me know if I miss anything :)
Please check it again / refresh the page. Because of the duplicated logo on production, I switched back from Flexbox to Floats. Now it's Flexbox again.
I can see the double logo now.
Can you try to switch to the parent theme to test?
And please try to clear cache again and keep the cache plugin disabled, so that we can see the code better.
Hi Ying,
caching plugins are disabled now.
I set the parent theme - and there is no logo displayed.
Can you go to customizer > site identity, check if there's a logo uploaded?
Now it's set.
So it seems working now.
In this case, once you switch back to the child theme, you'll need to check all the custom functions.
Try to remove them all, then add them back 1 by 1 to see which one is causing the issue.
Let me know if you need further assistance :)
Unfortunately, returning to the child theme didn't change anything :| the logo is doubled.
My functions.php file in child theme is very simple, it includes only two entries - one to handle google fonts (uploaded to my server) and second - the snippet mentioned in the first post:
<?php
//
// Recommended way to include parent theme styles.
// (Please see http://codex.wordpress.org/Child_Themes#How_to_Create_a_Child_Theme)
//
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array('parent-style')
);
}
//
// Your code goes below
//
add_filter( 'generate_typography_default_fonts', function( $fonts ) {
$fonts[] = 'Open Sans';
$fonts[] = 'Anton';
return $fonts;
} );
add_filter( 'generate_mobile_header_logo_output', function( $output ) {
if ( ! function_exists( 'generate_menu_plus_get_defaults' ) ) {
return $output;
}
$settings = wp_parse_args(
get_option( 'generate_menu_plus_settings', array() ),
generate_menu_plus_get_defaults()
);
return sprintf(
'<div class="site-logo mobile-header-logo">
<a href="%1$s" title="%2$s" rel="home">
<img src="%3$s" width="700" height="140" alt="%4$s" />
</a>
</div>',
esc_url( apply_filters( 'generate_logo_href' , home_url( '/' ) ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) ),
esc_url( apply_filters( 'generate_mobile_header_logo', $settings['mobile_header_logo'] ) ),
esc_attr( apply_filters( 'generate_logo_title', get_bloginfo( 'name', 'display' ) ) )
);
} );
Deleting both of them didn't help.
Try to remove them all, then add them back 1 by 1 to see which one is causing the issue.
Have you tried to remove them all? Still doesn't work?
If so, have you modified/added any templates for your child theme?
I found the root of the problem! It wasn't in the functions.php file :)
It's been a few years since I created a child theme, including file header.php in it. More than 5 years ago or so.
I comapred my child header.php with the one in parent theme and figured out, that the code is competly different... I was using a copy of the file with very outdated code.
So I deleted old header.php from the child theme, replaced it with the copy of header.php from parent theme and added my extra code to it (Google Analytics script, google fonts preload etc.) and it works! Doubled logo disappeared.
Thank you for your help! :)
Great, glad that you figured it out!
Happy to help :)