Wrap selection in opening/closing HTML tags


#1

Something similar to how TextMate and Sublime Text do with their ⌃⇧W (Wrap Selection With Tag) command.

I know this is possible in a fashion with Emmet, but having the old keyboard shortcut and functionality work would go along with making Atom feel like the spiritual successor to TextMate.


#2

A nice demo video showing this in action: http://vimeo.com/4346107


#3

I’m really missing that one, too.


#4

This is the only reason why I haven’t switched over from sublime to atom.


#5

I’m guessing that this is fairly simple to create a package for. I don’t need so I probably won’t implement it, I’m just putting it out there.


#6

Definitely missing this. Have a list of items, need each line to be wrapped with li then a . Also missing the bold/italic etc

Any news on a package solution for this? Suggestions?


#7

Unless i’ve missed where this has become a reality already - +1 to getting this working.


#8

:+1:

I’m with @JulianNorton on this. It’s a deal breaker.


#9

+1 this is one of my favourite shortcuts from sublime/textmate, bring it to Atom!


#10

Found a solution. Emmet!


#11

True but I find shift + cmd + a a bit cumbersome to wrap a selected text in an abbreviation you have to select by typing it in a form field sliding down. There should be a default, right?


#12

I’m also waiting for this feature


#13

Okay, so on my end Emmet now has bind the command to ^W .

The main issue I still have is I can only type html element name as the abbreviation, I cannot specify any class or id, and have to manually add them afterwards.

IMO this is the whole point of the “Wrap in tag” command that is found in sublime text: you hit ^W and then type anything you want in the opening tag, class, id and whatever-you-need included, the command is smart enough to figure out that only the first word in the abbreviation is the tag name, and automatically uses it in the closing tag.

I’m using Atom for a full web project I have and while I find a few stuff very awesome, I’m lacking much of my productivity helpers from sublime text. If I wasn’t such a nerd and did not want to fully test Atom’s potential, I would have gone back to Sublime to finish my project. On and on I feel that Atom is still a little young compared to ST, but I’m happy to see how fast it’s evolving.

I am indeed looking forward for a good implementation of this tiny but hours saving command.


#14

Just wanted to shoot you a quick helper, if you’re using Emmet to do wrapping you can add a class/id you just have to do it in the zen coding/haml style syntax.

So if you want to wrap with this:

<span id="wrapper" class="some-class"><!-- stuff being wrapped --></span>

You would type this in the Emmet wrap command:

span#wrapper.some-class

Assuming I’m reading your issue right. Hopefully that helps!


#16

Yes, please! Right now it’s a killing me. We need this :frowning:

Can’t believe this doesn’t have any more likes.


#17

Made something similar few days back, as I was missing this feature as well: atom-wrap-in-tag


#18

You have to install Emmet’s package in Atom. Then, you need to select the text that you want to wrap and press, simultaneously, ctrl + alt + w, and type the tag name that you want wrap your selection. Excuse me for my “noob english”.


#19

Thanks Zeus, that works.

I’m impressed with how mature has gotten in the last two years.


#20

I was also a big fan of this functionality in Sublime Text and decided to try making a package for it called atom-tag-wrapper.

It might still have some rough edges (and I tested it only on OSX), but it supports wrapping multiple selections and automatically indents multiline selections correctly.


#21

thank you very much!! =D