TODOS・何でも情報交換TOPから是非ご覧ください。
一番下の投稿フォームへ > スレッド一覧 > 記事閲覧
メニューをどのページにも表示する方法(SSI・phpの活用)
日時: 2010/01/20 23:49
名前: りり

Gyao動画再生問題 のところで、juneさんとフレームを使わず、メニューをどのページにも表示する方法など話題になりました。
http://todos.xsrv.jp/2patioit/todos.cgi?mode=&no=28&p=2

さすが、juneさん、いろいろとトライくださいましたので、埋もれないようにこちらにスレッドを独立させて頂きます。


juneさん
HI-HOではPHPが使えません
SSIは一部を除き使えるようです
テストhttp://www.hi-ho.ne.jp/j-inagaki/miken.shtml
私には呪文にしか見えません(涙)


りり
あら、でも、ソースを見ますと、二つのファイルの合成はできるているのではありませんか?
よろしければ、お使いになったファイルとサンプルをいくつか、todosに作ったjuneさんのフォルダーに入れてみてくださいませんか?
SSIが使えているようですので。


juneさん

SSIの事ですが
>あら、でも、ソースを見ますと、二つのファイルの合成はできるているのではありませんか?
と言う素晴らしいヒントを下さいましたので、追加で遊んでみました。
http://www.hi-ho.ne.jp/j-inagaki/ssi/top.shtml
同じ物をFTPでssiというフォルダーでアップさせて頂きました。
メンテ

*TODOS・何でも情報交換・TOP*<スレッドPage> 最新 | 3 | 2 | 1 |

Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.11 )
日時: 2010/01/24 19:05
名前: りり

obasan、いつもいろいろトライありがとうございます。

phpでのメニュー表示がでてきましたので、もともとの発端に合わせて、メニューをどのページにも表示する方法(SSI・phpの活用)にタイトルを変更しました。

メタタグについては、また内容が違ってくるので、他にまとめてみます。
テーマごとにスレッド、ジャンルを変えるというのも、なかなか難しいところがありますね。

話題の流れでいろいろ出てきますから。
流して良いところは流し、ある種のテクニック紹介情報としてスレッドを立てた方が良さそうなものは、後から整理…という対応をしていきたいと思います。


o6asanさんは、phpとスタイルシートを駆使されて、なかなかすっきりした構成ですね。

外枠を規定されて、センター配置にされている?ので、とても綺麗だと思います。
外枠の外に背景画像が出ているのですよね?

こうした構成についてご相談がありましたら、どうぞよろしくお願いいたします。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.12 )
日時: 2010/01/24 20:29
名前: りり

「リファラー規制を回避するメタタグ、そして意外な裏技」ということで、それに関係するとこは、こちらにまとめました。
http://todos.xsrv.jp/2patiosec/todos.cgi?no=12
以後、これに関わることは、こちらでお願いいたします。

また適切なカテゴリーがなかったので、「インターネット安全対策」というのを「インターネット活用・安全対策」とし、こうしたネット閲覧の話題も入れやすくしてみました。

ジャンル分けについては、ご意見があればどしどしお寄せください。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.13 )
日時: 2010/01/26 16:20
名前: sugiyama

私のWebサイトは1999年〜2003年がフレーム。2003年〜現在までがSSIです。
http://www.ysugiyama.com/vinyl/info/
メニュー部分とフッタ部分は全ファイル共通のもので、SSIを利用して流しこんでいます。

* ですので、レンタルサーバを引っ越す際はSSIが使えるかの確認が必要です。
* 現在は拡張子.htmlでもSSIが利用できるのですが、SSI利用のページは一応.shtmlにしてあります。
* メニュー部分が162pix幅、右の本文部分が580pix幅です。

ちなみに、メニュー部分を162pix幅、残りの全てを本文にしたい場合は
http://desperadoes.biz/style/dan/
↑ここの「TYPE C-4」を利用するとよさそうです。
TYPE C-3の右ボックスに、左ボックスの幅分だけ、左マージンを取る。
#my_navigation { float : left ; width : 150px ; }
#my_contents {margin-left: 150px;}
↓サンプル画面です。美しい! ブラウザの画面を狭くしても横スクロールバーが出ません。
http://desperadoes.biz/style/dan/1-f.html
ページのソースも非常にシンプル。
↓これはcssファイルです。
http://desperadoes.biz/style/dan/dansample.css

SSIの注意点としては、
1.
上の階層をたどってファイルを呼び出す時は
<!--#include virtual="../headerfooter/header1.html" -->
このように、「file」ではなく、「virtual」を使います。
(要するに、常に「virtual」を使えばよい)
2.
呼び出される文書の中にリンクがある場合、相対パスで書かず絶対パスで書きます。画像なども
<img src="../images/title1.gif" alt="title" width="140" height="40">
のように書かず、
<img src="http://www.hoge.com/images/title1.jpg" alt="title" width="140" height="40">
のように書きます。

この2点にのみ注意すればOK。私はSSIよりむしろフレームの方がいろいろややこしいと思います。(targetのこととか…。)
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.14 )
日時: 2010/01/26 22:32
名前: りり

sugiyamaさん、ようこそいらっしゃいませーーー

あの…ソウルの方ですか?

そう言えば、以前、ソウルからのアクセスが時々ありました。
最近は、アクセスログは、ホスト名ではなく、IPアドレスだけなので、一見してどこからかは余り把握していません。
スパム的なものだけ、ホスト名を確認しています。
どうもアクセス制限をホスト名で行うと、サーバ負荷が高くなるようなので、
アクセス制限は、すべてIPアドレスにしたら、アクセスログも、全てIPアドレスになりました。

sugiyamaさんのフレームを使われていたサイトは記憶があります。美しい構成でした。

今回再訪問させていただくと、まあ! これはこれは、またまたスッキリとした感じになりましたねーーー

週末に、再びじっくり読ませていただきたいと思います。

あぁ、マージンを取ると、特にテーブルでレイアウトしなくても良いのかな?


>私はSSIよりむしろフレームの方がいろいろややこしいと思います。(targetのこととか…。)

そうかもしれませんね。フレームは、飲み込むまでちょっと厄介のようです。
ですが、HTMLタグでの処理に慣れている方でないと、SSIもcssも敷居が高いかもしれませんね。

こちらにご相談に来られたあにどるさんには、考えた末、フレームを使っても良いのではと言いました。
いずれ、PHPやSSIを使えるようになりましたら、そちらをお奨めしても良いかと思いまして…


sugiyamaさんやo6asanさん、SSIやPHPでのメニュー差込を実際にされていらっしゃる方々が、実際のところをこのように披露いただくのは、とても参考になり嬉しいです。

今後ともよろしくお願いいたします。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.15 )
日時: 2010/01/27 22:03
名前: june

どうでも良いお話しなんですが・・・・
iswebでSSIを使うとき拡張子はshtmlにするらしいですが
呼び出すメニューの拡張子はどうしたらいいのか?
htmlで試しましたら、全部のファイルに広告が入りとても見れたものではありませんでした・・・。

広告を呼び出すタグが
<!--#include virtual="/header.txt" -->
らしいので、メニューもtxtで作ったところ、意図した感じになるようです
http://minogawa.hp.infoseek.co.jp/isweb/2karamu/2karamu.shtml
ヤッパリ変ですか?

o6asanさまの様にスッキリしたソースにはなりません・・・・。
難しいもんですね。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.16 )
日時: 2010/01/28 10:49
名前: sugiyama

juneさん、こんにちは。

http://allabout.co.jp/internet/hpcreate/closeup/CU20020520A/
allaboutの説明ページを見たら、呼び出される方は、.htmlでも.txtでもなんでもいいようです。
私は呼び出す側を.shtml、呼び出される側を.htmlにしています。
少し心配だったのは.html部分の文字化けです。.htmlの中では文字コードを規定してないので…。まあ、.shtml側の文字コード規定がそのまま引き継がれているようですけど。

SSIはメニューに限らず、全ページに同じものを書く時に便利です。例えば、一番下に「お問い合わせはhoge@gmail.com まで。(c)1999-2009 hogehoge」みたいになっているのをよく見かけますが、2010年になったら全ページを1999-2010に書き換える必要があり、SSIじゃないと大変だと思います。
ある意味、スタイルシートと似ているかもしれませんね。「全てのページの背景色がオレンジになっているのをピンクに変更」のようなことはスタイルシートじゃないととても出来ません。

つぎのような感じで雛形をつくるといいと思います。
<head>
<link rel="stylesheet" type="text/css" href="../style/style1.css">
</head>
<body>
<!--#include virtual="../headerfooter/header1.html" -->
<!--#include virtual="../headerfooter/menu1.html" -->
<h1>このページのタイトル</h1>
<p>本文</p>
<!--#include virtual="../headerfooter/footer1.html" -->
</body>
フッタなどは必要ないと思っても、将来欲しくなるかもしれないので、中身のないfooter1.htmlを作っておいて、余裕がある時に中身を作ればいいでしょう。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.17 )
日時: 2010/01/28 22:45
名前: june

sugiyamaさま こんばんは
シバケン様のリンクから数度はお邪魔させて頂いた記憶があります。

私の疑問に関しまして、的確な情報ありがとうございます。

根が不精者でして、調べてからやれば良いものを、直感?みたいに試してはご迷惑をおかけしています。

SSIのメリット(メニューの挿入関係)に関しましては、りりさまからもお教え頂いているのですが
慣れないせいで、どうしても抵抗があります・・・・。

始めに雛形を作ってそのまま更新していれば、きっと慣れていたのでしょうが・・・・
当時はそのような傾向ではなくて、今に至っています。

全面改装の気持ちは今のところ全くないのですが、知らないより知っていた方が良いかな?程度で取り組んでいます。

今後ともよろしくお願い致します。


メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.18 )
日時: 2010/01/29 05:59
名前: りり

あぁ、juneさん、私がお教えしているとか…というのではなく…

全面改装も特にお奨めしているわけではないのですが、これから、自分のサイトを作っていこうという方から、フレームを使うのはどうかと相談された場合、どう答えるのが良いのかな…と迷うところがありますので、話題にしてみました。

結論的には、それぞれの特徴などをお知らせして、ご自身で選んでいただくほかないなと思うのですが、SSIやphpは、興味を持って進んで使ってみようという方でないと、こなせないかなと思いました。

ですが、サイトの内容として、プライベートなもので、それほど後の変化がなさそうなら、個人の趣味でよいかと思うのですが、やはりお役立ち情報をどんどん増やしていきたい、参照リンクもたくさんあり得るだろう、今後の発展・膨張も考えていきたい…というのなら、更改しやすい形に最初からしておくのが良いかなと思いました。

あと、私が興味をもっているのは、Movable TypeやWordPressで、juneさんは、電右衛門さんのページを代行されていらっしゃいますが、掲示板に文字入力と画像挿入するような感覚で、ご自身に編集していただけるように形をつくってあげてしまうというのも良いのではと思いました。もしかしたら、そのような方向でjuneさんもMovable Typeを試されたのではないかと思うのですが。

既成のブログサイトは、宣伝が多かったり、余計なものがあって重すぎたりします。またFTPで直接自分のログのバックアップをとることもできません。容量の限界もあるでしょう。
サービスが突然終了することも。

私は、人それぞれ個性がありますから、自分の主張なり表現をWeb上でしてみたいという希望があったとしても、誰でもホームページ作成ソフトに精通したり、SSIやphpなどを勉強する必要も無いと思うのですね。
そこは適材適所、あるひな形を用意して差し上げて、内容の充実と活用のほうで、力を発揮していただくという方向も有ると思っています。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.19 )
日時: 2010/01/29 22:09
名前: june

りりさま こんばんは
またまた文章が変だったようで、申し訳ございませんm(_~_)m

一応ですが、りりさまの意図は分かっているつもりです。
でも、メニューの呼び出しを教えて頂いたのは事実ですので・・・・。

私が
>全面改装の気持ちは今のところ全くないのですが、知らないより知っていた方が良いかな?程度で取り組んでいます。
と書きましたのは、折角sugiyamaさまが情報を提供下さっているのに、もしもご訪問頂きサイトに反映されないと、何故かな?と思われ、気分を害されるといけませんので、自分なりのスタンスの説明をさせて頂いただけです。

>掲示板に文字入力と画像挿入するような感覚で、ご自身に編集していただけるように形をつくってあげてしまうというのも良いのではと思いました。もしかしたら、そのような方向でjuneさんもMovable Typeを試されたのではないかと思うのですが。

これに関しましては、半分は当たりです、半分は興味本位でした。
ブログじゃなくてもCGIの日記系でテーマごとに見出しが出るものもありますよね、これなんかも良いと思ったんですが(笑)
まあ、自分の中では色々ありましたが、双方今の形で落ち着いていると言うことだと私は思っています。

最後の3行はまったくもってその通りだと思っています。
メンテ
Re: メニューをどのページにも表示する方法(SSI・phpの活用) ( No.20 )
日時: 2010/01/29 22:46
名前: sugiyama

juneさん、こんにちは。
あまり切実でないなら、SSIはしないで他のこと(文章書きなどのコンテンツ作り)に時間を使った方がいいかもしれませんね。
私が、フレームからSSIに変更した時は既にページが200〜300ぐらい(?)あったので、ファイルの作り替えが結構大変でしたが、ポイントさえ掴んでおけば機械的な作業で難しいことではありません。
あと、SSIの導入の際に、ついでに他の問題点も修正するといいので、あまり焦ってSSIを導入するのもよくないかもしれません。(二度手間になる)

*****

りりさん、こんにちは。
そもそも、「画面上にメニューを表示する必要はあるのか」ってことがあるんですよね。特に、SSIで書いた左側のメニューは画面を下の方にスクロールして来ると単なる空白だけになってしまい、おマヌケです。

今はモニターの幅1,024ピクセルに決め打ちしてWebサイトを作っているデザイナーが多いようですけど、
1.私の場合はタスクバーを左縦置きにしているので、1,024ピクセル向けに作られると横スクロールバーが出てしまいます。
2.「画面右に画像チャット、画面左でWebの調べごと」などというシチュエーションは結構あると思うのですが、ブラウザを幅600ピクセルぐらいの表示にすると不便この上なしです。

空間をもてあまして、左にメニュー、中に本文、右に広告、みたいな3段組にしちゃうんでしょうね。
ちなみに、「文章は30字ぐらいで折り返さないと読みにくいよ」という主張がありますが、次のような反論があります。
A.閲覧者がブラウザの幅を30字分ぐらいに変更すれば済むこと。それこそがWebの特性。
B.飛ばし読みするのには100%幅になっている方が情報量が多く便利。
今見ているページ(TODOS)がまさにB.なのでしょうね。Webは文章をじっくり読むというより、情報を探し回るっていう感じじゃないでしょうか。「一行の文字数が多いから左右にマージンを15%づつとりましょう」などとすると逆に使い勝手が悪くなると思います。

Movable Typeは私も一応レンタルサーバ(さくらインターネット)の自分のスペースにアップしてあるのですが、テストだけして放置状態になっています。これは複数(5〜6名)の原稿執筆者がいる時などに便利そうですね。1年ぐらい前にある団体から「Webサイトを手軽に更新できるようにしたい」と相談をされて「Movable Typeを使ったらどうですか。劇団四季もこれを使っているそうですし」などと回答したりしたのでした。
メンテ

*TODOS・何でも情報交換・TOP*<スレッドPage> 最新 | 3 | 2 | 1 |

楽しい交流と情報交換のTODOS・アップローダーも用意。ぜひTOPからもご覧ください。
ご参考になりましたら、お気軽に一筆お書き込みくださいませ。
題名 スレッドをトップへソート
名前
画像添付
JPEG
GIF
PNG



参照ボタンを押して、PCの画像を指定ください。3枚まで指定できます。縮小画像はクリックで拡大されます。
パスワード (好きなパスワードを。投稿後、右下のスパナマークをクリックし、そのパスワードを入れて修正できます。)
コメント

   クッキー保存
スレッドTOPへ***スレッド一覧