Zen coding on lines

Hi

Is there a way to apply zen coding on each line of selected text?
For example, I have list of items and I want to surround each line of text with <li> tag.
I don't want to repeat the same operation for each line...

13 comments

"Surround each line" feature is available in WebStorm/PhpStorm 2.0 EAP (http://confluence.jetbrains.net/display/WI/Web+IDE+EAP). You just need to press Ctrl+Alt+T (or Ctrl+Alt+J) and select "XML Zen Coding", then input "li*".

0

Is there a shortcut that will take two lines like this:

first
second

and then generate this? (I'm only able to wrap the whole block in one tag)

<li>first</li>
<li>second</li>

0

It's a good question. The solution presented here was definitely working before (I've tried it myself ... and Srdjan would not thanking for not working solution).

Seems to me it's broken at the moment ... or maybe it was removed ...

Nah ... please ignore the above sentence -- it is working fine. I've made a mistake when typing the tag (have not used it much recently).

John, in that popup window (the last step), you need to type proper code. You should type li* (tag name & asterisk) not just li .

0

Ok, I was wondering if I should file a bug. I've been trying it in the latest IntelliJ EAP and the latest Webstorm EAP, but I couldn't figure anything out...

0

I have edited my previous message (while you were posting) -- please read it again.

0

aha! There it is :) I knew there was a special character I must be missing (tonight is my first night playing with zen coding)

0

Is there a way to populate an attribute with the surrounded selection?

first
second

into

<foo bar="first">
<foo bar="second">

?

Thanks for all your help btw!

0

Thanks, I'd already read through that. I'm actually using it with Flex's MXML, so the html abbreviations aren't much use to me.

It also seems like:

foo[bar]

should generate

<foo bar="">

And then land the cursor inside the quotes for quick completion

<foo bar="^">

But that's not working at all.

0

I'm not aware of the way how it can be achieved via Zen Coding (all demo videos that I have seen showing nothing for such scenario). But you can do it via custom Live Template (it has to be applied to each item, I think).

The main idea behind Zen Coding is to speed up new content creation (from scratch) rather than manipulating existing one (like in your case, where you already have something).

0

Yeah, I guess what I'm really trying to achieve is what I mentioned above (I thought surrounding text be a workaround):


It seems like:

foo[bar]

should generate

<foo bar="">

And then land the cursor inside the quotes for quick completion

<foo bar="^">

But that's not working at all.

0

Here's what I'm got so far (a 30 second screencast):

http://screenr.com/e3k

I'd really like the "label" node to be an attribute so that I can populate an attribute instead of a node.

0

Please sign in to leave a comment.