Automatically Save CSS changes made in Chrome DevTools (Using Workspace)

Поділитися
Вставка
  • Опубліковано 5 жов 2024

КОМЕНТАРІ • 103

  • @aten488
    @aten488 Рік тому +1

    Thank you man. I had to search through 5 videos befor finding yours .Your a life saver.

  • @musikkimies
    @musikkimies 2 роки тому +8

    Dude, this video is 🔥🔥🔥! Thank you for teaching this! -- I shared this video to a development group I'm a part of. Hopefully it will drive some traffic to your channel. Thanks again.

    • @ieatwebsites
      @ieatwebsites  2 роки тому

      Awesome! Thank you so much for sharing !

  • @touficahammed4378
    @touficahammed4378 3 роки тому +5

    Perfect. While working, suddenly this idea came to mind. Cause it takes lots of time to copy and paste. Thanks, dude. Help me perfectly. +1

  • @js9069
    @js9069 2 роки тому +5

    This video was perfect!!! Thank you for tackling such a small but important problem!

  • @csacicero
    @csacicero 2 місяці тому

    Fantastic! simply amazing!!! I didn't know it was possible to do this, I did some tests through inspect, but I always lost the code after refresh, so I had to copy everything... your tip will save many hours of work from now on. Thank you very much and congratulations!

  • @Timooooooooooooooo
    @Timooooooooooooooo 3 роки тому +2

    I think I remember somebody in the DevTips Discord showing this off a while ago. It's pretty cool! I haven't used it yet

    • @ieatwebsites
      @ieatwebsites  3 роки тому

      Hi timo! Yeah. A lot of people don’t use it and I think is very helpful.

  • @S1DEKICK223
    @S1DEKICK223 3 роки тому +10

    Awesome Tutorial thank you! Is there a way to get this to work with SCSS/SASS?

  • @yevheniibabenko127
    @yevheniibabenko127 3 місяці тому

    cool, it works even after 3 years later

  • @subachmaksim3238
    @subachmaksim3238 2 роки тому +2

    Simple and very useful. Thanks!

  • @InstructorDePoy
    @InstructorDePoy 2 роки тому +2

    This is wonderful! Thank you. This worked perfectly for my CSS file, but for some reason, when trying to edit my html file, instead of the little green light, I simply get an asterisk next to the file name and it doesn't sync my changes. Anyone else have this issue? For example, it will just show index.html*

    • @Okay028
      @Okay028 Рік тому

      Hi,did you find a solution for this?🥲

  • @VV-wl8gb
    @VV-wl8gb 2 роки тому +2

    That's a fantastic way to improve the workflow! Does a similar feature exist for Firefox as well?

  • @hendrik5041
    @hendrik5041 Рік тому +1

    It doesn’t work for me. My files do not show up green

  • @kantheshamurthysb1712
    @kantheshamurthysb1712 3 роки тому +4

    Hello, Do I need to do some additional setting to make this work for web frameworks like Angular (because it is currently not working in Angular)?

    • @ieatwebsites
      @ieatwebsites  3 роки тому

      I didn’t tested using frameworks. Sorry.

  • @Alenvei
    @Alenvei 2 роки тому +1

    You're a lifesaver. Thanks!

  • @stevegarza9836
    @stevegarza9836 2 роки тому +2

    Great video, I followed all the steps but when I click on the + Add folder to the workspace it doesn't show index.html, main.js, and style CSS. How do I add those? Thank you for the video and help.

  • @ali-pc7nv
    @ali-pc7nv Рік тому +1

    A brilliant lesson !

  • @muditchoudhary28
    @muditchoudhary28 2 роки тому +1

    Thanks for sharing 😄
    It's very helpful 👍

  • @sudershansingh2839
    @sudershansingh2839 2 роки тому +1

    awesome tutorial! very helpful

  • @DennisBareis
    @DennisBareis 2 місяці тому

    That works well but I was hoping that it it would just save my changes to a file, when I'm playing around I don't like to touch source code just in case of a major boo-boo.

  • @ticey4316
    @ticey4316 Рік тому +1

    Is there any way to save html changes as well?

  • @irrishcharlie7528
    @irrishcharlie7528 3 роки тому +3

    I watched your video, It's actually a lot simpler than I had expected, but for some reason as soon as I close the page all of my edits return to their defaults. I redesigned this page 3 times since yesterday with the same results. Any thoughts or ideas would be greatly appreciated. Thank You

    • @charlieparkeris
      @charlieparkeris 2 роки тому +1

      Did you figure it out? I'm having the same issue.

  • @parthjasani7
    @parthjasani7 2 роки тому +1

    Awesome man you made my day

  • @Tranhaidang3301
    @Tranhaidang3301 3 місяці тому

    Nice bro it's working good!

  • @nonchalant8473
    @nonchalant8473 3 роки тому +1

    Great tutorial. Thank you!

  • @kanyshaiosmonova7968
    @kanyshaiosmonova7968 2 роки тому +1

    Thank you!

  • @leonardhalstead8810
    @leonardhalstead8810 4 місяці тому

    Not working on my PC. No automatic saving happening.

  • @saulte-beaudette1401
    @saulte-beaudette1401 2 роки тому

    I have a wordpress website. It looks totally different than your example. Can this method work on a wordpress site?

  • @Mohit-ye6vo
    @Mohit-ye6vo 2 роки тому

    bro how to get the root folder of any website please tell, i do not have any idea about root folder

  • @djilansoule
    @djilansoule 2 роки тому +1

    Thank you, you are my man !!!!!!

  • @rangabharath4253
    @rangabharath4253 3 роки тому +1

    Awesome as always 👍😀

  • @VidarrKerr
    @VidarrKerr 11 місяців тому

    I have a page I use daily online and I removed a lot of the clutter using the dev tools. How can I save those changes and load them whenever I view that page? Is this even possible?

  • @AixiaSolutions
    @AixiaSolutions 3 місяці тому

    Hi, do you know a work arround I wanted to modify text on an web app or login page if I dont have access to the HTML file? I would like to translate many parts which aren't translated on this one & find a way to save all modification & give it to anyone else who uses the same webapp. Great video by the way & thanks in advance.

  • @raymondjones4390
    @raymondjones4390 8 місяців тому

    I work remotely and the files in my IDE use SFTP. Looks like this only works on a local website on one's machine correct?

  • @Abhinav_-gs3ej
    @Abhinav_-gs3ej 10 місяців тому

    can we undo the recent changes in devTools if we want previous data?

  • @charlieparkeris
    @charlieparkeris 2 роки тому +7

    This isn't working as expected. If I go into the sources tab and make edits to the file from there, it works. But if I'm in the elements tab, I can make changes, but they don't save. If I hot cmd+s from the sources area, it saves fine. If I hit cmd+s from the elements area, it tries to save a new version as if I'm downloading the webpage.

    • @brettrobin10
      @brettrobin10 Рік тому

      were you able to find a solution to this?

    • @charlieparkeris
      @charlieparkeris Рік тому +2

      @@brettrobin10 No. I haven't even tried since.

  • @masudrahman3818
    @masudrahman3818 Рік тому +1

    it's really awesome.❤✨✨

  • @fighterfc7113
    @fighterfc7113 3 роки тому +1

    Great content sir ❤️

  • @juanjosemurillo4663
    @juanjosemurillo4663 3 роки тому +2

    best thing in the internet you should have some kind of bitcoin wallet you know this is GRET!!!!

    • @ieatwebsites
      @ieatwebsites  3 роки тому +1

      Thank you!! A Bitcoin wallet for donations?

  • @hanstriple9
    @hanstriple9 8 місяців тому

    hello brother whether this can be said to change permanently and whether it also requires additional software or what ? ... please explain. thank you very much

  • @lukavideo
    @lukavideo Рік тому

    are changes made in chrome devtool saved automatically with some AUTO SAVE? because I need to use CTRL+S for saving changes. If Yes, how you set AUTO SAVE mode in Chrome Dev Tool ?

  • @OneBrokeBloke
    @OneBrokeBloke Рік тому

    Is there a way to get this functionality without autosaving? Like, i wanna experiment with the CSS, and if it works, then i want to manually save it?

  • @tannuyadav-qy7lc
    @tannuyadav-qy7lc 3 місяці тому

    Sir agr ye kam nhi kr rha ho to kya error ho skte h

  • @Killer_X_So2
    @Killer_X_So2 5 місяців тому

    Where you het that files? Please answer

  • @C0D3O
    @C0D3O 3 роки тому

    Is it possible to have "I" buttons that explains why css values don't work like in the firefox?

  • @hxlx925
    @hxlx925 Рік тому +1

    Thanks dude !!!

  • @adrijabanerjee9843
    @adrijabanerjee9843 Рік тому

    Why am I not getting the green dots?

  • @shashankgiri8004
    @shashankgiri8004 Рік тому

    does it work in pdf images?

  • @pauljohnson7463
    @pauljohnson7463 2 роки тому

    I never knew you could use chrome as a web IDE

  • @Peywan
    @Peywan Рік тому

    is there any better way than this for react? tried it out in react wasnt the best.

  • @sandeelacerna7292
    @sandeelacerna7292 Рік тому

    Can i apply this on wordpress website?

  • @ahthisisgood
    @ahthisisgood Рік тому

    Are the changes saved in the main theme or Child theme?

  • @ChristopherClaudioSkierka
    @ChristopherClaudioSkierka Рік тому

    Hi there hope you are well. I have started to use devtools but I have an issue, wonder if you could help me please? Those arrows to the right side (style section) which you can toggle on/off , well on my system those tick boxes are just not there at all. Is there a setting to make them appear? Ps I use chrome .\thanks in advance

  • @SM-hp9pd
    @SM-hp9pd 3 роки тому

    Can we edit and save data in read only google sheet?

  • @balhallak
    @balhallak 3 роки тому +1

    Helpful 👍

  • @mdcomputer1708
    @mdcomputer1708 3 роки тому +1

    tnq so much bro

  • @troom6851
    @troom6851 Рік тому

    Thanks a lot man, you save my time. :D Greetings :)

  • @omaralhlawany6046
    @omaralhlawany6046 2 роки тому

    Does it work with WordPress?

  • @Omarfaruk-io9ee
    @Omarfaruk-io9ee 3 роки тому +1

    thank you

  • @rahulbora7563
    @rahulbora7563 3 роки тому

    Can we do this for react?

  • @PavelIsp
    @PavelIsp 3 роки тому +1

    Now, to get it to work with CSS-in-JS :)

  • @HooliganElf
    @HooliganElf Рік тому

    can someone please tell me how to find a root folder of my page? i am absolutly not fluent in any of this type of stuff and google isnt helpfull.. is it a folder i should create? i have my page on woocommerce/wordpress, please help :)

  • @kamelboulenache3147
    @kamelboulenache3147 Рік тому

    it doesn't work with react

  • @tannuyadav-qy7lc
    @tannuyadav-qy7lc 3 місяці тому

    Ye elements pr kam nhi kr rha h

  • @assimenikacedric7121
    @assimenikacedric7121 3 роки тому

    Good evening, will it be possible to edit my files from Devtools, but directly in my server and not locally?

    • @ieatwebsites
      @ieatwebsites  3 роки тому

      Not sure. But thats not a good idea

  • @abhishekgoswami9105
    @abhishekgoswami9105 2 роки тому

    Not working in react app

  • @oussamaelhadj7814
    @oussamaelhadj7814 2 роки тому

    sir i can't edit ?

  • @nareshkumar-ug5sw
    @nareshkumar-ug5sw 3 роки тому +1

    Thanks

  • @touhami_dz6458
    @touhami_dz6458 2 роки тому

    can i do this to other websites that i dont own ? like facebook ?

    • @RegisSouza-k7h
      @RegisSouza-k7h 2 місяці тому

      There is some Chrome Extension that you can load custom CSS for websites. I've used one in the past, don't remember the name of that specific one.

  • @renjithnks8634
    @renjithnks8634 2 роки тому

    Does this work for SASS changes

    • @garth0079898
      @garth0079898 2 роки тому

      I just tried and was only working in css files :(

  • @l3vi135
    @l3vi135 Рік тому

    dharman 😳

  • @kingjames2036
    @kingjames2036 Рік тому

    Thank u

  • @WhiteSiroi
    @WhiteSiroi 3 місяці тому

    ty G

  • @intensiveadvancedmath5281
    @intensiveadvancedmath5281 Рік тому

    Who is here from nen ninja? Djangonautic? Mr Shaun?

  • @virtumind
    @virtumind 11 місяців тому

    Great but no jobs

  • @JamboRiffs
    @JamboRiffs Рік тому

    undo?