Shopify themes, liquid, logos, and UX
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
Solved! Go to the solution
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.
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.
I hope thats the correct link u need.
Thank you very much for fast answer.
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.
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.
@Marvimoto You are welcome
What are you trying to do? To set different head banners and cover images in the desktop and smartphone versions?
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.
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!!
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024