Support » Theme: Sydney » different logo for floating header bar

  • Resolved gawra

    (@gawra)


    different logo for floating header bar.

    due to some reason i need to add a different logo in floating header.

    how do i do that?

Viewing 8 replies - 1 through 8 (of 8 total)
  • Hello there,

    You can replace the default image with background image upon scrolling which can be done by adding the following CSS code into Appearance > Customize > Additional CSS:

    
    .float-header .col-md-4 a img{
      display: none;
    }
    
    .float-header .col-md-4 a{
      display: inline-block;
      width: 100px; /* Logo image width */
      height: 90px; /* Logo image height */
      background-image: url('http://yoursite.com/path/to/your/logo.png');
      background-size: contain;
      background-repeat: no-repeat;
    }
    

    Regards,
    Kharis

    thank you @kharisblank, a new logo has been placed on floating header but the main logo is also showing on it. how do i hide it?

    Hello there,

    Please share your site URL here, so I can have a look and correct the code.

    Regards,
    Kharis

    it was due to some caching bug, its working fine now. also i need to change main logo on each screen view except desktop view.

    Site URL- http://samarthlawgroup.com

    Hello there,

    You can use the following CSS code:

    
    @media only screen and (max-width:1024px) {
    
      .site-header .col-md-4 a img{
        display: none;
      }
    
      .site-header.col-md-4 a{
        display: inline-block;
        width: 100px; /* Logo image width */
        height: 90px; /* Logo image height */
        background-image: url('http://yoursite.com/path/to/your/logo.png');
        background-size: contain;
        background-repeat: no-repeat;
      }
    
    }
    

    Regards,
    Kharis

    Hello @kharisblank ,

    above css code hide the main logo from all screen views except desktop view but the new logo is not showing up. am i doing anything wrong?

    found an alternative, thank you for your assistance.

    You’re welcome and best wishes!

Viewing 8 replies - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.