DEBUT Theme - banner and header overlap

Solved
Marvimoto
New Member
4 0 0

Hello, I have a problem.

I entered a code in the Debut Theme that fixes the header and the announcement when scrolling down. Everything works. But I want the header not to overlap the cover photo. Can someone help me please.

Many greetings Marvimoto

0 Likes
Michal_Morek
Shopify Partner
418 33 67

Hello Jacklane,

Kindly welcome to the Shopify Community.
I properly read your problem and need to carefully analyze your website to provide a solution here.
Would you kindly share your website URL and if your website is password protected then also provide a password?

I will carefully check out the issue and provide a solution to you here.
Please let me know if you have any further questions.

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: community@accomplishify.com
0 Likes
Marvimoto
New Member
4 0 0

https://famydino.myshopify.com/?_ab=0&_fd=0&_sc=1&key=0c8acaeeb17a5dfbd36c04277e929379b5dba78fa0b248...

 

I hope thats the correct link u need.

 

Thank you very much for fast answer.

 

 

0 Likes
Michal_Morek
Shopify Partner
418 33 67

This is an accepted solution.

Hello @Marvimoto,

You are welcome.

Please Go to Online Store ->Theme->Edit code then go to assets/theme.css.liquid -> find the below code in the file.

#PageContainer {
    padding-top: 80px;
}

and replace it with :

#PageContainer {
    padding-top: 90px; 
}

 Another way would be to just paste the below code at the bottom of the file :

#PageContainer {
    padding-top: 90px !important; 
}

Please let me know if you have any further questions.

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: community@accomplishify.com
Marvimoto
New Member
4 0 0

Thank you Michael it works!!

 

Yes I have another question.

 

Is there a way to set the headbanner and cover image separately in the desktop and smartphone version?

I would like to set the dimensions individually depending on which device you are looking at.

 

0 Likes
Michal_Morek
Shopify Partner
418 33 67

@Marvimoto  You are welcome

What are you trying to do? To set different head banners and cover images in the desktop and smartphone versions?

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: community@accomplishify.com
0 Likes
Michal_Morek
Shopify Partner
418 33 67

It's definitely possible to set different images for desktop & mobile. Also, it can be managed using theme settings (native builder of Shopify, you're probably using him every day) so no coding knowledge to change the images will be needed.

However, creating a structure to be able to embed different images for mobiles & desktop is not something that can be done within 5 minutes. 

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: community@accomplishify.com
0 Likes
Marvimoto
New Member
4 0 0

Hi Michael,


I would like to put 2 different pictures at the top to greet the customers on the page. A picture should only be shown when customers are looking at a smartphone. The other picture when someone is sitting at the desktop. The point is that the banner is very stretched in the desktop version and a lot of information is lost at the top and bottom.
I know I can make it bigger too. I would like to keep the size in the desktop version on "small" so that you can see products underneath. If I could adjust the cover picture individually, I would be able to design the picture so that it is optimized for the desktop version.

So far I haven't found any function in shopify native builder to do that.

I hope you can help me.

Thank you!!

0 Likes
ADMLees
New Member
1 0 0

Hi @Michal_Morek 

Can you help me?

0 Likes
Michal_Morek
Shopify Partner
418 33 67

Hi @ADMLees 

Let me check it and get back to you.

 

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: community@accomplishify.com
0 Likes