Sublime Text is, no doubt, one of the most powerful text editors out there. The number of satisfied users attests to that. If you explore it, you will eventually see how beautifully its powerful features are hidden behind a simple and elegant interface.
If you have been using Sublime Text for some time, now is the time to upgrade your arsenal with new ammunition. I’ll be taking you through some of my favorite tips and tricks. Knowing them might just unleash your hidden powers as a programmer to the world.
Further Reading on SmashingMag: Link
- 50 Powerful Time-Savers For Web Designers1
- Powerful Workflow Tips, Tools And Tricks For Web Designers2
- How To Keep Your Coding Workflow Organized3
Sublime Text Plugins Link
Package Control Link
Once it is installed, you can access it using the command palette. To install a plugin, press
Cmd ⌘ + Shift ⇧ + P (Mac) or
Ctrl ⌃ + Shift ⇧ + P (Windows and Linux), and then enter
Install Package and press “Return.” The list of plugins in the repository takes a few moments to load, but then you can type the name of the plugin you are interested in and install it from there. Some of my favorite plugins are listed below.
Sidebar Enhancements Link
Sublime Text’s default sidebar can only do some limited tasks. The Sidebar Enhancements5 plugin supercharges Sublime Text with commands for opening the file in a browser, copying, pasting, copying a path, duplicating, deleting and more.
Plain Tasks Link
Plain Tasks6 converts Sublime Text into a powerful to-do list manager. You can install it via Package Control. Create a file with
.todo as the extension to activate Plain Tasks on top of it. For other tips, you can access the tutorial provided in the plugin, available at “Preferences” → “Package Settings” → “Plain Tasks” → “Tutorial.”
For a new task:
Cmd ⌘ + Return ↵(Mac)
Ctrl ⌃ + Return ↵(Windows and Linux)
To mark as done:
Cmd ⌘ + D(Mac)
Ctrl ⌃ + D(Windows and Linux)
To mark as cancelled:
Ctrl ⌃ + C(Mac)
Alt + C(Windows and Linux)
Sublime Linter Link
Writing code takes time, and HTML grunt work such as writing tags and wrapping classes with quotes can be boring. Emmet takes care of all that. It magically expands abbreviations into a whole HTML or CSS structure. The syntax it uses for these abbreviations is inspired from CSS selectors. Let’s watch it in action.
Sublime Tutor Link
Sublime Tutor13 is an interactive in-editor tutorial for keyboard shortcuts in Sublime Text. If you have just started with Sublime Text, the plugin will instantly boost your productivity by teaching you nifty tips and tricks within the editor itself. The plugin uses the spaced repetition technique to make sure you remember the commands it teaches.
Sublime Text Functions Link
Go To Anything Link
This is probably the most powerful and most-used command in Sublime Text. Navigate through files, folders, symbols and lines with ease.
To go to a file:
Cmd ⌘ + P(Mac)
Ctrl ⌃ + P(Windows and Linux)
Press the keyboard shortcode, and start typing the name of a file. Sublime Text will perform a fuzzy search and fetch you the desired file instantly.
Go to a symbol:
Cmd ⌘ + R(Mac)
Ctrl ⌃ + R(Windows and Linux)
Go to a line:
Ctrl ⌃ + G(Mac)
Ctrl ⌃ + G(Windows and Linux)
To go to a specific line in a file, type a colon followed by the line number, or use the keyboard shortcode.
Word Selection Link
Cmd ⌘ + D(Mac)
Ctrl ⌃ + D(Windows and Linux)
Put your cursor on a word, press the keyboard shortcode, and the word will instantly be selected. If you press the same key combination again, Sublime Text will go into multi-selection mode and select other instances of the same word in the document. You can use this method to quickly add or replace text in all instances of a word.
Ctrl ⌃ + Cmd ⌘ + G(Mac)
Alt + F3(Windows and Linux)
This is another way to achieve the same thing. Instead of incrementally searching for a word, it performs a bulk search of the word under the cursor and switches to multi-selection mode.
Expand Selection to Scope Link
Cmd ⌘ + Shift ⇧ + Space ␣(Mac)
Ctrl ⌃ + Shift ⇧ + Space ␣(Windows and Linux)
Break Selection Into Lines Link
Cmd ⌘ + Shift ⇧ + L(Mac)
Ctrl ⌃ + Shift ⇧ + L(Windows and Linux)
Use this shortcut to break the selected area into multiple lines, putting Sublime Text in multi-selection mode. I use this trick to quickly convert a list of words into an enclosed array of strings.
Column Selection Link
Ctrl ⌃ + Shift ⇧ + Up ↑ / Down ↓(Mac)
Ctrl ⌃ + Alt + Up ↑ / Down ↓(Win)
Alt + Shift ⇧ + Up ↑ / Down ↓(Linux)
Use this shortcut to select a column in Sublime Text. Put your cursor anywhere in the document, and then press the shortcut to select columns upwards or downwards. This also takes you into multi-selection mode, like the two commands above.
F9(Windows and Linux)
I like to keep my CSS properties sorted alphabetically. This command is extremely useful for that. Select the block that you need to be sorted (pro tip: use
Ctrl ⌃ + Shift ⇧ + J to select an indentation level), and then press the keyboard shortcode.
Turn on Spellcheck Link
No more getting disappointed by typographical errors after the code has made it to the review stage. Use this key to quickly toggle the spellchecker.
Cmd ⌘ + /(Mac)
Ctrl ⌃ + /(Windows and Linux)
This is one of my most frequently used shortcut. Marking comments in any programming language is made simple with this shortcut. In an HTML file, it puts in a pair of
// at the beginning of a line.
Bubble a Line Up or Down Link
Cmd ⌘ + Ctrl ⌃ + Up ↑ / Down ↓(Mac)
Shift ⇧ + Ctrl ⌃ Up ↑ / Down ↓(Windows and Linux)
Want to move a snippet of code five lines up? Cutting and pasting is really old school. Use this keybinding to take the snippet wherever you’d like. Press the shortcut again to keep moving it further up or down.
Duplicate Selection Link
Cmd ⌘ + Shift ⇧ + D(Mac)
Ctrl ⌃ + Shift ⇧ + D(Windows and Linux)
By default, this shortcut duplicates the current line and puts it on the next line. If you select a region and press this shortcut, it duplicates the whole region.
Join Two Lines Link
Cmd ⌘ + J(Mac)
Ctrl ⌃ + J(Windows and Linux)
This joins the following line to the current line, replacing all white space in between with a single space. Performed on a block of lines, this joins all of the lines together.
Go to Matching Bracket Link
Ctrl ⌃ + M
Use this command to move your cursor from one bracket position to another. This is especially useful when you get lost in a long method and want to reach its starting position (or vice versa).
Close HTML Tag Link
Cmd ⌘ + Opt ⌥ + .(Mac)
Alt + .(Windows and Linux)
Use this shortcut to close the currently open HTML tag. It inserts the matching closing tag at the current cursor location.
Find in Project Link
Cmd ⌘ + Shift ⇧ + F(Mac)
Ctrl ⌃ + Shift ⇧ + F(Windows and Linux)
This is the
grep equivalent of Sublime Text. It finds a term within an entire project. The special thing about this command is that it is blazing fast. There are options to make it case-sensitive and to perform a regex match as well.
To search for a particular term in the current document, project-wide, put the cursor on that term and then press
Ctrl ⌃ + E, which will put that term in the search box. Pressing the shortcode above populates the project-wide search box with this term.
Switch Between Tabs Link
Cmd ⌘ + Shift ⇧ + [or
Ctrl ⌃ + Page Up ⇞or
Page Down ⇟(Windows and Linux)
Just like in a web browser, you can open multiple tabs in Sublime Text. To move from one tab to another, you can use the shortcuts noted above, and use
Cmd ⌘ + T (Mac) or
Ctrl ⌃ + N (Windows and Linux) to create a new tab.
Command Palette Link
Cmd ⌘ + Shift ⇧ + P(Mac)
Ctrl ⌃ + Shift ⇧ + P(Windows and Linux)
As you become proficient with Sublime Text, you’ll want to access the menus less and less and instead be able to do everything with a few taps of the keyboard. With the command palette, you can quickly type a command, and Sublime Text will do a fuzzy match with an existing set of commands, letting you access the commands from a convenient place.
Here are some things you can try in the command palette — set the syntax of a newly created file, sort lines in the current document, and install a plugin using Package Control.
Show Console Link
Ctrl ⌃ + `
Sublime Text comes with an embedded Python interpreter. It’s a handy tool to execute Python commands or to quickly test Sublime Text’s APIs when you’re developing a plugin for the editor.
Keep in mind that this interpreter comes bundled with Sublime Text, and it is different from your system-installed Python. The purpose of this console is to interact with Sublime Text’s API for plugins. You probably used this console when installing Package Control.
Distraction-Free Mode Link
Cmd ⌘ + Ctrl ⌃ + Shift ⇧ + F(Mac)
Shift ⇧ + F11(Windows and Linux)
For writers and others who need to be able to concentrate intently, Sublime Text has an even more minimalistic interface. Use the shortcut to toggle distraction-free mode on and off.
Text Command-Line Helper Link
Sublime Text includes a command-line tool that makes it super-easy to work with files on the command line. To get it working on a Mac, you need to make it available in your shell.
Assuming you’ve placed Sublime Text in the “Applications” folder and that you have a
~/bin directory in your path, you can run the following:
ln -s "/Applications/Sublime Text.app/Contents/SharedSupport/bin/subl" ~/bin/sublime
To use it as the default editor for commands that prompt for input (such as
git commit), set the
editor environment variable.
export EDITOR='sublime -w'
On Windows, you can use
subl.exe in a similar way.
Sublime Text is full of such powerful shortcuts and commands. You probably won’t be able to remember these just by skimming this article; rather, you’ll need to practice as you’re going through it. List the most useful shortcuts for yourself, and refer to them regularly as you’re working with Sublime Text. Practice is the key. You are on your way to becoming a Sublime Text ninja.
(ms, il, al, ml)
- 1 https://www.smashingmagazine.com/2010/10/50-powerful-time-savers-for-designers/
- 2 https://www.smashingmagazine.com/2013/10/powerful-workflow-tips-tools-and-tricks-for-web-designers/
- 3 https://www.smashingmagazine.com/2011/01/cleaning-up-the-mess-how-to-keep-your-coding-workflow-organized/
- 4 https://packagecontrol.io/installation#st3
- 5 https://packagecontrol.io/packages/SideBarEnhancements
- 6 https://packagecontrol.io/packages/PlainTasks
- 7 https://packagecontrol.io/packages/SublimeLinter
- 8 https://packagecontrol.io/packages/SublimeLinter-ruby
- 9 https://packagecontrol.io/packages/SublimeLinter-pep8
- 10 https://packagecontrol.io/packages/SublimeLinter-jshint
- 11 http://www.sublimelinter.com/en/latest/
- 12 http://emmet.io/
- 13 https://sublimetutor.com/
- 14 https://www.smashingmagazine.com/wp-content/uploads/2016/06/sublime-tutor-opt.png
- 15 https://packagecontrol.io/packages/Sublime%20Tutor
- 16 http://www.sublimetext.com/docs/3/api_reference.html