Home Download Buy Blog Forum Support

Commenting Your HTML Dynamically

Commenting Your HTML Dynamically

Postby bdpark on Fri Jun 07, 2013 6:46 pm

Hello Guys, I am here for seeking help regarding Emmet plugins. Writing comments going one after another closing tag is a matter of time. We can easily comment out ending classes and ids in our HTML document. Just type |c after defining class or id of divs. It'll comment out your classes and ids automatically according to your defines. Example: Type .container>.content>.main-article-content-preview+.sidebar|c and hit enter to see. You must have emmet installed in your ST.

Now my question to the developers, I want the comments to be shown in the same line tag closes. Generally it creates a line break before the comments. And also can you guys tell me where to edit the arguments? I want the comment text starts with "end of {my class or id name}".

Thanks in Advance
Anwar Hussain
bdpark
 
Posts: 4
Joined: Fri Jun 07, 2013 6:26 pm
Location: Sylhet, Bangladesh

Re: Commenting Your HTML Dynamically

Postby qgates on Fri Jun 07, 2013 10:49 pm

Emmet is a third party plugin and not a part of Sublime Text officially. Its github page is here.

A quick examination of Emmet's source reveals a fix that should give you what you want. In the file emmet-app.js, line 11998 (current version) we have:

Code: Select all
         '\n<!-- /<%= attr("id", "#") %><%= attr("class", ".") %> -->',


Replace the starting \n with a space to remove the linebreak, and you can modify the rest of the string to taste as well. You'll need to restart Sublime for changes to take effect.

Bear in mind that if you modify that file on your local installation, any update to Emmet via package control will overwrite the file and lose your changes. The solution is to add "Emmet" to the array "auto_upgrade_ignore" in package control user prefs:

Code: Select all
   "auto_upgrade_ignore":
   [
      ...
      "Emmet"
   ]


If these changes may be of use to you on another Sublime installation, or to other users, consider forking Emmet on github and committing your changes there. That way you'll never lose the changes, can keep track of them and share them with others.

qgates :)
qgates
 
Posts: 223
Joined: Mon Nov 05, 2012 4:33 pm

Re: Commenting Your HTML Dynamically

Postby bdpark on Sat Jun 08, 2013 5:33 am

qgates wrote:Emmet is a third party plugin and not a part of Sublime Text officially. Its github page is here.

A quick examination of Emmet's source reveals a fix that should give you what you want. In the file emmet-app.js, line 11998 (current version) we have:

Code: Select all
         '\n<!-- /<%= attr("id", "#") %><%= attr("class", ".") %> -->',


Replace the starting \n with a space to remove the linebreak, and you can modify the rest of the string to taste as well. You'll need to restart Sublime for changes to take effect.

Bear in mind that if you modify that file on your local installation, any update to Emmet via package control will overwrite the file and lose your changes. The solution is to add "Emmet" to the array "auto_upgrade_ignore" in package control user prefs:

Code: Select all
   "auto_upgrade_ignore":
   [
      ...
      "Emmet"
   ]


If these changes may be of use to you on another Sublime installation, or to other users, consider forking Emmet on github and committing your changes there. That way you'll never lose the changes, can keep track of them and share them with others.

qgates :)


Thank you :) This solved my issue.
bdpark
 
Posts: 4
Joined: Fri Jun 07, 2013 6:26 pm
Location: Sylhet, Bangladesh

Re: Commenting Your HTML Dynamically

Postby serge.che on Wed Jun 12, 2013 12:12 pm

You don’t need to touch Emmet code to redefine closing comment, you can simply use Extensions:
http://docs.emmet.io/customization/
http://docs.emmet.io/customization/preferences/
https://github.com/sergeche/emmet-subli ... ns-support

You can simply add
Code: Select all
"preferences": {
    "filter.commentAfter": "<!-- /<%= attr("id", "#") %><%= attr("class", ".") %> -->"
}

in your Emmet.sublime-settings and keep your Emmet plugin auto-updated as usual.
serge.che
 
Posts: 6
Joined: Fri Nov 09, 2012 9:57 am

Re: Commenting Your HTML Dynamically

Postby iamntz on Wed Jun 12, 2013 1:22 pm

@Serge.che: thanks for this. I was always pissed of about how default comments are added, therefore i never used them :D

Short correction about the setting:

Code: Select all
"filter.commentAfter" : "<!-- /<%= attr(\"id\", \"#\") %><%= attr(\"class\", \".\") %> -->"


(quotes should be escaped)
iamntz
 
Posts: 914
Joined: Fri Apr 29, 2011 8:52 am
Location: Romania


Return to General Discussion

Who is online

Users browsing this forum: Clams, danpyq and 15 guests