Hello,
Sorry to bother.
I’m trying to achieve something simple but could not figure why it’s not working.
I would like to put this logo on PC : http://www.journaldufranc.com/wp-content/uploads/2015/02/newF5.png
And this logo (gif) on Mobile : http://www.journaldufranc.com/wp-content/uploads/2015/10/Fmobile1.gif
I used the upload function via the Theme panel respectively for Desktop and Mobile menus. But it’s not working.
Then I noticed the logo was hidden behind the other logo (or the menu bar) on mobile, so I tried
.td-header-style-3 .td-header-sp-logo {
background-image: url(“http://www.journaldufranc.com/wp-content/uploads/2015/10/Fmobile1.gif”);
}
.td-header-style-3 .td-header-sp-logo img{
display:none;
}
But still not.
Could you tell me how to achieve this ?
Thanks for your assistance
Hello @JDF,
I’ve checked your logo on our site and everything seems to be good: http://screencast.com/t/coOE8pozp4V7 .
Please try it without any plugins. Remove all plugins except Visual Composer and the social icons. It could be a conflicting plugin. I also found some errors in your console: http://screencast.com/t/PcDrJEaSsQ
Let us know how it goes.
Thanks.
Hi,
Thanks for your answer
I just cleaned all my custom css and deleted all the unnecessary stuff. Also I desactivated the plugins.
The error might be in the following lines (I copy pasted most from the other topics…..)
@media (max-width: 767px) {
#td-top-menu{
display: none !important;
}
.td-sp-ico-menu {
background-position: -20px -364px !important;
}
.blog-stack #td-top-search {
position:absolute!important;
right: 0px!important;
top: 0px!important;
}
.blog-stack .header-search-wrap .dropdown-menu{
left:-270px!important;
}
.header-style-3 .container-fluid{
position:relative!important;
left:-45%
}
.header-style-3 {
height:12px;
}
.header-style-3 .td-logo img{
width: 35px!important;
}
.block-title a, .block-title span, ul.td-category a, .td_social .td_social_type {
background-color: transparent;
color:#000000;
}
.td_block_wrap .block-title a{
color:#333333;
}
.blog-stack.td-boxed-layout .td-menu-wrap {
background-color: transparent;
border-bottom: 1px solid #ebebeb;
border-top: 0px solid #ebebeb;
}
.td_d_slug_1 {
display: none;
}
.clearfix{
height: 40px;
}
Sorry to bother you, I’m not good at this.
This is how I’m seeing it now, http://hpics.li/5c19f00
it displays the PC logo in miniature. Also the menu and search icons aren’t centered at they used to be.
Thanks for your assistance
Hi JDF,
I’ve checked your site and i saw your problem. Please try a bit of custom CSS like this:
@media (max-width: 767px)
.header-style-3 .td-logo img {
right: -75px;
}Also please remove this CSS style:
@media (max-width: 767px)
.header-style-3 .td-logo img {
width: 35px!important;
}The result you can see here: http://screencast.com/t/kirDo2EGY
Thanks and let us know how it goes!
Hey,
Thanks. Looking better but it is still displaying the PC logo on mobile.
I use two different logos, one for destktop and one for mobile display.
They are properly loaded in the theme panel so I don’t get why it’s not working.
Hello,
The theme was built in such a way that there are 2 header styles (in your theme version) that do not pick up the mobile logo. These are style 3 and style 6. You are using header style 3 and this is a normal behavior of the theme, not a bug.
You could try to alter the theme files to force it to pick up the mobile logo but this requires custom work which unfortunately we cannot provide.
I hope this helps.
Thank you!
