Remove banner and title on specific pages – Alex & Sonny theme (Marquee)

Site URL: https://www.wondersmithaudio.com/stmarys

Hi everyone!

I'm using the Alex & Sonny theme, which I believe is part of the Marquee group of themes.

I want to hide the banner image and title just on this page: https://www.wondersmithaudio.com/stmarys

Just to be clear, I want to hide the entire banner/title wrapper so that the main page content bumps up to the top, just below the navigation.

Any help is much appreciated – thanks!

-Jeremy

#collection-62efe52327081e7c4476ff46 {

.title-desc-wrapper .no-main-image .no-description {

     dispay: none;
}

}

Try the above code.

20 minutes ago, izzyswebsite said:

#collection-62efe52327081e7c4476ff46 {

.title-desc-wrapper .no-main-image .no-description {

     dispay: none;
}

}

Try the above code.

Thanks for responding! I copied that code snippet and pasted it into the 'Custom CSS' area under 'Design' (screenshot attached).

Unfortunately, it didn't seem to have the desired effect. Is that the correct the implementation, or did I do something wrong?

Sorry I'm not at home at the moment. Maybe try without the collection number part? I'm not sure where I messed up. You put it in the right spot. 

12 hours ago, shorterthanmiles said:

Unfortunately, it didn't seem to have the desired effect.

It should look like this:

#collection-62efe52327081e7c4476ff46 .title-desc-wrapper.no-main-image.no-description {
  display: none;
}

On 9/3/2022 at 5:43 AM, shorterthanmiles said:

Thanks for responding! I copied that code snippet and pasted it into the 'Custom CSS' area under 'Design' (screenshot attached).

Unfortunately, it didn't seem to have the desired effect. Is that the correct the implementation, or did I do something wrong?

Use this code

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    display: none !important;
}

Got it, thanks! That seemed to work, except it also removes this well: https://share.getcloudapp.com/12uzEOnk

Is there any way to avoid removing that additional text?

On 9/4/2022 at 4:45 AM, tuanphan said:

Use this code

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    display: none !important;
}

 

In this screenshot, you can the top block of text is hidden. Just the very bottom part of the letters are showing:

https://share.getcloudapp.com/Jru8wbLg

Do you know how to fix this? I'm pretty sure it's because of the code snippet you provided, but I could be wrong.

On 9/4/2022 at 3:45 PM, tuanphan said:

Use this code

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    display: none !important;
}

 

Use this new code

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    visibility: hidden;
    height: 50px;
}

Thanks! I really appreciate.

That new code worked, but unfortunately only at larger screen sizes. On smaller screen sizes, the text at the top is still hidden.

Larger: https://share.getcloudapp.com/7KukRKwe

Smaller: https://share.getcloudapp.com/5zuPyzRP

Any fix for this?

On 9/6/2022 at 9:46 AM, tuanphan said:

Use this new code

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    visibility: hidden;
    height: 50px;
}

 

17 hours ago, shorterthanmiles said:

Thanks! I really appreciate.

That new code worked, but unfortunately only at larger screen sizes. On smaller screen sizes, the text at the top is still hidden.

Larger: https://share.getcloudapp.com/7KukRKwe

Smaller: https://share.getcloudapp.com/5zuPyzRP

Any fix for this?

 

Try some code like this

body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    visibility: hidden;
    height: 50px;
}
@media screen and (max-width:900px) {
body#collection-62efe52327081e7c4476ff46 div#banner-wrapper {
    height: 150px;
}
}