Port TextMate's “Wrap Selection In Tag”

[steveluscher]

I regularly mash ctrl-shift-w in TextMate; it wraps the current selection in <p>…</p>, highlights both ‘p’ characters letting me type a replacement, then unlatches the selection as soon as I hit space (as I continue to type an attribute/value pair). It's pretty awesome.

Anyone up for porting it over?

TextMate's “Wrap Selection In Tag”

[saddacracker]

This would be great for us front-end duders.

[rutger1140]

I use this all the time as well. One of the main reasons I can't kiss Sublime goodbye for now...

[lpdumas]

I'm here with you guys!

[cschell]

This is also the reason I cannot turn my back on Sublime – this issue is closed though, is it already implemented?

[mikefats]

Here's a solution for anyone looking for HTML/CSS tag wrapping:

1. install 'Emmet' package
2. shift+cmd+A to wrap in tag [http://docs.emmet.io/actions/wrap-with-abbreviation/]

[rutger1140]

@mikefats Thanks, that's a good workaround :+1: It's not quite the same behavior but it will do.

@cschell The issue is not closed, a closed issue is referenced.

[cschell]

@lekkerduidelijk ah well – using GitHub since three years and still too dumb to understand it, sorry

[JackWells]

Linux Feeback for users who stumble into this thread: I followed the Emmet install instructions through 'npm install' and 'restart atom', but this did not work. Next went through Atom's Edit -> Preferences -> Packages and installed Emmet there.

See: https://atom.io/packages/emmet

The key binding listed to do a wrap-with is Cntl-Alt-W. This opens the form to put in the tag at the bottom of your screen.

A simple example: for a paragraph, type ">p" (without the quotes) in the dialog. This works.

[dannymichel]

i installed the emmet package and tried using command shift G and command shift a. Neither worked.

[dannymichel]

Also tries shift command a. Doesn't work.

[jjulian]

@dannymichel Try ctrl + w (https://atom.io/packages/emmet)

[steve-ross]

emmet isn't at all what I'm looking for, seems way overkill for such a simple feature

[Trudko]

@steve-ross and others I created simple package which might help Wrap Selection. Please if something is missing let me know!

[jpcmf]

no success :-1:

[cjmosure]

Yup, I find myself popping open Sublime instead of Atom for this. The intended functionality should be a shortcut that automatically wraps the selected text in <p> and </p> with both p's selected for manipulation. Having emmet open a dialog box to choose the text to wrap it in works, but not as quickly as Sublime's approach.

[ghost]

Install Emmet and use ctrl+w and a small bottom window will pop up then just type your tag and that will work.

[peterthomson]

Can't believe Atom lacks such a simple but important feature. And using Emmet to create a clunky multi-step solution is not a solution to this keyboard shortcut issue for wrapping the selection in a tag.

[stevesunderland]

Wow can't believe this is still an issue! Back to Sublime :sob:

[lpdumas]

As @jonathanbello said, using emmet is pretty straight foward.

[cjmosure]

Sublime skips the input step, which I feel is 1000 times better

[da-n]

Been trying out Atom for a few days and pretty amazed this feature is not included, in Sublime I use it dozens of times a day. Would be awesome not have to install Emmet. Aside from this, Atom is very impressive.

[DaveEveritt]

Writing a lot of HTML means, for me, this is essential in one of the Atom core packages language-html or autocomplete-html.

[geekish]

+1. I hit ctrl-shift-w way too often... Emmet just isn't my thing.

[sanusart]

I was looking for this functionality too as I recently trying Atom (and really liking it) and I just miss simple "mark and wrap" shortcut. I made very simple package to wrap selection in html tag. Don't expect too much from it though atom-wrap-in-tag. Not sure I'll have much time to improve it or bugfix it, but maybe someone will find it useful.

[DaveEveritt]

@sanusart I like it. Nice and simple, no clashes with other keymappings, does one thing, and does it well. And far less clunky than the Emmet way. Installed :-)

[jonobr1]

+1!

[jpcmf]

guys, how select in atom windows version the block of start and end of div or whatever? in mac just cmd + , but in windows i dont figured out how works :/

[geekish]

I was looking for this functionality too as I recently trying Atom (and really liking it) and I just miss simple "mark and wrap" shortcut. I made very simple package to wrap selection in html tag. Don't expect too much from it though atom-wrap-in-tag. Not sure I'll have much time to improve it or bugfix it, but maybe someone will find it useful.

Finally installed this, working just as it should so far! Thank you!

[tehapo]

I also implemented my own version of this functionality as the atom-tag-wrapper package. It supports multiple selections and also indents multiline selections correctly inside the added tag.

[cjmosure]

Both atom-wrap-in-tag and atom-tag-wrapper work prefectly.