Different logo in some pages on mobile version

Site URL: https://marthabalfour.com/

Hello, 

I would like to change the logo in some pages on my website on the mobile version. I currently have changed the logo in some pages on the desktop version by coding on advanced on each page that I wanted to change. I would like to do the same on the mobile version if possible so that the main green 'MB' doesn't get lost in the green background.

Website password: MBS2021

Thanks!

On 12/23/2021 at 10:26 PM, marthabalfour said:

Site URL: https://marthabalfour.com/

Hello, 

I would like to change the logo in some pages on my website on the mobile version. I currently have changed the logo in some pages on the desktop version by coding on advanced on each page that I wanted to change. I would like to do the same on the mobile version if possible so that the main green 'MB' doesn't get lost in the green background.

Website password: MarthaBalfourStudio2021

 

Thanks!

For showing logo when opening header menu, I suggest the following one in Home > Design > Custom Css

.header--menu-open .header-mobile-logo img {
  filter: invert(1);
}

Hi @bangank36 thanks for this. Sadly this is not working for me. I need to change the logo in pages like 'work' 'contact' so that it is the cream version that appears on the desktop version. 

I manage in the desktop version for it to change by adding this code in advance on each page:
<style>
.header-title-logo a {
  content: url("https://static1.squarespace.com/static/60c0a169de0770705ef9f3ed/t/61c48ef1ba4caf01a98f7e01/1640271601040/MarthaBalfrou_monogram_sand.png")
</style>

Thanks