tsukalogo0000


alt
phpサイトをローカル環境で再現する
phpで作成したサイトはdreamweverのブラウザでプレビューしても、phpで繋がっている所が出てこない。最悪面倒な事に本サーバーで見る事になってしまう。
自分の場合、もっぱらCMSのモジュールを使っちゃうので、phpで作る場合htmlに毛が生えた程度で訂正が一括で出来るという使い方しかしていないのだけど…但し、ちょっとした所にphpを付け足す事でCMSよりはあきらかに軽い。
ここではmacOSは10.6.8で、実践しています。いまさら解った事だが…最近のMacには標準で、Apacheが入っている。
それでは、PHPが動作する環境を構築していきます。Mac OS X Leopard にはPHPがプリインストールされています。Apacheの設定を変更するだけでPHPを利用できるようになります。


①Mac OS X Leopard にインストールされているApacheの設定

ファイルは、/private/etc/apache2/httpd.conf に格納されてます。
この設定ファイルを書き換えて、PHPが利用できるよう設定を変更します。

◎メニューバー>移動>フォルダの移動 にて
今回編集するファイルは上記ディレクトリの以下のファイルです。
/private/etc/apache2/httpd.conf
/private/etc/apache2/ を入力→ 主に、httpd.conf のファイルを書き換える

◎httpd.conf……napacheの基本設定についての記述
115行目あたり
#LoadModule php5_module libexec/apache2/libphp5.so
となっているところを、行頭の # を削除します。
LoadModule php5_module libexec/apache2/libphp5.so
に修正します。

◎また、補足として次の2行を追加。(必要ないかも・・・一応)
AddType application/x-httpd-php .php
AddType application/x-httpd-php-source .phps


◎以下のファイルについて
/private/etc/apache2/extra/httpd-vhost.conf
vhost-httpd.conf……バーチャルホストの設定をまとめて記述

以下の画像みたいにファイル修正後、httpd.conf を保存したら、apache再起動してください。
つまり以下の②のスイッチをONOFFにする。



②システム環境設定>共有>Web共有 をONにする。

この事で、Apacheの起動させる事が可能になります。

 



③その右横に出て来た、アドレスをブラウザで叩くと…
http://192.168.0.00/~ローカルユーザー名/2014サイト(仮)/index.php
phpで構築したサイトが見事に再現される。


MacのHD内>ユーザー>ユーザー名>サイト内に展開
そして、phpサイトがほぼ閲覧できるといった具合。



⑤プレビューの問題

ただ、本サーバーからローカルに戻すと階層や記述によってphpが繋がらない。
まずphpで繋がる先のファイルの冒頭はで定義しておかないと不具合が出る。
<?php $home = 'http://ドメイン名.com/';

はまると、<?php include '../php_temp/material_quality.php' ?>で../つなぎ間違うだけでアウトです。
ちなみに、予備知識ですが、index.phpとindex.htmlが同時にサーバーに存在する場合、htmlファイルを優先します。



ちなみに、macに搭載されているApacheのバージョンはなにか?
次のコマンドで調べられる。自分のは、apache2.2.21で結構あたらしいapacheである。
1
2
3
$ apachectl -v

Server version: Apache/2.2.22 (Unix)

php専用テスト画面

 

 
alt
ブラウザの表示文字を固定する(CSS設定)

alt文字をどのブラウザで見る場合でもある程度、決定できるのがこのCSSの設定です。 要はサイトページのソース内にCSSを参考にするという指示を振っておいて、サイトのサーバー上にCSSの設定を上げておき連携させるというワザです。私の経験上、 本文は9ポイントが一番見やすく8ポイントだと判別がつかない。又文字詰めに関してもsafariだと-0.15が最適だが、IE7.0のブラウザだと詰まり過ぎてこれまた不適当であったりする。 そしてタイトル(サブ)はやや詰めた方が、見栄えが良い。これは余談だが左右タッパに文字の改行を行う事がネット上では非常に難しい。 まず英語のスペルがあると、単語優先で改行されてしまう。日本語でも変な改行が頻繁に起こるので、HTMLソースで空白をデリートしたりする。 そもそもブラウザによって解釈が異なるのでバラバラにはなるのですが…。もしこのページ上でご質問があればドシドシ下さい。情報交換しましょう。
●参考/「ズバリ!!見てもらえるホームページの作り方」結構笑えます
上記のコードは、訪問者のブラウザがWindowsのIE以外だった場合に、XML宣言をするようになっています。ただし、XML宣言の不具合はInternet Explorer7.0bでは直っているそうなので、その場合の処理も書きました。
●参考/WindowsのIE以外だった場合のXML宣言
この前FirefoxがやっとIE6を市場シェアを抜けて一位になった記事がありました。(Firefox>IE6>IE7>IE8の感じかなトータルではもちろIE全体がまだトップ)IE6はもう早く下がってほしい
●参考/jQuery Browser Plugin も要検討

 
alt
ブラウザで開く時にサイズを固定する

このホームページprofileの様に ブラウザを新たに開いた時にムダな余白がなくなる様に、あらかじめサイズを指定してあげるワザです。 本来は2通りやり方があり、開かれるページのHTMLソースにサイズを書き込む方法と開かせるページHTMLソーズを書き込む方法があるのですが、手っ取り早い前者が好ましいと考え記載してます。※HTMLソースは通常コピー不可なんでテキストコピーで!

alt

<!-- サイズ固定 --> 
<body bgcolor="#003333"onLoad="window.resizeTo(270,630); 
"onResize="window.resizeTo(270,630);">

をHTMLソーズに打ち込みます。これで指定が完了です。 それと、すごい発見なんだが、safariには双方いづれか1000を超えるサイズを指定すると機能しなくなるという事が判明しました。しかも読み込む順番はcssを手前にしないとdreamweaverで作業する際形が崩れるというオマケ付き。(奧が深!)window.resizeToではなく、 window.resizeByを使い window.resizeBy(dx,dy);を使う方法も有るようだが…

alt
プレビューするとこの通りです。

 
alt
ページを開く時ツールバーをなくしてコンパクトに

こういう事ですが、基本的には新しい開らかれるページのソース記述は開く側に書き込みます。そこでサイズやバーの有無、 又は開かれている時間等設定できます。ちなみにサイズなんかは、開かれる側の記述設定に基づきます。

<SCRIPT language="JavaScript"><!--
function new_win1~(){
window.open("表示するサイト.htm","","width=横幅,height=高さ,
top=上からのサイズ,left=左端からのサイズ");
    }
    //-->
  </SCRIPT><A href="#" onclick="JavaScript:new_win1~();return
    false">クリックしてリンクする画像や文字</A>

●参考/http://www2s.biglobe.ne.jp/~suga/gijutu/siteisizu/newpage2.htm

 
alt
ファビコンの設定

  各種ブラウザに閲覧したらアドレスバーに出てくるアイキャッチです。
ゴルフのコーナーとPCバージョンの2つを設定しています。ファイヤーワークスの透過モードで作った40pt×40ptのgifをアップロードして各頁のヘッドタイトルの次に読み込む。

<link rel="icon" 
href="http://www.tsuka-time.com/ball1.gif"type="image/gif"/>
 
alt
前面の透過効果

背面に画像が引いてある場合、前面のパーツを半調にすれば少しお洒落になります。ボディ要素に以下のタグを挿入します。80と0.8の数値は透過レベルです。ちなみにIEでは透過出来るが、スクロールが固定されてしまったり支障が出るみたいです。

body {
filter:alpha(opacity=80); /*IE*/
-moz-opacity:0.80; /*FF*/
opacity:0.80;
}