How to Use The Custom CSS Field in Shopify 2.0 Sections

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 ม.ค. 2025

ความคิดเห็น • 56

  • @EdCodes
    @EdCodes  ปีที่แล้ว +4

    Want to learn more practical coding skills for your store, but not planning on actually becoming a developer?
    I wrote an ebook for you: edcodes.gumroad.com/l/diy-shopify-coding-handbook

  • @xSM666x
    @xSM666x ปีที่แล้ว

    Mate, i started Shopify for my girlfriend a couple of months ago and know the plattform very well. Still your videos made me dig deeper into thinks like css and html and based on your guidance, I improve my store over and over again. Happy to have found you. Keep on creating those great videos!

  • @aliyoruk99
    @aliyoruk99 ปีที่แล้ว +1

    Haha perfect timing! I was asking about this on the discord yesterday

  • @bbeblock
    @bbeblock 6 หลายเดือนก่อน +1

    i love u (no diddy)!!! i literally had no knowledge bout css, now i literally change my banner box within the 2 min header color segment in the video ! thank you

  • @smarrt.ro_official
    @smarrt.ro_official 5 หลายเดือนก่อน

    thank you, I have been looking for a tutorial that is working for almost 2 hours, yours is the only one that worked

  • @Fedgery007
    @Fedgery007 ปีที่แล้ว +2

    Super helpful! This is so powerful to do things that you don’t get out of the box.

    • @EdCodes
      @EdCodes  ปีที่แล้ว

      Yeah, it really was a much-needed feature and makes small tweaks a lot easier now.

  • @araalfaro735
    @araalfaro735 11 หลายเดือนก่อน

    Super helpful!! Always putting out valuable content Ed! thank you

  • @olgagal8800
    @olgagal8800 ปีที่แล้ว +1

    Thank you for another very helpful video.

  • @jonward1314
    @jonward1314 ปีที่แล้ว

    Awesome video, Ed! 🔥🔥🔥

  • @Tiannasings
    @Tiannasings 3 หลายเดือนก่อน

    Thank heavens! this helped so so much

  • @shakibhossain7460
    @shakibhossain7460 ปีที่แล้ว +2

    Super Helpfull .. You are the best shopify Mentor out there ..... I have you request can you please show how to do Shopping and Tax rate as a freelancer for Clients store .

    • @EdCodes
      @EdCodes  ปีที่แล้ว

      I don't do shipping or tax setup for clients. Taxes require legal and accounting knowledge that I don't have, and shipping is very different for each country. Both of these are part of the business that the store owner needs to understand and handle themselves. I don't think it's the web developers job.

    • @shakibhossain7460
      @shakibhossain7460 ปีที่แล้ว

      @@EdCodes wow thanks .... I was beating myself For Nothing .... I thought I have to learn Them .....Thank You very Much

  • @alicebrnra
    @alicebrnra 10 หลายเดือนก่อน

    Thank you ! This was helpful

  • @philrichards9554
    @philrichards9554 ปีที่แล้ว

    Super helpful thank you

  • @duckbarn-interiors
    @duckbarn-interiors 5 หลายเดือนก่อน

    Great tutorial - thank you so much. Have bought the book! 👍

    • @EdCodes
      @EdCodes  5 หลายเดือนก่อน

      Awesome, thank you!

  • @inquisitivemind99
    @inquisitivemind99 ปีที่แล้ว

    @EdCodes, you are Gods gift to DIY store owners. Love the book, check it out people 👍

    • @EdCodes
      @EdCodes  ปีที่แล้ว

      Thank you!

  • @JohnyTheCreator
    @JohnyTheCreator ปีที่แล้ว

    Very helpful video

  • @medievverse
    @medievverse 10 หลายเดือนก่อน

    amazing, very helpful!

  • @rongzhang2077
    @rongzhang2077 5 หลายเดือนก่อน +2

    Hi thank you for the tutorial. Can you show me how to add a custom field on shopify checkout page for them Dawn? I just want to collect a basic information of customer. Thank you so much

  • @almotasembelahelsayed9250
    @almotasembelahelsayed9250 6 หลายเดือนก่อน

    Just Amazing

  • @user-45446
    @user-45446 ปีที่แล้ว

    Super helpful.

  • @TJ-TJ
    @TJ-TJ ปีที่แล้ว +1

    Have been using variables for some time. would be good to see you do a video on how the variables system works.

    • @EdCodes
      @EdCodes  ปีที่แล้ว

      Ok! Coming soon.

  • @justcars2454
    @justcars2454 ปีที่แล้ว

    i have some css basics,but that was 2years ago, i need to go back and learn some important styles

  • @lafikdadi1
    @lafikdadi1 9 หลายเดือนก่อน

    Bro... thanks. I just turned subscriber and your follower. Thanks. I was looking to see if I can find a tutorial to make products images radius round; but this was good information also. Still researching on product radius change, if you could help.

  • @mustafa1872
    @mustafa1872 ปีที่แล้ว

    THANK YOU

  • @lepapierfou
    @lepapierfou 5 หลายเดือนก่อน +1

    Hi! This video is super useful, thank you! Just one doubt: is it possible to edit certain class to tag it as H1, H2 or H3 using this Custom CSS field? I mean, I need to transform all the product titles in 'collection' pages into H3 tags for SEO purposes, but I do not know if I could do it using this Custom CSS field or I have to edit the code instead. Thanks in advance!

    • @FadilulahiOkunola
      @FadilulahiOkunola 2 หลายเดือนก่อน +1

      You can do this using js code, but you need to use location.href to detect if you're on the right page so this doesn't affect all your pages.

  • @Revivalofwisdom369
    @Revivalofwisdom369 ปีที่แล้ว

    hello, how can i change the broder-raduis but only on computer or only on phone?
    Thank you for the videos.

  • @zeeshanayub7873
    @zeeshanayub7873 ปีที่แล้ว

    Hello,
    I would greatly appreciate your assistance in making the collection title centered on the screen, and placing the mobile logo on the left side in the dawn theme. Thank you!

  • @robt4219
    @robt4219 ปีที่แล้ว

    How do you change the dropdown symbol from a arrow down and arrow up to a + and - ?

  • @LeAffani
    @LeAffani 9 หลายเดือนก่อน

    Thanks

  • @CabreraMotorSports
    @CabreraMotorSports 10 หลายเดือนก่อน

    Best videos and explanations Thanks. Can you share the CSS code to make all my product descriptions' h2 tags without changing the font?

  • @greatideas4820
    @greatideas4820 10 หลายเดือนก่อน

    Make a video on custom code to add customer reviews section under add to cart or buy now, where code automatically took reviews from products, may be one review or slide reviews one by one with image and name of customer

  • @shinafaith...
    @shinafaith... ปีที่แล้ว

    Can you do a video on how to add scrolling text to your Shopify page?

  • @გრიგოლდალაქიშვილი
    @გრიგოლდალაქიშვილი 11 หลายเดือนก่อน

    Thank you for good video, I'm interested if you have the video about css minify or compress on shopify? becouse of speed of our online store for google. If not can you advise me the simple way to do it becaouse I'm not developer.

  • @rjbbrown
    @rjbbrown หลายเดือนก่อน

    I have a fairly good working ability with CSS but for some reason I can’t highlight to make changes or add to the CSS code in the Custom CSS field for the particular section that I want to edit? Any idea why?

  • @volorix
    @volorix ปีที่แล้ว

    Online Store editor session can't be published

  • @mayankkumar9949
    @mayankkumar9949 ปีที่แล้ว

    how i put background-image in the hero section using custom cs

  • @gaastiir
    @gaastiir ปีที่แล้ว

    Is there anyway to align the text to center, I can't get it to work

  • @hanzade99
    @hanzade99 ปีที่แล้ว

    Hi Ed,
    I added my Adobe font to shopify and it works everywhere on the website except for the header. I am trying to use this feature to add it, but how do I find the Adobe font's code? The font name is Synthese.

  • @AllinflexGeraldine
    @AllinflexGeraldine ปีที่แล้ว

    Do you got a code what can be used to stop the inthesandbox spam urls?

    • @EdCodes
      @EdCodes  ปีที่แล้ว

      Not sure what you mean?

  • @moxitjain8004
    @moxitjain8004 8 หลายเดือนก่อน

    Can you help me with shopify item upload section bcs at my shop we are doing b2b and b2c both so we have multiple price slab like example :-
    Sku-1pcs :-100/-
    SKU-2 to 9pcs:- 75/-
    Sku- 10 & above:- 55/-
    So any one want to resale or purchase any product as par need or as par reselling product
    Can you do coding like that if customer take 1 pc it will cost 100 rupess or if customer take 2 to 9 it will cost 75 or if he will take 10 &. Above that it will cost 55.. And the calculation will automatically show as par pricing...

  • @jerodjax
    @jerodjax ปีที่แล้ว

    Not sure if you know anything about it but I'm trying to use a pseudo element so I can position a couple different icons in my section background. For whatever reason I cannot get psuedo elements to work. Do you know if they aren't allowed or something?

  • @EvanLaulom
    @EvanLaulom ปีที่แล้ว

    GPT for you writing your css inside the custom css👍

  • @chad.765
    @chad.765 ปีที่แล้ว

    Is it possible to use in these fields or their section equivalents, to enable live-updating display of variant-specific info, for example things like SKU numbers that need to change after options selection on product pages? Maybe possible using a custom liquid section/block?
    It would be nice to have that stuff in one of these boxes instead of hardcoded into theme or page template, like you said to keep theme updates easy to do.

    • @EdCodes
      @EdCodes  ปีที่แล้ว +1

      It's possible to add in custom liquid blocks/sections, but I wouldn't do that personally. I use these areas for very small, quick and non-essential tweaks. I'm aware that someone else non-technical might be working on the store and accidentally delete the section/block and the code could be lost. It's not a big deal because even if I don't have them backed up anywhere, it's not hard to rewrite.
      The features you're talking about are a bit more complex and I wouldn't want to lose that code. I'd rather have it in the theme, maybe in a separate file like custom.css and custom.js, but that way they are tracked with Git (and backed up on Github) and kept safe.

    • @chad.765
      @chad.765 ปีที่แล้ว

      @@EdCodes I know there are some solutions out there but they aren't contained in a block for those of us who are the only ones working on our themes and want to maintain easy-upgrade potential and avoid having to modify default theme files. A section setup as a framework for showing live-updating variant info would be awesome, if you needed a hint for a pro section for your gumroad. Provide the minimal-length js code needed to insert into a section block where we can then add our own liquid things like variant-level metafields or specs and have it update on the product page after a customer makes/changes a variant selection. It's one of the big things I have that complicates pulling dawn updates over.

    • @EdCodes
      @EdCodes  ปีที่แล้ว +1

      Oh ok I see what you mean... yeah that would be useful, might be difficult because of differences between themes, but for Dawn I could try it. Thanks for the suggestion!

  • @christophercapio5005
    @christophercapio5005 4 หลายเดือนก่อน

    thank you sir, very helpful