オーサリングソフトの記事一覧

Dreamweaverを使ってWordPressのテーマを簡単カスタマイズ!

WordPressテーマをカスタマイズする場合、通常は【編集→ブラウザで確認】というやり方で
すると思います。ここ最近テーマを編集することが多くなってきたので、作業効率を考えても現状
の方法がベストと思えなく、色々探していたらこちらに参考になる記事がありました。

Dreamweaver CS5とWordPressを連携させる方法 | デベロッパーセンター


偶然ですが、上記の記事内で私が過去に書いた記事が紹介されてました。

XAMPP上にWordPressを導入する方法

Adobe – Dreamweaverデベロッパーセンターで紹介していただけるなんてとっても光栄です。
ご紹介ありがとうございました。

早速ですが、この記事を参考にDreamweaverCS5を使ってWordPressと連携させてみました。









サイトの設定

サイトから→【新規サイト】を選択
サイト名は任意で大丈夫です。
ここでは例として、テストサイト1と仮名。



【ローカルサイトフォルダー】にはあなたがWordPressをインストールした
フォルダを指定します。

参考までに私の環境。

【私の使用環境 Xampp C:\xampp\htdocs\xampp\wordpress】




テストサーバーの設定


ローカルにて、サーバー環境を構築されたい方はXAMPP導入編をご覧になってください。

メニュー一覧から【サイト】→【サイトの管理】から先ほど作成したものを選び編集をクリック。

左側のカテゴリからサーバーを選択します。
すると、左下のほうに+の印があると思いますのでそちらをクリックします。

使用する接続の中から、【ローカル/ネットワーク】を選択します。
サーバー名はデフォルトで大丈夫。



サーバーフォルダーは、最初のサイト設定時にローカルフォルダーを指定したと思いますが、
それと同じ場所を指定します。

私の場合このような感じです。

【C:\xampp\htdocs\xampp\wordpress】

※テストサーバーの意味が分からない方へ

このページを見ているぐらいですから、独自ドメインを取得してレンタルサーバー
上でWebサイトを作ったことがある方がほとんどだと思いますが、要するにそのような
環境をローカル上にて実現することです。





以上が大まかな設定となります。


実際に動くか試す


※予め管理画面にて、編集したいテーマを有効にして
ください。


右下にてローカル上のフォルダの中身が見えていると思いますが、
この中のindex.phpをクリックします。



すると

【このページにはサーバーのみによって検索される動的関連ファイルがある可能性があります。】
とう文字があらわれますので、右横の検索をクリックします。



【デザインビューで表示できないサーバー処理ディレクティブがあります。】
 と表示されます。

その横のライブビューをクリックします。



これで設定は終了です。

では実際にテーマを編集してみたいと思います。

メニュー一覧から【表示】→【関連ファイル一覧】

template-loader.phpより下の部分が現在お使いのテーマファイル一覧です。

試しに、index.phpを編集してみます。

以下の部分に



    <?php bloginfo(‘name’) ?>
 (タイトルを出力するテンプレートタグ)

編集したらファイルを保存。
ちなみに保存には、Ctrl+Sのショートカット(ファイル保存)でも可能。

最後にデザインビューを更新します。
F5のショートカットを使用しても同じです。

このように反映されます。



上手に活用すればテーマ編集を効率的に行えそうです。

当分は慣れる意味でもこのやり方で行おうと思います。
せっかくDreamweaverCS5を買ったのですから。
一年前ですけど。







このエントリーをはてなブックマークに追加
はてなブックマーク - Dreamweaverを使ってWordPressのテーマを簡単カスタマイズ!
Share on Facebook
Bookmark this on Yahoo Bookmark
Bookmark this on FC2 Bookmark
Bookmark this on Livedoor Clip

DreamweaverCS5(ドリームウィーバー)でのコーディング便利すぎ

最近オーサリングソフトにはまっているtatuoです。

当サイトも今まで、エディターを用いながら今まで編集していたのですが、
面倒くさい部分が多々できてきて、ここはひとつWeb業界で標準と言われているDreamweaver
でも使ってみようということでCS5買いました。


別に古いバージョンでもよかったのですが、探すのが面倒くさかったので最新版にしました。
後で知ったけどバリデード機能がCS5にはないみたいね….

いやーしかし、デザインビューを使ってのテキスト貼り付けってこんなに便利なんですね。

今までショートカット駆使して作業してたのがあほみたい。

分からない人のために念のため説明すると、デザインビュー上に、テキストを貼り付けます。
このときにある程度改行した状態で。


すると、pタグbrタグが綺麗に配置されてるではないですか!

これって当たり前の機能なんだろうけど。やっぱ便利っす。

それと、テンプレート機能。これを使うために俺は生まれてきたって思わせるぐらい便利。
置換ソフト使ってる人は一度使用してみるといいかも。
というか、この機能使わないと本当に損。

Dreamweaverを購入するのは少々痛い出費だったけど、WordPressのテーマ作成において少しでも
楽な環境で制作したいという思いがあったから、今回は本当に安い買い物でした。

ちなみに、知識が曖昧なままでもサイト制作ができるけど、初心者はまずはエディタで基本をジックリ
学んだほうがいいかなって思った今日この頃。

ほんじゃーね!

このエントリーをはてなブックマークに追加
はてなブックマーク - DreamweaverCS5(ドリームウィーバー)でのコーディング便利すぎ
Share on Facebook
Bookmark this on Yahoo Bookmark
Bookmark this on FC2 Bookmark
Bookmark this on Livedoor Clip