これからSassを始めたい人へ！導入手順をまとめてみた(Dreamweaver対応) | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。LIGフィリピン支社代表のせいとです。 全く関係ない話ですが、ポケットモンスター X・Yが発売されたそうですね。「金・銀、ブラック・ホワイトときたら、次はパステルカラー辺りが来るはずや！間違いない！」と思っていた僕の予想はまんまと外れました。まあそれはいいとして、 今回はSassについてちょっと語らせていただきます。Sassというと、「効率、コーディングスピードが超上がるらしい」とか、「LINE株式会社、株式会社DeNAとかも採用してるらしい」という話を聞きます。僕もSassについては勉強しているんですが、当初はわかりにくい部分もありました。 それは「そもそもSassが何なのかよくわからない。プログラミング言語？？」ってことと、「インストールが上手くいかない！コマンドプロンプト使い方わからない！Dreamweaver（以下DW）動かない！GUIソフトってなに！？」ってことです。
Wordpressのコードヒントが出るDreamweaverの拡張機能 « きんくまデザイン｜デザインを生かしたプログラミング
11/10/22更新 CS5.5だとうまくいかないとのコメントがあり、調べてみました。 取り急ぎ、動くように修正しました。 WordPressCodeHints.xml 解凍したファイルを下記のパスになるようにいれてください。 Winの人は似たパスのところにおけば動くと思います。 /Applications/Adobe Dreamweaver CS5.5/Configuration/CodeHints/WordPressCodeHints.xml ※注意 何年か前に作ったものなので、コードヒント自体が古いものになっています。 下記のページから、関数をひろってきて、上のxmlデータを上書きすれば最新のものになります。 http://codex.wordpress.org/Function_Reference Perl,Ruby,Pythonなどがあやつれれば、上のリンクから必要な部分を拾って
テンプレート編集を楽にしてくれるWordPress用Dreamweaverエクステンション。TAGStention の紹介と導入方法。 | うつしよ
テンプレートの編集を楽にしてくれるテンプレートタグ入力支援「TAGStenstion」 を入れてみた。 ダウンロードはこちらのサイトから↓ 導入方法は ダウンロードしたファイル(mxp)を解凍し、Macromedia アプリケーションフォルダ内にある Extentions フォルダに保存する。 Program Files→Macromedia→Extention Manager→Configuration→Extentions(←自分のはこんな感じだった) Dreamweaver を起動し、ヘルプ→拡張機能の管理(Extention Manager)→ファイル→拡張機能のインストールを選択。 Dreamweaver を再起動。 インストールすると、このようなツールバーが現れる。 クリックすると 使いたいタグを選択し、ワンクリックでテンプレートに挿入してくれる。 チートシートからWordPr
Sass、Compass な僕の Dreamweaver スニペット
CSS Preprocessor Advent Calendar 2012の11日目。 エディターは何をお使いでしょうか？ CSS Preprocessor を利用しているイケてる皆さんは Sublime Text 2 や、Coda 2、Vim などを利用しているかと思います。 僕は CSS Preprocessor は利用しているのですがそれほどイケてませんので、エディターは未だに Dreamweaver 一本です。 というわけで、ドリで Sass や Compass を使う方向けに。 ドリに .scss ファイルなんかを認識させる 以下のまーしーさんの記事を読むとよいでしょう。僕もこれを読んで設定しました。 ※ちなみ Sass のインストールなんかは Codekit にまかせています。その辺は明日西畑さんが書くと思います。 SassとDreamweaverのコードヒントでCSSをさらに
入れると便利なDreamweaver拡張機能/Dreamweaver - サイブリッジラボ
こんにちは！Roadyです。 今日から仕事初め！という方も多いと思います。 お正月ボケ冷めやらぬ今日この頃ですが、記事を見て頂いて頭のスイッチもOnにして頂ければと思います。 今日は、自分がいつもお世話になっているDreamweaverの拡張機能について紹介させていただきます！ 自分のDreamweaverにはどんな拡張機能が入ってるの？という方は、 「コマンド→拡張機能の管理」で確認することができます。 zen-coding もうこの子無しではコーディングできない！って言うほどお世話になっています。 自分の場合はdreamweaverのショートカットと組み合わせながら活用しています。 詳しい使い方等はこちらでは割愛させて頂きますが、使っていない方は是非活用してみてください。 参考 Zen Coding cheat sheet 閉じタグコメントを挿入 こちらもいつもお世話になっています。
Dreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能5つ | バシャログ。
チーム内のももクロ旋風が留まるところを知りません。 まだメンバーの顔と名前覚えきってないんだけどそんなこと言えないhakoishiです。がんばります。 さて、本日はDreamweaverの使い勝手をちょこっとだけ底上げしてくれる拡張機能を5つほどご紹介します。 Zen Coding これはもう、いわずもがなですね。コーディング効率大幅アップ。 下記よりDreamweaver用のファイルを選択してDLしてください。 Downloads - zen-coding 閉じタグコメントを挿入 「コマンド」メニュー⇒「閉じタグコメントを挿入」で閉じタグコメントを自動で挿入してくれます。 ID・classも自動的に拾ってくれるので、構造のチェックにも便利。 コメントを生成して挿入するDreamweaver用の拡張機能を作成しました Dreamweaver CS5 Validator 「結果」パネル⇒「バ
作業効率化！Dreamweaverのオススメ拡張機能まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーのハルエです。 Dreamweaverの数ある機能を十分に活用できてる方ってどのくらいいるのでしょうか？ 私の場合、これまで最低限の機能しか使ってこず、操作上でわずらわしく感じることでも我慢してたんです。で、そのわずらわしさも苦痛に感じなくなってきて、いつの間にか慣れちゃってました。いけない子ですね。 そこで今日は以前の私みたいな方のために、作業効率を良くするDreamweaverの便利な拡張機能やおすすめ設定術を紹介させていただきます。 閉じタグコメントを自動挿入：End_comment.mxp 閉じタグコメントはソースの構造をチェックしたりする時に便利なんですが、その都度書いていくのって手間ですよね。 この拡張機能は閉じタグコメントを自動で挿入してくれます。もちろんIDとclassもちゃんと認識してくれます。 コメントを生成して挿入するDreamweaver用の拡
コーディングが楽になるDreamweaver拡張機能
コーディングが楽になるDreamweaver拡張機能 2012.05.15 アプリケーション 制作 CodingDreamweaverTips 0 ウェブサイト制作に欠かすことのできないHTMLエディタやオーサリングツール。いろんなソフトがありますが、現場で最も使われているのはAdobeのDreamweaverではないでしょうか。 HTMLの知識は勿論のこと、Dreamweaver独自の機能を使いこなせるかどうかが効率化のポイントだと思います。テンプレートを始めとした機能を把握することで、より効率的なコーディングが出来るようになるでしょう！ しかしAdobeは値段の割になかなか新しい機能が追加されません。 「あと少し」が足りないAdobe製品…ですが有志によって制作された拡張機能を追加することでDreamweaverがより便利になってくれます！ 今回は僕がいつもお世話になっている拡張機能を
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
DreamweaverでSubversion | studio-fun.net
前回「WEB製作の現場でもバージョン管理を！」の続きです。 僕の経験上WEB製作現場では「Dreamweaver」が無いとやっぱり不便です。 最近EclipseベースのAptanaというIDEがあります（今度紹介しようと思ってます）。 コレであればSubversionと連携できるんです。 個人的にはコレ（Aptana）が将来的にWEBデザイナーとかも使える最強のIDEになって欲しいと考えてますが、現段階ではDreamweaverがやっぱり良いです。 で、本題です。 バージョン管理システム（Subversion+TortoiseSVN）を使うと凄く作業効率がいいのですが、DreamweaverはSubversion+TortoiseSVNと連携していないのでDreamweaver作業が終わったらエクスプローラから「コミット」とかを実行する訳ですが コレが結構面倒くさい！Eclipse
Web Design and Web Development : Dreamweaverで高速かつ快適な作業のために、やっておきたい5つのこと | mnemoniqs’log.
仕事で使ってるDreamweaver環境設定や、効率を上げる方法を下記にまとめておきます。 目次 サイトの定義と管理を必ずやる ソースコードを見やすくカスタマイズ 便利なショートカットキーをつかう CSSコードヒントのカスタマイズ スニペットを追加してみる サイトの定義と管理を必ずやる 作業用のフォルダを決めて、まずサイトの定義をすることからDreamweaverのコーディングは始まります。 コレをしないで進めると、階層の全体像や相対パスがぼんやりしたままになり、とても危険。 超簡単な作業なので、やらない手はありません。 ローカルにあるフォルダを定義 [サイト] → [新規サイト] → [ローカル情報] 「サイト名」にプロジェクト名、「ローカルルートフォルダ」に作業用フォルダのパスを指定するだけでサイト定義は完了です。 設定したサイトは、[サイト] → [サイトの管理]の一覧から選択
Dreamweaverの便利なコマンドや拡張機能のまとめ
コーディングをするときに自分が主に使ってるのがDreamweaverです。そのままでもいろいろ機能があって便利ですが、コマンドや拡張機能を入れることによってさらに便利に使うことができます。 そこでDreamweaverのコマンドや拡張機能で見つけたものをまとめてみました。他にもこんな便利なものがあるよなど教えてもらえるとうれしいです。 使い方は、コマンドの場合はファイルをダウンロードしてきて以下に入れます。環境によって違う場所にあるかもしれません。 Windows → C:\Program Files\Adobe\Dreamweaver CS5.5\ja_JP\Configuration\Commands Mac → ライブラリ\Application Support\Adobe\DreamweaverCS5\ja_jp\Configuration\Commands 拡張機能はダウンロード
Dreamweaverの拡張機能まとめ
Dreamweaver用の拡張機能をまとめました。 便利なものばかりなので、ぜひお役立てください。 タグ挿入・文字列変換 コメントを生成して挿入するDreamweaver用拡張機能 <!– /#container –>などのコメントを簡単に挿入できます。 IDやClass名は自動で取得してくれます。 Adobe – Dreamweaver Productivity : Close Tags 閉じていないタグを閉じてくれます。 Adobe – : Adobe Dreamweaver 10周年セミナー：全角・半角変換拡張機能 全角の数字やカナを半角に直したり、その逆もできます。 携帯サイト作成にも便利ですね。 Zen-Coding DreamweaverでZen-codingが使えるようになります。 （CS3の方は、Zen Coding for Dreamweaver v0.5を選ぶといいかも
[Dreamweaver] テンプレートパラメータのサンプルと解説
以前TwitterでDreamweaverってどうよ？メモ帳でよくね？的なRTが回ったとき、 私が便利機能として挙げたのはサイト内全文検索と正規表現置換だったのだけど、もうひとつ、 140文字じゃ到底説明しきれないテンプレートパラメータについて熱く語ってみようと思う。 Dreamweaverのイメージといったらコードの自動補完の次にテンプレート機能っていう感じだから ソフト使ったことがある人なら１００％に近い確率でdwtファイルを作成したり修正したりしたことがあるはずだ。 しかしテンプレートパラメータについては意外と知らない人の方が多い。 メニューを良く見ると「修正」の「ページプロパティ」の下にテンプレートプロパティっていうのがあったりするんだけども、 正規表現に似てプログラミングっぽいからとっつきにくいのかな。 TemplateParamコメントタグ テンプレートプロパティはテンプレート
![[Dreamweaver] テンプレートパラメータのサンプルと解説](https://cdn-ak-scissors.b.st-hatena.com/image/square/0f4e8861cd8451cdad08dadad5636ba1a726eb0f/height=288;version=1;width=512/http%3A%2F%2Ftenderfeel.xsrv.jp%2Fwtn%2Fwp-content%2Fuploads%2F2010%2F10%2Fdwt.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【Sublime Text 2】改行タグ<br>をDreamweaverでのショートカットと同じようにキーバインドを設定する | バシャログ。
【Photoshop入門】Webデザインをはじめよう！第1回 デザイン前に覚えておきたい環境設定とレイヤー機能 - Adobe Blog
https://help.adobe.com/archive/en/dreamweaver/cs6/dreamweaver_reference.pdf
Adobe - Adobe - Fireworks Exchange
ソフトウェアの使い方から生活全般ノウハウまで 日本一のHow to 動画ポータル
http://check.pensees.co.jp/maeda/dwt/