I need to bring title product title down on my product page on the Brooklyn theme

Technical Q&A
1

Hi Everyone

On the Brooklyn theme my Product titles are being blocked by the banner and header,

How do i bring the product title lower, so that it can be seen?

2

Hi there, @Mike22288804 !

Thanks for reaching out to the Shopify Community with your Brooklyn question! This is a great place to come by anytime you encounter any issues with Shopify, or just have questions!

I have a few questions I want to ask you, just so I can have some additional context so I can provide you with some next best steps:

  • Can you provide us with a link to your website so we can see this overlap ourselves?
  • Have you done any custom coding work on your store?
  • Has anyone done any custom coding work on your store?
  • Have you recently installed any applications that are involved with your header or announcement bar?
  • Do you have a screenshot, or a link to an example, of where this overlap seems to be occurring?

Iā€™ll keep my eyes peeled for your reply to the request information. Once I have that, we should be able to determine some next best steps for you to get this resolved.

3

Hi Imogen

Thanks so much for your reply and willingness to help

Our website is www.breeprobiotics.com

Iā€™ve done a little bit of coding on the store, but not too much.

There arenā€™t any apps used for the announcement bar.

Below is an example of 2 pictures, I tried to post it earlier but it didnā€™t work.

All the product titles are in some way covered by the announcement bar.

4

Hey there, @Mike22288804 !

Happy to help! I actually think I know what your issue is here, and itā€™s pretty simple! You may laugh, honestly.

So, I went to your website and visited a product page. I took a look and yep, the announcement bar just ever so slightly hangs over the product title. The reason why this is happening is because, similar to the header, the announcement bar adapts to the size of the content within it. So, because your logo image is that size that it is, itā€™s make the announcement bar larger, and covering up the product titles.

Easiest way to fix this without any coding is to just adjust the size of the image via cropping, using something like Microsoft Paint. If you make the image smaller, and re-upload it to the announcement bar, the bar itself will be smaller and no longer hang over the product title.

Give that a try and let me know if this solves your issue. Iā€™ve actually seen this quite a few times so Iā€™m pretty confident this will get it sorted for you! Make sure to follow up with me, and let me know!

5

Thanks so much Imogen

I canā€™t tell you how much I appreciate you trying to help me.

I will give this a go and I will be sure to get back to you.

6

Thanks for posting on Shopify community! Today I would love to fix this kind of coding issue.

Please go to your theme editor, and open the ā€˜theme.scssā€™ file and paste this css code at very bottom and click on save button. Thatā€™s it.

Screenshot_306.png
Screenshot_306.png1486Ɨ839 95.9 KB

Thank you.

7

Thanks Sakinur

This worked like an absolute dream!! I really appreciate the help.

8

Itā€™s my pleasure.

Thanks for accepting as a solution. Have a good day!

9

Hi there, @Mike22288804 and @sakinur-rahman .

Just wanted to say ā€˜Thanks!ā€™ to @sakinur-rahman for providing the help they did here! Iā€™m glad to see you were able to get this announcement bar situation resolved with their piece of code!

Interactions like this are what the Shopify Community is all about! I hope both of you remain active here, and continue to ask good questions, and provide great assistance!

All the best!

10

Thank you @Imogen_1 .