divの終了タグ（閉じタグ）の前後にコメントを付け、id名／class名を書くことはよくあるかと思います。ただこれが意外と手間のかかる作業なので、何とかならないか？と思い、「Zen Coding for Dreamweaver v0.6」をカスタマイズしてみたところ、上手く動作するようになりました。

デフォルトのZen Codingでもdiv#main|cを展開するとコメントが入りますが、それだと要素の前後にコメントと改行が入ってしまうので、このカスタマイズの方が自分には効率的かなと思います。

カスタマイズ方法

ZenCoding/filters/html.jsの96～97行目（2011年12月25日現在の最新版、v.0.7.5の場合は123〜124行目）に手を加えます。本当は関数を定義するのがよい気がしますが、時間の都合もありとりあえず下記で。

カスタマイズ前

        } else {
            start = '<' + tag_name + attrs + '>';
            end = '</' + tag_name + '>';
        }

カスタマイズ後

        } else {
            if(tag_name.toLowerCase() == 'div') {
                var commentStr;
                var getAttrPattern = /(id|class)="(.*?)"/;
                var matchStrs = attrs.match(getAttrPattern);
                if(matchStrs) {
                    if(matchStrs[0].indexOf('id') > -1) {
                        commentStr = '#' + matchStrs[2];
                    } else {
                        commentStr = '.' + matchStrs[2].replace(' ', ".");
                    }
                    start = '<' + tag_name + attrs + '>';
                    end = '</' + tag_name + '><!-- /' + commentStr + ' -->';
                } else {
                    start = '<' + tag_name + attrs + '>';
                    end = '</' + tag_name + '>';
                }
            } else {
                start = '<' + tag_name + attrs + '>';
                end = '</' + tag_name + '>';
            }
        }

• ※ ご利用の際は自己責任にてお願いいたします。念のため...。