フリーソフトDFはファイルやフォルダを比較して並列表示してくれます

Image [30]

「オリジナルテーマを作るための Bonesはスグに使えるレスポンシブテーマ!」でご紹介した、テーマbonesをちょこちょこいじって、オリジナルテーマを作ろうとしています。どこをどう変えたのかということを後でみたいと思うんですが、目確認するのはとても大変です。
そこで、ファイルやフォルダを比較して並列表示してくれるフリーソフト DF を使ってみました。

フリーソフトDFをダウンロードする

Image

DF (Vecter)

このページからDFをダウンロードします。

Image [1]

ダウンロードページへ をクリック

Image [2]

今すぐダウンロード をクリック

Image [3]

df141.lzh を任意の場所に保存します

Image [4]

保存した df141.lzh を解凍すると、df141というフォルダができます。おぼえやすいように Program Files など分かりやすい所にフォルダを移動しておくといいかと思います。

フォルダの内容を比較する

今回、bonesというテーマをコピーしてbones-whiteというテーマを作っています。元のbonesとbones-whiteがどのぐらい違ってきたかをフォルダごと比較したいと思います。

Image [6]

DF.exeをダブルクリックして起動します。

Image [7]

左上にある フォルダ比較 ボタンをクリック

Image [8]

1番目選択 というポップアップが開くのでローカルにある bones フォルダを指定して OK をクリック。

Image [9]

2番目選択 というポップアップが開くのでローカルにある bones-white フォルダを指定して OK をクリック。

Image [10]

このようにフォルダの中で相違があるファイルやフォルダが色つきで表示されました。右下には色の説明と、相違フォルダ(ファイルも含む)が何個あるのかが表示されています。

Image [11]

library はフォルダなのでこの中も見たいのでダブルクリックします。

Image [12]

このように css と images という2つのフォルダの中が相違していることが分かります。さらに css をダブルクリックします。

Image [13]

するとcssの中にある style.css というファイルが相違していることが分かりました。

ファイルの比較をしてみる

先ほどの style.css をダブルクリックすると

Image [14]

このようにファイルが開きます。

フォルダから指定しない場合のファイルの比較方法はこんな感じです。

Image [15]

ファイル比較 ボタンをクリックします。

Image [16]

1番目選択 画面が開くので bonesフォルダのheader.php を指定して、 開く をクリック

Image [17]

2番目選択 画面が開くので bones-whiteフォルダのheader.php を指定して、 開く をクリックします。そうすると、

Image [18]

左右にそれぞれの header.php が開きます。赤で囲った部分に色が付いていて、このあたりが相違しているということが分かります。

Image [19]

このあたりをクリックすると

Image [20]

その行に移動します。内容が違う行だけに色が付いているのでとても分かりやすいです(^^)/

このあたりは実際には、bonesで、

Image [21]

こういう感じだったところを、bones-white

Image [22]

このように色を変えたり、ロゴ画像を入れたりしている部分です(^^)。

に並べるだけで無く、上下に並べることもできます。

Image [23]

オプション>設定 をクリック

Image [24]

ウィンドウ タブをクリック

Image [25]

ファイル比較画面を上下2分割で表示 にチェックを入れて、

Image [26]

OK をクリック。

Image [27]

この設定をしてから再度、比較ファイルを開き直すとこのように上下に表示されました。

Image [28]

相違部分のテキストも横に長くなった分、見やすくなりました。

まとめ:何かを元にして変更するときは元を取っておくといいかなと思います

GITとかを使っていれば別ですが、そうでないときに何かを元に自分なりの変更を加えていくときはファイルならファイルを、フォルダならフォルダをまるごと変更せずに取っておくといいと思います。変更するファイルやフォルダはそれをコピーして別の場所や名前にして変更していきます。

そうすれば変更中うまくいかなかったりとっても変になっちゃったときにこのDFを使って比較すればどこが違っていてどうなったのかがわかり、元のソースにちょっと戻したいときも部分的に戻したりできるので便利だと思います(^^)/

兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/
無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
スポンサー広告
トップへ戻る