効率的に作るコーディングとは?

2008年7月14日(月)
藤田 洋正

スニペットの作り方

 スニペットとは、よく使われるコードをあらかじめ登録をすることができ、簡単にコードに挿入できる機能です。HTMLでもCSSでもJavaScriptでも登録可能です。metaタグのスクリプトタイプの記述を登録したり、よく使用するパーツのHTMLを登録したり、コピー&ペーストが面倒な時に使用しても良いでしょう。この機能を使用すれば、毎回コードを記述する手間も軽減されます。

 次の手順でスニペットの作成を行います。

 はじめに、スニペットに登録したい個所(コード)を選択します。

 次に、「スニペットパネル」の下部の「新規スニペット」のアイコンをクリックするか、右クリック(Windows)またはControlキーを押しながらクリックし(Macintosh)、表示されるメニューの[新規スニペットの作成]を選択します。

 さらに、「スニペット」という名称のウインドーが表示されますので、名前や説明などを入力し、「OK」をクリックするとスニペットの登録が完了です。

 作成したスニペットは「スニペットパネル」から削除・編集が可能です。スニペットをコードに挿入する時は、スニペットを挿入する位置に挿入ポイントを置き、「スニペットパネル」で挿入したいスニペットをダブルクリックします。

 作成されたスニペットは、各コンピューターのDreamweaverの「Configuration」フォルダに保存されます。筆者の場合、Windows XPでDreamweaver 8を使用していますので、下記のフォルダに保存されています。

Cドライブ:\Documents and Settings\ユーザー名\Application Data\Macromedia\Dreamweaver 8\Configuration\Snippets

 また、スニペットはチームでの共有が可能なので、Snippetsフォルダに共有したいスニペットファイル一式をコピーすることによって共有が可能になります。

ライブラリの作り方

 ライブラリとは、サイト内で共通するパーツを保存し、再利用できる機能です。ヘッダーやフッター、ナビゲーションなどに使用すると便利です。ヘッダーや、フッターなどのサイト内で共通するパーツを管理する際、筆者はSSIを使用することが多いのですが、案件によってはSSIの使用ができない場合もありますので、そういった時にライブラリ機能を使用しています。

 ライブラリはサイトのローカルルートフォルダの「Library」フォルダに「.lbi」という拡張子で保存されます。ライブラリの作成は次の手順で行います。

 はじめに、ライブラリに登録したい個所(コード)を選択します。

 次に、「アセットパネル」の左側のアイコンの「ライブラリ」のアイコンをクリックします。

 さらに、パネルの下部の「新規ライブラリ項目」のアイコンをクリックします。

 作成したライブラリは「アセットパネル」から削除・編集が可能です。また、ライブラリをコードに挿入する時は、ライブラリを挿入する位置に挿入ポイントを置き、「アセットパネル」で挿入したいライブラリ選択し、パネルの左側にある「挿入」ボタンをクリックします。

株式会社クリエイティブホープ
マークアップエンジニア。埼玉県出身、測量会社で測量士として従事するが、Webサイト制作に興味を持ち、株式会社クリエイティブホープに入社。昼夜を問わずHTML、CSS、ブラウザとの格闘に明け暮れている。マークアップ野郎!!:http://blog.creativehope.co.jp/markup/http://www.creativehope.co.jp/

Think ITメルマガ会員登録受付中

Think ITでは、技術情報が詰まったメールマガジン「Think IT Weekly」の配信サービスを提供しています。メルマガ会員登録を済ませれば、メルマガだけでなく、さまざまな限定特典を入手できるようになります。

Think ITメルマガ会員のサービス内容を見る

他にもこの記事が読まれています