Hyperlink Helper package for the Atom editor
Hyperlink Helper package for the Atom editor - Robert's talk


				
				
					
						
						Published on Tuesday, November 4, 2014
					

					Knowing your editor is important, and if it’s open source and you can add functionality, even better! Therefore, I dug into Atom from GitHub (which is open source!) to add something I like: a Hyperlink Helper.

As mentioned in my recent posts on Vim and favorite editors, I think it’s great for any developer to experiment and tweak their editor(s) of choice.
Using Atom a bit on the side, I thought I’d look into how to create a package for it. It offers a lot of them already, browsable through the packages web site or through the within the app itself.
Introducing the Hyperlink Helper
Back in the day when I started using TextMate, one of my favorite functions was to have a keyboard shortcut to wrap the selected text with an <a> element and set its href attribute to what’s in the system clipboard. Then when I moved to Sublime Text, someone created the Hyperlink Helper package for Sublime Text.
So, now with Atom, the next natural evolution would be for me to create one for it. 🙂
How to install it
Go to Settings in Atom > Packages: Search for Hyperlink Helper.
Functionality

Wraps selected text with an anchor element, e.g. Hello becomes <a href="https://robertnyman.com">Hello</a>
Sets the href attribute of that anchor to what’s currently in the system clipboard


How to trigger it

Select some text in the current document
Hit its keyboard shortcut:Ctrl + Cmd + L (Mac)Ctrl + Alt + L (Windows/Linux)or through Packages > hyperlink-helper > link in the Atom top menu

Source code and improvements
The source code is on GitHub – feel free to issue pull requests with improvements!
Getting started building packages for Atom
Does all this sound interesting and you want to build your own package? Then I recommend reading Creating Packages and Create Your First Package in the Atom docs. Atom also offers a way to generate a template package for you through the Package Generator: Generate Package in the Command Palette.
This is triggered with:
Cmd + Shift + p (Mac)
Ctrl + Shift + p (Windows/Linux)
Developer pro tip: in Atom, hit Cmd + . (Mac)/Ctrl + . (Windows/Linux) to show the Keybinding Resolver: great for seeing which command is connected with any keyboard shortcut combination you can come up with! (found via What are the keyboard shortcuts of the Atom editor? – keyboard shortcuts in Atom can also be found via Settings > Keybindings)
Bonus: Hyperlink Helper for Vim
Vim user and want a Hyperlink Helper? Just add this to your .vimrc file and call it via Space + l in Visual mode:
vmap <Space>l c<a href="<C-r>+"><C-r>"</a>


					

				

				
		
	

				

				