知っとっけ?ブログ 超初心者がWordPressをはじめてみた(2)~XAMPPのインストール(その1)~
FC2ブログ

超初心者がWordPressをはじめてみた(2)~XAMPPのインストール(その1)~

■関連記事
超初心者がWordPressをはじめてみた(1)~WordPressのインストール~(2012.01.31)
超初心者がWordPressをはじめてみた(2)~XAMPPのインストール(その1)~(2012.02.01)
超初心者がWordPressをはじめてみた(3)~XAMPPのインストール(その2)~(2012.02.02)
超初心者がWordPressをはじめてみた(4)~ローカルにWordPressをインストール~(2012.02.03)
超初心者がWordPressをはじめてみた(5)~WordPressをDreamweaverで編集~(2012.02.06)

WordPressをレンタルサーバにインストール。Googleなどのロボットに引っかからないように設定し色々と触ってみました。
頭ではその仕組みなどは理解しているつもりでも実際にソースを読んでみると何がどうなっているのか皆目見当がつきません。

元々WordPressは、本体ではなくサイトのデザインを決定づけるテーマ(テンプレート)をカスタマイズしていくものです。
テーマのファイルはWordPress本体のあるフォルダの「wp-content」⇒「themes」と辿っていったところに入っています。
下図の、「twentyeleven」「twenryten」はデフォルトで入っているテーマです。

xampp11.jpg

私はデフォルトで設定されている「twentyten」をフォルダごとコピーして、名前を「mytheme」なり適当な名前をつけて保存。そのテーマを管理画面で有効化して色々と触ってみました。

いちいちサーバーにアップロードするのが手間


「mytheme」の「header.php」なり「footer.php」なりを触ってみてそれが実際の画面でどのように反映されるのかをサーバーにアップロードして確認しました。
一般的なhtmlのサイトならDreamweaver CS5上ではデザイン画面、もっと詳細ならライブビュー画面で、ブラウザではF12ボタンを押せばすぐに確認できますが、この場合、Dreamweaver CS5では画面は呼び出せませんし、テキストエディタで加工を加えた後、サーバーにアップロードしてブラウザで確認するより方法がありませんでした。
正直かなりの手間ですし、時間がかかります。Webサイトを制作する際は、ちょっと変えてみてどうなるかといった結果を即座に確認したいものです。もし、うまくいかなければすぐに元に戻したい心理も働きます。
Facebookの創設者、マーク・ザッカーバーグ氏のような天才的な頭脳の持ち主なら自身の脳内でサイトを構築し、プログラム言語を借りて形にするに過ぎないのでしょうが、少なくとも私はそういうわけにはいきません。
また、検索には引っかからないようにはしているものの、外部のサーバーにファイルを浮かべている以上、他の人に作りかけのお恥ずかしいサイトを見られてしまう可能性もゼロではないわけです。


Adobe CS5 - in an infographic / pcsiteuk


ですので、ローカル環境にWebサーバを構築することにしました。つまり、自身のPCに外部のサーバーと同じ仕事をさせる環境を作ることにしたのです。
そうすれば、ファイルを少しいじっては実際にどうブラウザで反映されるのかを即座に確認できるます。ある程度、サイトができたら外部サーバにエクスポートすればいいのです。

Webに携わっている方なら普通にやっていることでしょうが、私にとっては初めての試みでした。

Windows環境ではXAMPPをインストールすれば、ローカル環境でのWeb開発ができるようになります。
XAMPPはウェブアプリケーションの実行に必要なフリーソフトウェアをパッケージとしてまとめたものでMySQLやPHPやPerlを含んだApache(Webサーバーのソフトウェアです)を(割と)簡単に インストールすることができます。

XAMPP for Windows Ver 1.7.7をインストール。でもその前に!


xampp12.jpg

XAMPPにアクセスすると上記の画面がでてきますので、赤で囲ったXAMPPをクリックしてデスクトップなど任意の箇所にダウンロードしましょう!

このままXAMPPをインストールすればローカル環境でのWeb開発ができると思いきや、私の場合はコントロールパネルからApacheを立ち上げても、下の画面が出てしまい、全く動きませんでした。
解決までに半日を要しましたので、インストールの前に手を打っておけばトラブルを未然に防ぐことができると思います。

xampp14.jpg

「ポート80がビジー状態って何ぞやぁぁぁ?」と思い調べた結果、ポート80は、ウェブサイト用に割り当てられているポート番号らしく、この番号を塞いでいるのは、

(1)Skype
(2)インターネットインフォメーションサービス(IIS)

であることが分かりました。
そこで、Skypeは念のため削除、IISは「コントロールパネル」⇒「プログラム」⇒「Windowsの機能の有効化または無効化」より下の画面の通りインターネットインフォメーションサービスのチェックを外してOKを押します。

xampp13.jpg

これで、ポート80に関する問題は解決されました。後はXAMPPをインストールします。

超初心者がWordPressをはじめてみた(2)~XAMPPのインストール~(その2)をご覧ください。(2/1up予定)


※ポート番号の意味については今さら訊けないインターネットのキホンとしくみ ポート番号をご参照ください。





-----------------------------------------------------------------

カラーコンサルタントRosa 公式サイト オープンしました。
こちらもどうぞよろしくお願いいたします。


よろしければクリックお願いします。励みになります。



ブログランキング・にほんブログ村へ
にほんブログ村
人気ブログランキングへ



関連記事
スポンサーサイト



コメントの投稿

非公開コメント

アクセスカウンター

プロフィール

すぎば~

Author:すぎば~
【知っとっけ?ブログ管理人】
東京都在住・現在40歳
詳しくはこちらをご覧ください。

カテゴリ
最新記事
バックナンバー

全ての記事を表示する

Facebook
Amazon.co.jp
楽天市場 Rakuten Ichiba
RSSリンクの表示
検索フォーム