Install Atom-Beautify
1. Atom-Beautify
Atom-Beautify is an Atom plugin which helps you reformat the codes, make your codes easier to see and more beautiful. There is a list of document types supported by Atom-Beautify, which consists of:
- HTML
- CSS
- JavaScript
- PHP
- Python
- Ruby
- Java
- C/C++
- C#
- Objective-C
- CoffeeScript
- TypeScript
- Coldfusion
- SQL
- ....
The following example is the HTML code before being beautified by Atom-Beautify:

And here is the result of the HTML code made by Atom-Beautify:

To install Atom-Beautify,you need to get access to the address below:



2. Using Atom-Beautify
Beautify the entire contents on Editor.

Beautify a part of the code and specify a specific language.
- Select a part of the code that you want to beautify.
- Press Ctrl + Shift + P, then enter the language name.

Beautify when saving files.
Suppose that you would like your HTML files to be beautified whenever you save those files.
- File / Setting / Packages


HTML Tutorials
- Introduction to HTML
- Install Atom Editor
- Install Atom HTML Preview
- Starting with HTML
- HTML Images Tutorial with Examples
- HTML Block/Inline Elements Tutorial with Examples
- HTML Editors
- Install Atom-Beautify
- HTML Styles Tutorial with Examples
- HTML Hyperlinks Tutorial with Examples
- HTML Email Links Tutorial with Examples
- HTML Paragraphs Tutorial with Examples
- HTML IFrames Tutorial with Examples
- HTML Entities Tutorial with Examples
- HTML Lists Tutorial with Examples
- HTML Tables Tutorial with Examples
- HTML Col, Colgroup Tutorial with Examples
- HTML Headings Tutorial with Examples
- HTML Quotations Tutorial with Examples
- HTML URL Encoding Tutorial with Examples
- HTML Video Tutorial with Examples
- HTML Dir Attribute Tutorial with Examples
Show More