Docs

[ctay119]

Per the instructions provided on this forum, I added our Logo to the Header Menu. After a recent update, the Logo is missing. Are you able to assist me to get it back?

Home

Thank you!

[Prasant Rai]

Hello There,

Thanks for writing in!

Can you please upload the logo? If it still doesn’t work please share login details of your website in a private reply.

Thanks.

[ctay119]

This reply has been marked as private.

[Nabeel A]

Hi there,

Thanks you for providing the credentials, can you please grant us the administrative rights so we can check your header settings. Apparently it looks like you’re using Text logo instead of Image Logo. Please navigate to Appearance > Customize > Header > LOGO – IMAGE and make sure the logo is uploaded.

Thanks!

[ctay119]

This reply has been marked as private.

[Rupok]

Hi there,

That’s really confusing. You said the logo is missing but I can see you didn’t even set the logo from Customizer. So it’s not really missing but you removed this because of some spacing issue as you mentioned on last reply. You should have ask our assistance regarding the spacing so that we could provide some suggestion to fix this earlier.

However the spacing causing because you have set the container max width to 1020px which is too small for the logo and menu items. If you want to keep that for whole site then you can just increase the container for Navbar only by adding the following Custom CSS :

.x-navbar-inner .x-container.max.width {
  max-width: 1150px;
}

You have also set larger value for Navbar Top Height (px) that’s causing spacing on top of the menu – http://prntscr.com/b1qgbv

Let’s decrease this as well.

Hope this makes sense.

Cheers!

[ctay119]

This reply has been marked as private.

[Christopher]

Hi there,

Please find this code in customizer :

.x-navbar .x-nav > li.logo-menu-item > a {
    text-indent: -99999px;
    text-align: left;
    width: 250px;
    height: 62px;
    background: url(http://essentialowlies.com/wp-content/uploads/2015/11/PPMTech_Logo_Blu_541_lrg.png) no-repeat center center;
    background-size: contain;
}

And update it to :

.x-navbar .x-nav > li.logo-menu-item > a {
    text-indent: -99999px;
    text-align: left;
    width: 250px;
    height: 62px;
    background: url("//ppmtech.com/wp-content/uploads/2015/11/PPMTech_Logo_Blu_541_lrg.png") no-repeat center center;
    background-size: contain;
}

Hope it helps.

[ctay119]

Perfect. Thank you very much. This fixed it. Is it possible to have the logo header show when on a mobile device? I have not been able to figure out how to achieve this.

[Rupok]

Hi there,

Thanks for updating. Your code is within media query :

@media (min-width: 980px) {
.x-logobar {
    display: none !important;
    visibility: hidden !important;
}
.x-navbar .x-nav > li.logo-menu-item > a {
    background: rgba(0, 0, 0, 0) url("//ppmtech.com/wp-content/uploads/2015/11/PPMTech_Logo_Blu_541_lrg.png") no-repeat scroll center center / contain ;
    height: 62px;
    text-align: left;
    text-indent: -99999px;
    width: 250px;
}
}

So it will work on 980px screen or higher. So let’s take off the media query or decrease the value to your desired screen size.

Cheers!

[Author]

Posts