Wed. Dec 11th, 2019

Host your Website

Read and learn

FatCow Web Hosting $1.00/mo* Trust your web hosting to the #1 web host provider, GoDaddy!

Atom Editor Tutorials #10 – Emmet For Fast HTML & CSS

1 min read

In this Atom Editor Tutorial, I show you Emmet for writing fast HTML & CSS. Subscribe for more free tutorials Purchase this series for early access:

Support Free Tutorials

The best shared web hosting

Subscribe to Level Up Pro for extra features!

Subscribe to the Level Up Newsletter

To Support Level Up Tuts:

Simple cloud hosting, built for developers.:

Atom is a text editor that’s modern, approachable, yet hackable to the core—a tool you can customize to do anything but also use productively without ever touching a config file.

33 thoughts on “Atom Editor Tutorials #10 – Emmet For Fast HTML & CSS

  1. I'm a newcomer to code writing. I've been using HTML-kit and it allows you to do the same.
    For example: to get <p></p>, I just type "p." (Ignoring quotation marks) and the editor returns <p></p>.
    Pretty cool for beginners.

  2. Nice video – got a problem though. I somehow managed to disenable the autocompletion in my atom editor, ive installed emmet, and also various other packages for autocomplete but I must have pressed some weird buttons – anyone got a solution for that? 🙁 Im using a mac

  3. It's because you backtracked (before the backtrack you mentioned), that Atom's autocompletion took over. A better strategy, I think, is to use a different keystroke for Emmet. I'm using emmet-snippets-compatibility package as well, and not sure what all is coming from where yet. But to solve this same issue I switched to using Shift Space for emmet. Then, I can use either, and decide on the fly.

  4. Guys, about the costume default chromes' new tab interface, how is it done? I'm not sure if it's an extension because I've looked for that before and couldn't find any so my best guess is that it's a javascript app you build by yourself?

    Any help is appreciated. Thanks!

  5. Hello,
    Emmet seems not working in php files.
    I have tried to add in keymap.cson :
    'atom-text-editor[data-grammar="text html php"]:not([mini])':
    'tab': 'emmet:expand-abbreviation-with-tab'
    It works, but the snippets i have created don't work in that case.
    Could you help me for both working ?
    Best regards

  6. These tutorial are very very helpful. The only thing I can complain about the sound editing in all of the videos I've watched.
    The way the audio goes from dead silence to speaking with a fan-like white noise is just unpleasant.

    (sorry for the nitpicking)

  7. Hello,
    Emmet does not work with an index.php as an index.html. I use sublime or phpstorm and it works well in an index.html or index.php.
    Could you tell me how to do ?

  8. is it possible to run HTML and PHP at the same time in atom, i been trying but i only can chose one of both. When i try to use this on an .php file it doesnt work. but when i change it to HTML like by presing ctrl+shift+L it works!! any solution for this?

Comments are closed.

Copyright © All rights reserved. | Newsphere by AF themes.