Sublime text 2 - change tags color

Question

I am using Sublime Text 2 - which i want to make it my default program for work.

I have install the Dreamweaver Theme - but i have some issues:

I dont know how to change the colors for tags (a, img, form, etc). There are all in the same color, not like in Dreamweaver CS4 (see pic).

How can i change colors for each?

I have this in my theme code:

<dict>
      <key>name</key>
      <string>html img tag</string>
      <key>scope</key>
      <string>text.html meta.tag.img - string</string>
      <key>settings</key>
      <dict>
        <key>foreground</key>
        <string>#6d232eff</string>
      </dict>
    </dict>
    <dict>
      <key>name</key>
      <string>html form tag</string>
      <key>scope</key>
      <string>text.html meta.tag.form - string</string>
      <key>settings</key>
      <dict>
        <key>foreground</key>
        <string>#ff9700ff</string>
      </dict>
    </dict>

But when i change the colors in the string tag, not working - is there something missing?

Thx in advance

Answer 1

It comes down to the language definition (.tmLanguage) file. By default the HTML language definition cuts off at the general tag level, don't ask me why, but it follows TextMate's Scope Selector pattern. From what I can tell is people write the language file using JSON, and then convert it to a .plist file, and change the extension to a tmLanguage file.

The easiest thing I found was to install Siddley's Enhanced HTML/ColdFusion package, use the enhanced HTML language, and one of the DW color schemes.

After some looking, I found that Siddley clumped some tags together. I may be extending the language definition file. Will post on github if I do.

Answer 2

Try this:

    <dict>
        <key>name</key>
        <string>Tag name</string>
        <key>scope</key>
        <string>entity.name.tag</string>
        <key>settings</key>
        <dict>
            <key>foreground</key>
            <string>#EA0000</string>
        </dict>
    </dict>
    <dict>
        <key>name</key>
        <string>Tag start/end</string>
        <key>scope</key>
        <string>punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end</string>
        <key>settings</key>
        <dict>
            <key>foreground</key>
            <string>#EA0000</string>
        </dict>
    </dict>

Answer 3

Follow this step to apply colour scheme of Dreamweaver cs5 in your sublime.

Click here to download Dreamweaver Theme Zip File

How to apply colour scheme like Dreamweaver CS5

1. Download zip file from Dreamweaver Theme File Link
2. Extract folder
3. Open sublime and goto "Preferences">"Browser Packages..">"Paste extract folder here"
4. Restart Sublime
5. Select color scheme from sublime, to select color scheme Goto "Preferences">"Color Scheme">"SublimeDreamweaver-master">"SublimeDreamweaver-master">"Dreamviwer"
6. Restart Again your sublime
7. Now open your file to see effect
8. Thanks

Change Font like dreamviwer after apply color scheme of dreamviwer.

1. Goto "Preferences">"Setting - User"
2. Add this line is your setting json, "font_face":"courier new"
3. Save enjoy

Thanks