This was very helpful thank you. I have a question - does the header image text always fall below the image in the Dawn theme, or is this something that we made happen with the changes from this tutorial? I am using text, without the buttons, but I have changed the white background of the text to transparent and the text to white, so now when the text drops below the image, there is just a big gap of white space. I would prefer for the text to stay on the image but just be smaller for mobile. So I am trying to figure out if this is something from the code or actions we did in this tut or if it is a part of the theme. Thank you.
@@WebSensePro Wrong! It will affect because by default, image is set to be 750px width. Go to main-collection-banner, find class collection-hero__image-container and inside a img element remove all srcset stuff, and inside src attribute remove width: 750 and leave just image_url. You're good to go :)
This is weird. Instead of using CSS to adjust the collection banner to have both the image and collection name together (like in debut), he's like "just delete it all together and create a banner for each page." This isn't really the best solution.
![How To Add Size Chart To Your Shopify Store [Without App]](/img/1.gif)
dont stop the videosss, ur awesome
Thank you
Very helpful, thank you!
You're welcome 😊
This was very helpful thank you. I have a question - does the header image text always fall below the image in the Dawn theme, or is this something that we made happen with the changes from this tutorial? I am using text, without the buttons, but I have changed the white background of the text to transparent and the text to white, so now when the text drops below the image, there is just a big gap of white space. I would prefer for the text to stay on the image but just be smaller for mobile. So I am trying to figure out if this is something from the code or actions we did in this tut or if it is a part of the theme. Thank you.
Please contact via websensepro.com/contact-us for paid support
Hello , how can I also make the collection description dynamic with this banner? Regards;
Yes it's doable but will have to check the store. Please contact via websensepro.com/contact-us for paid support
How many Pixles does the Image have to be. I keep trying to upload an image but it seems to be to big for the collection image banner.
1200×600pixels should work
What should be the image crop ratio?
Any landscape
how can we make this image not crop the height, but rather have the height be whatever the image resolution is?
Please contact via websensepro.com/contact-us for paid support
Can you show how to do this with the refresh theme?
Please contact via websensepro.com/contact-us for paid support
Thanks
Welcome
Hello, I have accidentally deleted the collection banner while editing the theme and now I can’t get it back. What should I do?
Please contact via websensepro.com/contact-us for paid support
how can I use different images with different collection title for all the collections.
You can do that by creating separate template for each collection
You can simply connect the image of the banner as dynamic source, jsut like the text :)
Image banner per hum text ki position change kar sakty hein like bottom center
Yes
@@WebSensePro but how?
Hi, I have added the code however the collection banner doesn’t show up on mobile? Any idea how to fix this please?
That's weird it should work fine. For paid support please contact websensepro.com/contact-us
Sir on desktop picture is working file but on mobile device picture is blur and edges cut from left and right side. plz guide on this
Yes, it can done with CSS.
Suggestions of Shopify course?
Watch all the videos in this playlist, you wont need a Shopify course
my banner appears in bad quality I tried many images in different sizes but still have the same problem
Hmm... thats weird it does not affect image quality
@@WebSensePro Wrong! It will affect because by default, image is set to be 750px width. Go to main-collection-banner, find class collection-hero__image-container and inside a img element remove all srcset stuff, and inside src attribute remove width: 750 and leave just image_url. You're good to go :)
@@Aleksandar-we7ys THANKYOU SOO MUCH !
@@user-si2yj2os4u I'm glad that helped :)
Sir please make a video on wishe list in Shopify please
In progress
Can we use this code on any paid themes?
You can try but video is testes on free themes
This is weird. Instead of using CSS to adjust the collection banner to have both the image and collection name together (like in debut), he's like "just delete it all together and create a banner for each page."
This isn't really the best solution.
Please watch the complete video first. I gave multiple solutions
Shopify course? 0:33
Watch our videos you wont need a tutorial