How to remove the title from my collections image at the header of the page

I am not tech-savvy so this is driving me insane, but I can’t for the life of me find the answer to how to remove the title from the collection image that is detailed at the top of the page. I would like to include images for my collections and already have the name listed in them, but the theme’s forced image title obstructs the image and is hard to read. In the meantime, I have defaulted to removing all images for the collections headers.

1 Like

hii, @DBarr
Kindly share your Store URL so,
I can solve your issue.

Thank You.

@DBarr

Please share store URL!

Thanks!

Hi @DBarr ,

Please follow these steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.
  • Step 2: Go to Assets > theme.css and paste this at the bottom of the file:
.collection-hero__title{
display: none !important;
}

Hope it helps!

Please mark as solution if you find my answer helpful for you.

hello @DBarr

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.collection-hero__title{
display: none !important;
}
1 Like

@DBarr

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.collection-hero__title{
display: none !important;
}

Thanks!

Sorry for the late response! It’s www.ailanefashionhouse.com

1 Like

Dear

I have the same problem. Image title inside the image square and I want it to be below it. My theme is Debut

This is my URL: https://a-trendy-piece.myshopify.com/

appreciate if you can fix it. I already tried the code paste thing but did not work.

Regards,

1 Like

@DBarr

I can see you have not added collection image or you removed it. Anyway you can add the following code at the bottom of your assets/theme.scss.liquid file.

header.collection-header .section-header h1 {
    display: none;
}

This will remove your collection title.

Thanks!

@TrendyPiece

You can add the following code at the bottom of your CSS file.

header.collection-header .section-header h1 {
    display: none;
}

Hope this works.

Hi @DBarr ,

Please follow these steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.
  • Step 2: Go to Assets > theme.css and paste this at the bottom of the file:
.collection-header .section-header{
display: none !important;
}

Hope this helps. If you find my answer helpful, please mark it as a solution.

Thank you so much!