制作wordpressTweetPocketWeb制作者なら誰もが思うことそれは、ファイルを保存していちいちページ更新して確認するのは意外とめんどくさい。微妙に時間がかかる・・・ではないでしょうか?Dreamweaverとwordpressを連携させるとワンクリックで表示を確認することが出来ます。7ヶ月前、設定方法をライトニングトークでお話しさせて頂きました。当時はWordpressのこともphpが環境構築しないとローカルで動かないこともDreamweaverのこともろくに知らない状態で、知らないづくしで発表したので作成したスライドは何が言いたいのか分からないものになってしまっています。今回、設定部分に焦点を当てて簡単にまとめてみます。★使用環境:Windows・Dreamweaver5.5<目次>1.XAMPPインストール2.WordPressインストール3.Dreamweaverの設定4.Dreamweaverでサイトを見る5.XAMPPの陥りやすいエラー6.便利なDreamweaverの機能・一部1.XAMPPインストール初心者でも簡単に導入できるインストーラ版をインストールします。・Apacheをサービスとしてインストール・MySQlをサービスとしてインストールにチェックを入れます。うまく動けば、Apach、MySQlの横にRunningと表示されます。表示されない場合は「Startボタン」を押して下さい。(下の画像、ちょっとおかしい気がしますが気にしません。)そしたら、ブラウザで以下のサイトにアクセスします。http://localhost/「おめでとう」と歓迎されます。左下のツール>phpMyAdminをクリックし、データベースを作成します。任意の単語を入れて作成。2.WordPressをインストール公式サイトへアクセスして、日本語版のWordPressをダウンロードします。http://ja.wordpress.org/落としてきたwordpressフォルダを解凍し、そのフォルダをXamppのhtdocsフォルダの中へ移動させます。http://localhost/wordpress/にアクセスすると「ファイルが見つかりません」と表示されます。「設定ファイルを作成」をクリックします。データベース接続のさいに注意することユーザー名はrootパスワードは空(カラ)データベース名や接頭辞は好きなものにし「作成する」をクリックします。ようこそというWPの画面が出てくるのでアカウントなど必要情報を入力しインストールします。選択し、サイトの定義を行います。サイト名は任意のものでローカルフォルダーはWPをインストールしたディレクトリーを入力します。次に、新規サーバーの追加を行います。左側のサーバーをクリックし、+ボタン(新規サーバーの追加)を押します。Url:http://localhost/wordpress保存します。index.phpファイルはwp-includesの下にありますが、その中にはありません。場所はwordpress直下です。「依存ファイルを取得しますか?」に「はい」を選択します。「このページにはサーバーのみによって検索される動的関連ファイルがある可能性があります。→「検索」をクリックします。「このページにはデザインビューで表示できないサーバ処理ディレクティブがあります。ライブビュー」とありますので、ライブビューをクリックします。こんな感じに表示されます。5.XAMPPの陥りやすいエラーXAMPPをインストールする時、ウィルス対策ソフトが起動していると反応して進まないことがあるので切っておくことをお勧めしますまた、Apacheはポート80を使用していて他のソフトがこの80番を使用しているとApacheが起動しません。一般的なものとしてSkypeが挙げられます。調べる方法として、コマンドを起動します。(ファイル検索で「cmd」と入力すると出てきます。-ano」netstat(半角のスペース)-anoと入力すると色々と出てきます。Address「0.0.0.0:80」があれば80番が使われていることになります。使われていれば何のアプリケーションかチェックしタスクマネージャー(ctrl+Alt+Delete)から消します。関連ファイル開いているページに関連づいているファイルを一覧で見ることが出来、ワンクリックでソースを開き編集ことが出来ます。上の「ソースコード」で最初のソースに戻ります。(「footer.php」や「sidemenu.php」などテーマ作成に必要なファイルを簡単に呼び出せて非常に便利です。マルチスクリーンプレビューここでサイズを指定して、各デバイスでの表示を確認することができます。ライブビューWebKitを利用したブラウザにより近いプレビューで確認できます。javascriptも動きますし逆に停めることも出来ます。BrowserLabはクロスブラウザチェックのできるサービスです。Dreamweaverからローカルファイルを確認することができます。BrowserLabで表示されます。まとめ直してみましたが、あまり思い出せませんでした。7ヶ月も前によく分かっていない状態で準備したものだし・・・(思い出せなかったのと画像が足りなかったので違うPCで設定し直してみたことは内緒です。)スライドを見て知識の浅さを感じ、よくやろうと思ったなと過去の自分に驚きました。この感覚はどれだけ月日が流れても変わらないと思います。過去を振り返り、「なんで私無謀にもこんなことに挑戦したんだろう」って何度も思うと思うんです。2012」行ってきました。Articletwitterのウィジェットデザインをカスタマイズしてみたウィジェットのデザインをcssなどで変更したのでその備忘録にMORE初心者のための初心者によるGit紹介ーおすすめなサイトなどーどうも。ハロウィンが終わりましたね。meまり絵1986年生まれ。Web制作会社を経て、2015年からフリーランスで働いています。Webデザイナー/マークアップエンジニア好きなものは、トラベラーズノート・着物・バレエ。