2015年03月03日 web関連

dreamweaver CS6では、scss,sassなどが使えません。使えないというか、コードヒントやコードカラーリングが適用されず、テキスト扱いと同様になってしまいます。

検索すれば、多くのサイトで説明されていますが、以下の作業をすればコードヒントが使えるようになります。

scssを追加する手順

  • 1.DWの環境設定>ファイルタイプ/エディター内の「コードビューで開く」の箇所に「.scss」を追加します。(sassも使いたい場合は.sassも追加)
  • 2. アプリケーション ▸ Adobe Dreamweaver CS6 ▸ Configuration 内の「Extensions.txt」アプリケーション ▸ Adobe Dreamweaver CS6 ▸ Configuration ▸ DocumentTypes内の「MMDocumentTypes.xml」を編集

Extensions.txt

下のコード内の【】の箇所を追加。(分かりやすいように【】をつけていますが実際は不要です。)
HTM,HTML,SHTM,SHTML,HTA,HTC,XHTML,STM,SSI,JS,JSON,
AS,ASC,ASR,XML,XSL,XSD,DTD,XSLT,RSS,RDF,LBI,DWT,ASP,ASA,ASPX,ASCX,ASMX,CONFIG,CS,
CSS,【SCSS】,CFM,CFML,CFC,TLD,TXT,PHP,PHP3,PHP4,PHP5,PHP-DIST,PHTML,JSP,WML,TPL,LASSO,JSF,VB,VBS,VTM,VTML,INC,SQL,JAVA,EDML,MASTER,INFO,INSTALL,THEME,CONFIG,MODULE,PROFILE,ENGINE,SVG:All Documents
HTM,HTML,HTA,HTC,XHTML:HTML Documents
SHTM,SHTML,STM,SSI,INC:Server-Side Includes
JS,JSON:JavaScript Documents
XML,DTD,XSD,XSL,XSLT,RSS,RDF:XML Files
LBI:Library Files
DWT:Template Files
CSS,【SCSS】:Style Sheets
・・・

MMDocumentTypes.xml

下のコード内の【】の箇所を追加。(分かりやすいように【】をつけていますが実際は不要です。)
<documenttype id="CSS" internaltype="Text" winfileextension="css,【scss】" macfileextension="css,【scss】" file="Default.css" writebyteordermark="false" mimetype="text/css" >
上記の作業でDWを再起動してみてもコードヒントが動かない場合は、「Application Support/Adobe/Dreamweaver CS6/ja_JP/Configuration」内のMMDocumentTypes.xml、Extensions.txtをチェックしてみてください。

Macの場合は「control + スペース」でSpotlight検索を起動し、「Extensions.txt」、「MMDocumentTypes.xml」で検索してみると簡単に探せます。

ここまで、完了すれば、コードヒント、コードカラーリング、ファイルのアイコンまで、全て対応出来ます。

注意点

これは私もはまった落とし穴なんですが、DWの体験版をインストールしたことある方は、ライブラリ内を変更しないとコードヒント等が動きません

ライブラリ内を変更するには、「optionボタン」を押しながら、Finderメニューの移動を開きます。 そうすれば、隠しメニューの「ライブラリ」が表示されます。

Library/Application Support/Adobe/Dreamweaver CS6/ja_JP/Configuration/にもMMDocumentTypes.xml、Extensions.txtのファイルがあると思うので、これを同様に編集してください。

この投稿へのコメント

コメントはまだありません。

コメントを残す

メールアドレスが公開されることはありません。

次のHTML タグと属性が使えます。
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CAPTCHA


ピックアップ記事

HTML上に配置した画像に隙間が出来るときの対処法

2012年02月10日 web関連
配置した画像に余計な隙間(スペース)が出来る HTML上に画像を配置したときに、予期せぬスペースが出来るときってありませんか?(画像参照)単純に配置しただけなのに・・・と思うのですが、そんな時はCSSを以下のように設定することで解決できます。 解決策 CSSファイルに以下の設定を記述する。 [php]img { vertical-align: top; }[/php] …
「HTML上に配置した画像に隙間が出来るときの対処法」をはてなブックマークに追加

レスポンシブ対応 画像メニューをテキスト表示に切り替える

2014年11月15日 web関連HTML5・CSS3
レスポンシブなサイトを作るときに、大きな画面では画像メニュー、スマホなどのサイズでは、テキストメニューにして、メニューボタンに格納したい場合など、画像メニューからテキストメニューにCSSで表示切り替えする方法。 cssの:before attr属性で解決 html [php]<ul id="nav"> <li><a data-tex…
「レスポンシブ対応 画像メニューをテキスト表示に切り替える」をはてなブックマークに追加

twitter API からプロフィール画像を取得・表示

2011年07月28日 web関連twitter API
twitter API からプロフィール画像を取得・表示する方法です。 リクエストURL [php]http://api.twitter.com/1/users/profile_image?screen_name=apr_20&size=bigger[/php] 画像として表示 [php]<img src="http://api.twitter.com/1/users/…
「twitter API からプロフィール画像を取得・表示」をはてなブックマークに追加

fontawesomeでアイコンを反転させる方法

2022年11月12日 web関連
反転させたいアイコンに以下のクラスを追加する。 水平反転 [php]fa-flip-horizontal[/php] 垂直反転 [php]fa-flip-vertical[/php]
「fontawesomeでアイコンを反転させる方法」をはてなブックマークに追加

WordPressのテーマをウィジェットに対応させる

2013年10月06日 web関連WordPressphp
WordPressのテーマをウィジェットに対応させる
Wordpressで自作のテーマを作った場合などは、自分でウィジェットを利用可能にしない限り、ウィジェットは利用出来ません。このサイトのテーマは自作なのですが、今までウィジェットは使う機会がなかったので、未対応のままになっていました(:_;) 今回は、サイドにWordPress Popular Postsプラグインの人気記事一覧を表示させたかったので、調べてみましたよっ!ってことで、ウィジェ…
「WordPressのテーマをウィジェットに対応させる」をはてなブックマークに追加
© graffiti on the web . All rights reserved. WordPress Theme by comfy