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を買ったのですから。
一年前ですけど。
2011年11月18日 コメント&トラックバック(1) | トラックバックURL |
カテゴリ: オーサリングソフト
トラックバック&コメント
この記事のトラックバックURL:
コメント
コメントを投稿する
画像を一括アップロードできるFile Gallery »
« XAMPP内PHPフォルダ、php.iniをUTF-8に設定



webデザイナーを目指している者です^^
この記事は色々と勉強になりました(*´∀`*)
自分はロリポップを使用しているのですが・・・
ロリポップで借りたサーバーにアップしようとしたら
エラーになってしまいます(/ω\)
簡単インストールという機能もありますが・・・
自分で設定したいです。
なので
ローカルをちゃんとアップできる方法を教えていただけないでしょうか?