Sublime Forum

Zen Coding ( CSS Snippets )

#21

[quote=“sublimator”]UPDATE

I just pushed version 1.1 of Zen Coding to BitBucket (up again, hurrah).
[/quote]

Just installed new beta 20091002 and Zen Coding 1.1. Zen Coding now not working :frowning:

0 Likes
#22

Oh, files from package was not installed completely. I extract files from package manually and all works great!

0 Likes
#23

Works for me… do you have any ideas which files were missing? Did you have an earlier version installed before installing 1.1?

0 Likes
#24

After installing Zen Coding package i have this files in zen coding package folder of sublime text:

dynamicsnippets.py dynamicsnippets.pyc initzen.py initzen.pyc zc.py zc.pyc
And Zen Coding not working.

After manual extraction from package i have this:

zencoding [folder] Default.sublime-keymap dynamicsnippets.py dynamicsnippets.pyc initzen.py initzen.pyc README.txt zc.py zc.pyc
And all works.

0 Likes
#25

http://forums.disenteria.ru/style_emoticons/default/icon_smile_blush.gif http://forums.disenteria.ru/style_emoticons/default/mol.gif

0 Likes
#26

This is a truly awesome plug-in!

I have a few bug reports.

  1. If I enter something like this…
select>option#item-$*3

The output select list is all on one line. Which isn’t that pretty.

  1. On two separate installs of Sublime 1.2.2 (with only poweruser added) I get the following problem when tabbing a new CSS document. Unless i press backspace after each tab the tabs naturally fan out. Bit annoying.

http://dl.getdropbox.com/u/497583/zen-tabs.png

  1. Most of the doctypes have xml:lang=“ru” in them. Perhaps it would be best to set this to english :smile:

Great plugin btw!

0 Likes
#27

Not sure what that means or where you set it :smile: But whatever the default for Sublime is I guess. I just type things like “pos:a” hit tab.

EDIT: It only seems to happen on new CSS properties added to new selectors though, if I add properties to an existing selector from an old document the tabbing works fine.

0 Likes
#28

Ok setting translateTabsToSpace true or false made no difference but removing PowerUser made it work.

0 Likes
#29

It works now. Thank you :smile:

0 Likes
#30

this is incredible.

but i’m having a hell of a time figuring out how to bring up the css selector. what is the key for that?

thanks.

0 Likes
#31

F1

0 Likes
#32

sorry, i guess i meant the “meta selector”. is there a hot key for that?

0 Likes
#33

Clean installation of Windows 7, Sublime 1.2.2 download and installed normally, I got the ZenCoding zip, extracted it, double-clicked it, got that package-installation-full-of-win message, ran Sublime and… nothing works at all. :frowning:

I mean, CTRL+ALT+ENTER, or F1, nothing happens, just the normal every-day sublime editor.

I want zen coding… :frowning:

0 Likes
#34

This may be a daft question, but is the file type (you can check in View -> Apply Syntax Highlighting) set to HTML or CSS?

I don’t know if it’s relevant, but I had an issue installing from the zip myself, in that the Packages\ZenCoding directory itself had nothing in it but another directory that contained all the package contents. Once I moved everything under that directory one level up the hierarchy (so I had some .py and .pyc etc. files in Packages\Zencoding) it fixed my issue. Sorry if that’s a bit unclear, it may be a red herring anyway.

0 Likes
#35

[quote=“protoplasm”]This may be a daft question, but is the file type (you can check in View -> Apply Syntax Highlighting) set to HTML or CSS?

I don’t know if it’s relevant, but I had an issue installing from the zip myself, in that the Packages\ZenCoding directory itself had nothing in it but another directory that contained all the package contents. Once I moved everything under that directory one level up the hierarchy (so I had some .py and .pyc etc. files in Packages\Zencoding) it fixed my issue. Sorry if that’s a bit unclear, it may be a red herring anyway.[/quote]

That’s it!!

Thank you very much, you made my day! xD

Just moved the content of zencoding/ (some .py’s like you said) one level up (the ZenCoding package root) and bingo! It works!

Best regards dudes, cya!

0 Likes
#36

The html 5 snippet is still in Russian.

Also At the moment C TAB outputs color:#000; and jumps you to the next line. I really like to enter a hex after the hash before going to the next line (as i’m sure most people would). Same with “bgc” and a few other commands.

0 Likes
#37

[quote=“haggen”]Clean installation of Windows 7, Sublime 1.2.2 download and installed normally, I got the ZenCoding zip, extracted it, double-clicked it, got that package-installation-full-of-win message, ran Sublime and… nothing works at all. :frowning:

I mean, CTRL+ALT+ENTER, or F1, nothing happens, just the normal every-day sublime editor.

I want zen coding… :frowning:[/quote]

There are some better examples/documentation you can copy from here: I’ve hotlinked the animations that explain it here too.

code.google.com/p/zen-coding/wik … enCodingEn

F1 will only work for CSS files.

Only works for HTML files (for me anyway).

**Make sure you are setting the DOCUMENT TYPE properly. Otherwise it will NOT work no matter what you do. **

  • In the very bottom right hand corner of the editor window. Where it says “Plain text | Windows” , change plain text to HTML. For CSS, change it to CSS).
  • Or you can just make a new file called “blah.html” with nothing in there, then type html:4t then hit TAB.
  • This will work the same with .CSS files too.
  • There’s a list of all the shortcuts and what they expand to on the google code site.

Don’t worry, you’re not the only confused person around here :smile: The documentation is a mess, but once you get your head around it, you’ll be sweet.

Hope this helps.

HTML - note the HTML in the bottom right hand corner.
http://blogdata.akalias.net/zencoding-nodeselect.gif

CSS - note the CSS in bottom right.
http://blogdata.akalias.net/zencoding-mnemonic.gif

0 Likes
#38

Thanks for the fixes. What key combo is the CSS selector?

0 Likes
#39

<binding key="ctrl+alt+enter" command="zenAsYouType css"> <context name="selector" value="source.css"/> </binding>

0 Likes
#40

i can get zen coding dialog to open up in my status bar via ctrl+alt+enter, it says “enter koan”, this works awesome.
but in this video below there is a dialog that opens up in the same place that says “css selector”, how do i open that up?

http://blogdata.akalias.net/zencoding-nodeselect.gif

thanks,
sean

0 Likes