Remove overlay text on image brooklyn theme

shopglamgirl
New Member
8 0 0

Trying to tweak my website on my own! Has anyone ever encountered the labels on the collections. It’s showing double. I tried to remove the label so that collection cover I created shows but the actual collection name still shows up (hopefully I’m explaining this clearly). Does anyone know how to remove this

 

?IMG_6167.jpg

Replies 10 (10)

Kinjaldavra
Shopify Partner
2302 570 1422

hello @shopglamgirl 

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

#shopify-section-list-collections-template .grid  .grid__item .collection-grid__item-title--wrapper .collection-grid__item-title{
	    display: none;
}

 

shopglamgirl
New Member
8 0 0

Hi. The options I am given are:

assets/theme.scss.liquid

assets/theme.js.liquid

Which one should I chose?

Kinjaldavra
Shopify Partner
2302 570 1422

hello @shopglamgirl 

you can insert code assets/theme.scss.liquid file 

shopglamgirl
New Member
8 0 0

I added the code and unfortunately it is still there. 

Moira
Shopify Staff
2040 223 323

Hey, @shopglamgirl!

This is Moira from the Social Care team at Shopify. Thanks for posting, and a very warm welcome to the Community!

Removing the overlay text on your collection images requires a small adjustment to your theme code. Have you had any experience with editing your store code before? I am more than happy to provide you with step-by-step instructions to help you out.

1) Go to Online Store > Theme > Edit code

2) Once in your theme editor click on Assets > theme.scss.liquid as shown below:

21-08-5ell1-3a0xm

3) Paste the below code at the bottom of the file


.collection-grid__item-title {
display: none;
}

4) Don't forget to click Save

Important Coding Reminders:

  • If you make changes to the original code and save the changes, you will not be able to revert back. We always suggest you first duplicate the theme and work in the duplicate. That way you can always go back to your previous version.

  • If you make changes to the original code in a theme and update your theme to a newer version in the future it will override past changes.

  • If you need custom changes but would prefer the help of a developer we recommend Shopify's own Expert Marketplace.

  • If you've changed theme files and need to revert them, you can roll back .liquid files individually to a time and date before you made the changes.

Below I have linked another community post where one of our Shopify Partners has directly implemented the code in a fellow merchants store. If you do not feel comfortable editing your own theme code, I suggest posting in this thread to see if a developer can help you directly:

As a side note, I love the work you've done on your website so far. Certain products like the "A Ballers Girl Bag" stand out to me because of the great job you've done with the photos and product description. Have you thought about who your target customer is for your website? Our blog post on Building a Buyer Persona talks about narrowing down who your ideal customer is. This process is good to go through so that you can get the most out of your marketing.

If you have any questions please feel free to thread those below.

Cheers!

Moira | Social Care @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit the Shopify Help Center or the Shopify Blog

shopglamgirl
New Member
8 0 0

For some reason that didn’t seem to work. Everything is still the same as far as the text overlay.

Moira
Shopify Staff
2040 223 323

Hey @shopglamgirl,

Thanks for getting back to us!

Let's try using this code below instead:


.collection-grid__item-title {
display: none;
}

I am tagging some of our wonderful partners to see if they can provide some insight as to why this may not have worked for you @Kinjaldavra @KetanKumar @Zworthkey @dmwwebartisan 

Let me know how you get on!

 

Moira | Social Care @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit the Shopify Help Center or the Shopify Blog

shopglamgirl
New Member
8 0 0

I was just recently given a code that removed the text from the pics. However when previously using he other provided code my homepage product photos now appear faded and my drop down menu has disappeared 😞

styleisssh
Visitor
3 0 0

Hello, I am looking for this same solution. Is there another code that would be helpful? @Moira 

Moira
Shopify Staff
2040 223 323

No problem @styleisssh! Could you please share your website URL with us?

I am looping in @Zworthkey who may be able to provide an alternative coding solution. 

Moira | Social Care @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit the Shopify Help Center or the Shopify Blog