Shopify 2.0 Templates Tutorial - Create Different Layouts for Product Pages & Collection Pages

Sdílet
Vložit
  • čas přidán 6. 09. 2024

Komentáře • 229

  • @EdCodes
    @EdCodes  Před rokem +4

    🧠Learn to modify your store with code! Check out my ebook: ed.codes/shopify-coding-handbook. It's a beginner-friendly intro to HTML, CSS and Shopify Liquid.

    • @TheLittleHomesteadCo
      @TheLittleHomesteadCo Před 6 měsíci

      @EdCodes ~ Why does Shopify say not to overdo the templates though? The instruction page I read says if you update your theme, those templates won't carry over with the update, and you have to re-create them again from scratch.

  • @andregraf3000
    @andregraf3000 Před rokem +16

    This is incredible! Thank you so much for sharing your knowledge! I'm running my own store and all my products have the same generic information because I did not know how to create different theme templates! Game changer for my brand website! Thanks again!

  • @AbhishekGaragad
    @AbhishekGaragad Před 2 lety +12

    Can you make a videos on dawn theme specifically , where you talk about all kind of customisation and code edits for small changes ?

  • @ShermanBMason
    @ShermanBMason Před rokem +3

    I cant thank you enough. I feel like this is needlessly difficult to do. Thank you for the breakdown.

  • @16malav
    @16malav Před rokem +2

    I just cannot thank you enough for this. I was sweating all day to find the solution. thank you so so much.

  • @kellyhthao
    @kellyhthao Před 2 lety +9

    This is exactly what I need for one of my product. Thanks Ed for this easy tutorial!

  • @sunilkumar-hj1eb
    @sunilkumar-hj1eb Před rokem +2

    I'm not a developer but as a Shopify marketer learning lot from your videos brother, thanks a lot 😀

  • @bossfabian5958
    @bossfabian5958 Před 22 dny

    î kiss your eye i watch sooo damn much videos and no one could explain how to do own templates god damn thx bro

  • @ashleyyarbrough7020
    @ashleyyarbrough7020 Před rokem +2

    At 2:44 I'm wondering how to create the other menu below the Image Banner. I've created another menu already but I'm unable to access it in a section or block. It would be the same style as my header menu but only available on the Collections page. Anyone to help? :)

    • @UnishowOutdoors
      @UnishowOutdoors Před rokem

      Hi @EdCodes, did you happen to do a video on adding the menu into the collection page as per the website you showed. Thanks for all your help so far

  • @yesitstkm
    @yesitstkm Před 11 měsíci

    OMG! I was struggling with a duplicated product. I talked to Shopify chat and they told me to create a new template. it was literally not working,. They did not mention that you need to assing a template!!! Thank you so much.

  • @robynschoon3270
    @robynschoon3270 Před rokem +4

    Aaaah just a pleasure to watch this - been struggling all day with templates - the Shopify chat didn't offer any solutions, nor did the follow-up email. I was working on the Dawn theme too but have also purchased the Modular theme. This was so helpful and clearly explained little details which are often overlooked and derail one's efforts. I'll definitely join your group as hoping to launch my Shopify store soon!

  • @WrensTop10
    @WrensTop10 Před 7 měsíci

    Thank you for this video! I am new to shopify and have around 20 products in my store. I did an edit on one page and it affected all of the other product pages 😅😅 Very helpful videos for us newbies!!!

  • @waleedabdulrab8779
    @waleedabdulrab8779 Před 7 měsíci

    8:50 - This fixed my issue! The problem stemmed from a 'Video Section' that was intended for a specific product but was displaying on all other product pages. The root cause was that I had assigned the same template across all of my other products. Therefore, removing the video from one product page affected all others due to the shared template. To fix this, I created a new template specifically excluding the video section. Then, I assigned this template to the product where I didn't want the video to appear. Thanks a lot for your help! It was quite confusing to figure out initially.

    • @onceuponatimedk
      @onceuponatimedk Před 7 měsíci

      Hi there...god explanation. And what if you want different Image banner on your different templates, mine are the same all over! is it the same way? Mette

  • @Deckson25
    @Deckson25 Před 9 měsíci +1

    Thank you, thank you, thank you. So powerful but yet so hidden within Shopify. I've wasted hours trying to figure this out on my own. This video is exactly what i needed! You're awesome 👍

  • @fortunefreshies
    @fortunefreshies Před rokem +7

    I'm sooooooo confused!!! This was not an easy one...

  • @bluesapphire4780
    @bluesapphire4780 Před měsícem

    this was the answer i was looking for non of the shopify answers helped me the way this video did thank you so much

  • @jaemarie
    @jaemarie Před rokem +2

    Thank you so much I've been binge-watching your videos for 3 days since I found you. It has helped me customize my store. However, the very next thing I want to learn (you slid pass it saying "you do this with metafields"), was how to place tabs under the image/slideshow banner. Can you elaborate more on this?

  • @chasehollingsworth7795
    @chasehollingsworth7795 Před 11 měsíci

    I am so grateful. I have been trying to solve this problem for days now and you provided a PERFECT tutorial. Def a quality and deserving creator.

  • @ollybudd2749
    @ollybudd2749 Před rokem +1

    Yessss! You’re the only person who shows how to actually do this 😂 many thanks man!

  • @foreverrussianworld
    @foreverrussianworld Před měsícem

    Thank you so much for this video! It helped me understand templates clearly. One question I was still interested in having answered is how to create the banner that connects to the different collections (in your video the example of Warm Weather, Traveling, Relaxing, Running, etc). I am using the Dawn theme and would like to expand beyond generic theme template to add that functionality. I am wondering if there is also something about Collections vs Collections List that is relevant here.

  • @chadt103
    @chadt103 Před rokem +1

    I have a question. I can't get my templates that I have created show up in my Online Store - Only Default shows up / I am able to change them out on my theme customizer and the page is correct. / When I try to assign the page it just not there. / Do you have any suggestions, Thank you, I love your stuff

    • @FreelanceFadi
      @FreelanceFadi Před 7 měsíci

      It's because the template needs to be created in the live theme, otherwise it won't show up as an option under "Theme template".

  • @user-wk6pf6wk9c
    @user-wk6pf6wk9c Před rokem

    Thank you very much, the problem has been resolved after I had a big problem with customizing the product page

  • @subneo61
    @subneo61 Před rokem

    Thanks, Ed! You helped me a lot! I tried to look by myself but i don't know why I couldn't see that option how to create a template.
    Right now I can finally separate my digital products from physical.

  • @Shekinah7
    @Shekinah7 Před 5 měsíci

    Shopify templates are so damn counter-intuitive...! Who designed this ux? Thanks for explaining. Hopefully I can apply to pages instead of products.

  • @brayanavila2207
    @brayanavila2207 Před rokem

    You are amazing I was loosing my mind trying to figure out how to do this.

  • @mizz_co
    @mizz_co Před 6 měsíci

    THANK you for this video!
    That is also a great idea to set up pre-orders, my only problem is, that I can not change the buy button description from "Add to cart" to "Pre-order now" - any suggestion?
    I also wonder if I can use different product pages for different variants?

  • @christinaezzla7909
    @christinaezzla7909 Před 3 měsíci

    Thank you so much, finally a video that gets down to the point. Great work!

  • @hassanalasfory4768
    @hassanalasfory4768 Před 9 měsíci

    Dear ed,i really wanted to thanks you alot,deeply from my heart. much appreciate your easy explaining us. 😍😍😍

  • @Deepviewer836
    @Deepviewer836 Před 6 měsíci

    Thank you so much
    I was looking for video like this to solve problem of product and collection pages

  • @user-vp4cn9hq4j
    @user-vp4cn9hq4j Před rokem

    You are amazing!!! I have been trying to do this for so long and you have helped me do this in less than a day!!! yay

  • @Dragonhunter1400
    @Dragonhunter1400 Před 20 dny

    Best CZcams channel

  • @marvinwittmann6556
    @marvinwittmann6556 Před 2 měsíci

    thank you! but unfortunately this doesn't work when you want to change the logo on a different product site );
    I only have one Shopify subscription and I want to make another logo for the other product...

  • @ezekielsanjuan2364
    @ezekielsanjuan2364 Před rokem

    I was just watching you and now I'm in love ❤

  • @jonathansutherland5242
    @jonathansutherland5242 Před 2 lety +4

    Is there a way to change the homepage to use a different layout? I feel like I'm overlooking something simple but I don't see a way to do it. Maybe I need to rethink it that all my other pages need to change to a custom layout and the homepage stays as theme.liquid?

    • @FreelanceFadi
      @FreelanceFadi Před 7 měsíci +1

      I don't know if this answers your question, but customizations to the homepage are done inside the theme editor. It's the index.json template file that controls what is rendered on the homepage.

  • @sanajabeen5598
    @sanajabeen5598 Před měsícem

    I really appreciate your effort

  • @Yourenotthatguy
    @Yourenotthatguy Před 3 měsíci

    This is exactly what I was looking for. THANKS

  • @ngbngb123
    @ngbngb123 Před rokem +1

    Thanks Ed. I really learned a lot from this tutorial. Very helpful. What really gets me is the filtering or nav by tabs under the collection image (Warm Weather, Traveling, Relaxing etc). Its very cool but I have tried everything and cannot come right. Please can you point me in the right direction.

    • @wafimatta2504
      @wafimatta2504 Před 3 měsíci

      did you reach anywhere in this collection page thing!!

  • @Thunddeerr
    @Thunddeerr Před 3 měsíci

    Saved me Hours!!! Thanks!

  • @rebeccaheinjus9044
    @rebeccaheinjus9044 Před 5 měsíci

    This is amazing thankyou! I have a product that is available in-store only, it is too expensive to post. Is there a way of creating the 'add to cart' button as 'in-store only' button? And is it the same concept to create essentially product landing page and possibly remove things like the menu etc? Thanks!

  • @TransformWithTrainsalot
    @TransformWithTrainsalot Před 2 měsíci

    Not one tutorial is working for me, unfortunately. I created multiple pages just last night and now I can't get the page to edit separate from other pages even with the page assigned and everything

  • @itsarchieissecond
    @itsarchieissecond Před rokem +1

    I’ve been looking tor a video like this for so long! Thank you!

  • @agwheeler2000
    @agwheeler2000 Před 7 měsíci

    This was hugely helpful. Thank you very much, Ed!

  • @sheanathan3566
    @sheanathan3566 Před rokem

    Wow, super helpful. You are filling in the gaps that the developers should have.

  • @user-vk2xu6uw7v
    @user-vk2xu6uw7v Před 9 měsíci

    THANK YOU! I was looking for a good explanation

  • @IamArtDoll
    @IamArtDoll Před 20 dny

    This video helped so much thanks!

  • @Alex-qn3yh
    @Alex-qn3yh Před 4 měsíci

    Ok this is exactly what i was looking for

  • @otshalom
    @otshalom Před rokem

    Life saver, been stressing all day.😅

  • @rana.hamzatariq
    @rana.hamzatariq Před 2 lety +1

    The Allbird section that you were looking for is similar to "image with text" for dawn theme

    • @EdCodes
      @EdCodes  Před 2 lety +2

      Yes that's it, thanks!

  • @kiran7777
    @kiran7777 Před rokem

    I think your account will blow up soon, wow what a value!!

  • @johnrudisill2801
    @johnrudisill2801 Před 7 měsíci

    I am changing seasons on dawn theme to spring on dawn. Why can't I develop the new spring look while leaving winter theme up.

  • @user-vh3cc6jb3o
    @user-vh3cc6jb3o Před rokem

    Thank you so much! You solved my huge problem in one quick video :)

  • @christinegivens9048
    @christinegivens9048 Před rokem +1

    Amazing. So helpful. I really like your presentation style a lot. Thanks!

  • @VersaStile-02
    @VersaStile-02 Před 15 dny

    Mines need to turn to the other side > the hero product as a default template, and the other product as custom template the video showed how to. Because of the custom section apps i've installed dont want to be exact as what the video show. Thanks. Those who had try but not working, can try my method of reversed it. I hope this can help someone else who dont get the result as Ed Codes show.. Turn the side.

  • @cubicleight
    @cubicleight Před rokem

    Would love to join your group!!! This channel has been so helpful. More power!

  • @partidorrana2640
    @partidorrana2640 Před rokem

    Thank you for this video you really help me with what I was looking for continue like that I appreciated 🙌🏽

  • @michaelkelly3158
    @michaelkelly3158 Před rokem

    Thanks for this video. I am finding Shopify so convoluted and confusing after switching from Squarespace, but the extra functionality is great. It's just a shame it's so bloody confusing!

    • @FreelanceFadi
      @FreelanceFadi Před 7 měsíci

      Hi Michael, do you still find it confusing?

  • @olusam2732
    @olusam2732 Před rokem

    This video was helpful. Thank you Ed.

  • @1nonlyl1szt65
    @1nonlyl1szt65 Před rokem +1

    PLEASE HELP ME!!!!!!! The default product tempelate doesnt work on me because it says "0 assigned products" please tell me how to fiox that!!!!

    • @EdCodes
      @EdCodes  Před rokem +1

      Usually, you would assign a template to products using the template selector on the products admin page. But the default template should be already assigned - its default. Just try checking what is assigned on your product admin page?

  • @HutchTouch416
    @HutchTouch416 Před 5 měsíci

    Exactly what I needed! Thanks a ton!

  • @user-tj9rv9zk2h
    @user-tj9rv9zk2h Před 10 měsíci +1

    Really helpful thanks! One question, do you always have to manually assign a template to each individual product if it is not the Default template? For example, it I have a template for T-Shirts, and a different template for Hoodies ... can the the T-Shirt template be automatically applied if Product Type = T-Shirt and the Hoodie template is assigned if the Product Type = Hoodie? Thanks!

    • @GabriFreire
      @GabriFreire Před 4 měsíci

      Did you manage to do it? I'm trying to do that too! Thanks

  • @Lightsfire
    @Lightsfire Před 8 měsíci

    This video was amazing, you are a blessing!

  • @rafaellacardoso9936
    @rafaellacardoso9936 Před měsícem

    Great video! thank you very much !

  • @user-rx2ef9ys2e
    @user-rx2ef9ys2e Před 8 měsíci

    Very Helpfull video thank you.

  • @commanderkeen500
    @commanderkeen500 Před 7 měsíci

    You helped me a lot thank you bro

  • @user-cq3lf7lu5i
    @user-cq3lf7lu5i Před 8 měsíci

    Hi! You have a "message field" on your product. When a person types something in and proceeds to a checkout, does this message appear on checkout as well? I mean I have a product where a fill-in form should be, the person should fill in details and then go to checkout. I've added a custom liquid code now, but i does not sync with the checkout. How can I fix that? Thanks in advance!

  • @dianajimenez3959
    @dianajimenez3959 Před měsícem

    Agh can I get some help! I followed the steps to get the message box in there but I cannot assign to the certain products I want! It’s not allowing me to! I did it all as said PLEASE HELP

  • @CruiseCharmer
    @CruiseCharmer Před 4 měsíci

    the message box seems small how can i make it bigger? Thanks

  • @magasindesignauto210
    @magasindesignauto210 Před rokem

    i love your explenations please is there a way where i can automatically put the new products on the specific product pages without the need to do it manually thank u so much for your help in advance

  • @alekosimba
    @alekosimba Před 10 měsíci +1

    Ok the question is, after you create a product template how do you assign it to more than 1 product? Doing this manualy would take forever

    • @GabriFreire
      @GabriFreire Před 4 měsíci

      Did you manage to do it? I'm trying to do that too! :)

    • @alekosimba
      @alekosimba Před 4 měsíci +1

      @@GabriFreire unfortunately no

  • @kevinmcordeiro3156
    @kevinmcordeiro3156 Před rokem

    Hi, I love your instructional videos. I created a custom template for one of my collections. I currently have the header and anouncement hidden from this collection. Question: is it possible to have a different header for my custom theme and is there a video on this. Thank You

  • @onceuponatimedk
    @onceuponatimedk Před 7 měsíci

    Hi Ed✨✨✨✨✨
    Hi there...god explanation. And what if you want different Image banner on your different templates, mine are the same all over!
    How can I chance that ~ Can I use this method you are describing???
    Hope you will answer me! Guess many people struggling with this!!!
    Hope that you can answer Mette soon🙏🏻

    • @EdCodes
      @EdCodes  Před 6 měsíci

      You can use either templates or metafields for your image banners. The best way depends on the number of pages you want to affect (you don't want to create too many templates). This tutorial might answer your question - czcams.com/video/5yxu9P4DE2g/video.htmlsi=EnnlHa3h5w5p7ULm

  • @x_bomber_hd7894
    @x_bomber_hd7894 Před rokem

    thank you very much this help out a tone keep up the good work !!!

  • @Kikikapas
    @Kikikapas Před rokem

    thank you... exactly what i was looking

  • @elinnepe
    @elinnepe Před rokem

    Ed, thank you for sharing this information. Amazing

  • @sssafeawareness
    @sssafeawareness Před 10 měsíci

    Thanks mate. This was really helpful.

  • @ACCoact
    @ACCoact Před rokem

    Amazing, just saved so much time. Thank you!

  • @kalaashcharyaindianhandicr4301

    For my online 2.0 store I need to change customer email invoice template. How to do?

  • @brendamendez7493
    @brendamendez7493 Před rokem

    Exactly what I needed, Thank you!

  • @dreamchaser3199
    @dreamchaser3199 Před 25 dny

    bro, you rock. keep it up

  • @dreamfridge9160
    @dreamfridge9160 Před rokem

    OMG UR A LIFE SAVER MAN THANK YOU!!!!

  • @alansilverman6311
    @alansilverman6311 Před 6 měsíci

    Thank you! Awesome.

  • @thenaturalgemini
    @thenaturalgemini Před 9 měsíci

    Great video, but how do you actually assign the template to a particular collection? In your video at 14:42the top left-hand side of the screen says assign to 0 collections. I have tried to add my template to a certain collection following shopify's instructions and it does not work. please assist.

    • @EdCodes
      @EdCodes  Před 9 měsíci

      Assign the template on the collection page in the Shopify admin. Not in the theme editor, but rather where you create the collection.

  • @JamezJN007
    @JamezJN007 Před 8 měsíci

    hello did you make an updated video of this with metafields?

  • @Minndom
    @Minndom Před 9 měsíci

    Thank you very much for this

  • @devilm1602
    @devilm1602 Před rokem

    Thank you so much brother i love you this video is very helpfull for me thank you so much ❤️

  • @garrysingh8387
    @garrysingh8387 Před 5 měsíci

    Champion 🎉

  • @Emmanuel_Ecom
    @Emmanuel_Ecom Před 7 měsíci

    How can I feel the product template accordingly

  • @faroadsmtline3620
    @faroadsmtline3620 Před rokem

    for example if a store has different types of products and each product has different specifications so it mean we have to create different templates each time for each product?

    • @EdCodes
      @EdCodes  Před rokem +1

      No, if each products has unique content that's when you need to use Metafields.

  • @user-bf7xz6et5o
    @user-bf7xz6et5o Před 10 měsíci

    Thanks for the help brother

  • @IvanRuiz-td4sl
    @IvanRuiz-td4sl Před 2 lety

    Thanks for this tutorial !! great job easy to follow. I following you now.

  • @Fedgery007
    @Fedgery007 Před 2 lety +1

    Awesome! I’m working on using Craft 2.0 to upgrade Debut.
    How did Allbirds do that video with the sheep? So the video that loops with the text overlay?! Is there a section for this?!

    • @EdCodes
      @EdCodes  Před 2 lety

      Yeah some themes come with a video banner section. The video either needs to be very compressed and short so its under 20MB - then you can upload it to Shopify files - or you can upload to youtube if its larger.

    • @EdCodes
      @EdCodes  Před 2 lety

      Craft only comes with a foreground video unfortunately - no text overlay.

  • @LeRayMM
    @LeRayMM Před 5 měsíci

    brilliant man!!

  • @eugheniat.2121
    @eugheniat.2121 Před rokem

    Great video! Very helpful, thank you very much

  • @Human_Evolution-
    @Human_Evolution- Před rokem

    Great job Ed.

  • @divingontheedge7507
    @divingontheedge7507 Před 2 lety

    Followed the tutorial and everything worked perfectly and as planned thank you! One thing how do clear the box so no words are in it? Mine has coding outside of what I put in the custom liquid?

    • @divingontheedge7507
      @divingontheedge7507 Před 2 lety

      For anyone with the same problem my
      didnt have the / and once I added that it fixed the issue

  • @dmitriylazar1941
    @dmitriylazar1941 Před rokem

    THANK YOU SO MUCH!!

  • @iamannie415
    @iamannie415 Před 8 měsíci

    I tried this for product collections but when i go to the single collection to add the Theme template it only shows the default one. I checked and i saved the new template i made. What to do? THANKS ♥️

    • @EdCodes
      @EdCodes  Před 8 měsíci

      Are you doing this on the live theme? You won't see templates you create on unpublished themes.

  • @STalvacchia
    @STalvacchia Před rokem

    Can you only assign products to templates in the theme that's live?
    Thank you for your videos, they've been very helpful and clear as someone new to Shopify. I'm working for a client and redesigning their site. I'm working in a template that's not live. Is there any way around this?

    • @EdCodes
      @EdCodes  Před rokem +1

      Correct. You can still work on designing the template on an unpublished theme. You can preview it on various products using the sidebar. But yeah you can't actually assign the template to those products until you publish that theme. It's annoying but shouldn't be a huge blocker?

    • @STalvacchia
      @STalvacchia Před rokem

      @@EdCodes Thanks for the response! Right, it's not too much of a hurdle. The preview was acting janky (the product grid wasn't working, always showed just one giant column) and I thought it was because I hadn't assigned it to the template. But when I went back in the designer, it was functioning correctly.

  • @allcraft3090
    @allcraft3090 Před rokem

    you G brother. Thanks for the help

  • @rafaellisboa4439
    @rafaellisboa4439 Před rokem

    Thank you a lot! Do you know if can affect the store speed?