1. 前回までのおさらい 2. Wiki とは 3. PukiWiki をインストールする

コンピュータ基礎実習(上級) 第 11 週
「コンピュータ基礎実習(上級)」第 11 週 CGI について 3
今回の授業では、CGI の一種である Wiki システムの設置を行います。
1. 前回までのおさらい
1.1.
CGI とは(復習)
CGI （しーじーあい Common Gateway Interface）はウェブサーバーが、ページにアクセスする人に対応して
プログラムを起動する仕組みです。
掲示板やショッピングカート、ブラウザゲームなど、ページの閲覧者からの入力や状況によって表示が変化する
[動的コンテンツ]を実現できるのが特徴です。
CGI ファイルの拡張子は .cgi または .php です。 Perl や PHP といったプログラミング言語で記述されています。
1.2.
CGI を扱う際のポイント
 関連ファイルは全てアップロードすること。
 CGI ファイルを編集するときは [サクラエディタ]など CGI 編集に適したテキストエディタを使う。
(文字コードや改行コードを正しく取り扱えないテキストエディタを使うと動作しなくなったりする。)
 設置方法は、サイトの説明や CGI 付属の説明書をよく読む。
 Perl で記述された CGI を動作させるには、アップロード後に[権限(パーミッション)]の設定が必要。
より高度な CGI になると、できることも増えますが、ファイルの数も増え、複雑に見えることがあります。
しかし CGI に対する基本的な扱い方や注意点は変わりません。
2. Wiki とは
今回は高度な処理が行える CGI の例として、Wiki(うぃき)システムを設置します。
ウィキ（Wiki）あるいはウィキウィキ（WikiWiki）は、CGI の一種です。
ブラウザ上からサーバー上のページを簡単に書き換えることができるシステムです。
Wiki システムのプログラムそのものや、Wiki で作成されたサイト全体を指して[ウィキ]と呼ぶこともあります。
（
「〜
に関するウィキサイト」等)
現在では、最初に開発された Wiki に改良を加えたり発展させたりしたバージョンとして
[ウィキクローン] とよばれる様々な Wiki が出回っています。
有名なフリー百科辞典であるウィキペディア(http://ja.wikipedia.org/)も Wiki の一種です。
Wiki の特徴
多くの Wiki には共通して、以下の様な特徴があります。
 ネット上からいつでも、どこからでも、誰でも、ページを編集することができるので共同作業に便利です。
 パスワードをつけて書き換えに制限を設けられるので、個人的なサイトにも Wiki を使えます。
 ブラウザのみでページの書き換えができるので、編集が楽です。
 Wiki 特有の Wiki 文法でページを記述しますが、HTML と比べ簡単な文法です。
(Wiki 文法を覚えると、多くの Wiki が編集可能になります。)
 リンクが作りやすく、簡単にページ間を接続できます。
2.1.
このような編集作業の手軽さや共同作業しやすさを利用することで、
情報のまとめサイトや個人のサイトなどに Wiki は多く活用されています。
3. PukiWiki をインストールする
この授業では、Wiki クローンの一種である[PukiWiki](ぷきうぃき)をサーバーにイ
ンストールします。
PukiWiki は PHP で作成されている、初心者でも比較的扱いやすい Wiki クローン
です。
3.1.
PukiWiki のダウンロードと設置
1. PukiWiki の公式サイト http://pukiwiki.sourceforge.jp/ にアクセス。
( [ぷきうぃき] で Google 検索すると簡単にアクセスできる。)
2.
ページ左上の [ダウンロード] コーナーにアクセス。
-1-
PukiWiki のダウンロード
コンピュータ基礎実習(上級) 第 11 週
3. [1.5 系 (HTML)] 欄の一番上のリンクをクリック。(最新バージョンを選択。)
4.
[ダウンロード]コーナーの
[フルセット] 欄で [UTF-8] 欄の [pukiwiki-1.5.x_utf8.zip]
をクリック。
5.
しばらくすると自動でダウンロードが始まるので、
デスクトップ等に保存する。
6.
圧縮フォルダがダウンロードされるので解凍する。
[pukiwiki-1.5.0_utf8] というフォルダができるので、
[wiki] などの短いフォルダ名に変更しておく。
7.
[wiki]フォルダを丸ごと[public_html]フォルダ内に
アップロードします。(php 製 CGI なので直接ドラッグできます。)
権限(パーミッション)の設定は、京都産業大学の場合不要です。
8.
URL にアクセスして、動作確認をしましょう。
(URL 例) http://www.cc.kyoto-su.ac.jp/~g000000/wiki/
右のような画面が表示されれば成功です。
これで PukiWiki のダウンロードと設置が完了です。
デスクトップ等に残った wiki フォルダは紛らわしいので削除しておきましょう。
3.2.
PukiWiki の初期画面
初期設定
使い始める前に PukiWiki の設定ファイルである[pukiwiki.ini.php] を自分の環境にあわせて設定しておきます。
いたずらされない様に、少なくとも[管理者パスワード]は初期のものから変えておいてください。
public_html フォルダ内の wiki フォルダにある pukiwiki.ini.php をサクラエディタなどで開いて編集します。
管理者パスワード
$adminpass = '{x-php-md5}!';
上記の「{x-php-md5}!」の部分を書き換えます。
{x-php-md5} と頭に記述した場合は、MD5 という暗号化機能によって暗号化されたパスワードを書き込む設定に
なっていますが、とりあえずは
$adminpass = 'your-password';
のように your-password の部分を別のパスワードに書き換えて記述しておきましょう。
サイトのタイトル
$page_title = "○○のサイト";
ブラウザのタイトルバーなどに表示される名前です。[～のページ] 等、好きな名前に書き換えます。
管理者の名前
$modifier = '○○wiki 管理人';
上記の anonymous の部分を自分の名前やニックネームに書き換えましょう。日本語でもかまいません。
改行の動作変更
$line_break = 1;
通常 wiki 文法では、編集画面で改行をしても実際のページ表示時には無視されます。(HTML の動作と似ています。)
ですが line_break を 1 に設定しておくと、編集画面で行った改行が、そのままページに反映するようになります。
直感的な操作が行えるようになるので、好みで 1 に設定しておくと良いでしょう。
書き換えが終わったら、再び URL にアクセスして問題なく Wiki が動作していることを確認しましょう。
4. Wiki ページの編集方法
Wiki では HTML ではなく、独自の Wiki 文法という書き方でページを記述します。
各ページはWiki文法のままWikiシステム内に保存されており、ページが表示される時に、
Wikiによって適切なHTML
に変換されてブラウザ上に表示されます。
-2-
コンピュータ基礎実習(上級) 第 11 週
4.1. Wiki 文法と HTML への変換例
記入する Wiki 文法例
''ウィキ（Wiki）''は[[ブラウザ]]を利用して簡単に書き換えを行うことができます。
↓
Wiki によって変換された HTML
ウィキ（Wiki）は<a href="/wiki/ブラウザ" title="ブラウザ">ブラウザ</a>を利用して簡単に書き換
えを行うことができます。
↓
ブラウザによる画面表示
ウィキ（Wiki）はブラウザを利用して簡単に書き換えを行うことができます。
この例のように、Wiki 文法で ''〜'' と記入したところが HTML のタグで強調されたり、
Wiki 文法で [[ブラウザ]] と書いたところが、別ページへのリンクに変換されたりします。
ページを編集する時は、この Wiki 文法を入力することになります。
4.2.
ページを修正する方法
表示中のページを修正するには、画面上部のメニューより[編集] をクリックします。
編集が終わったら、他の人がページを書き換えられないよう[凍結]をします。凍結する時は、
初期設定で決めた [管理者用パスワード]を入力します。
凍結済みのページを編集するには、上部メニューより[凍結解除]をクリックし、[管理者用パスワード]を入力すると、
再び編集できる状態になります。
4.3.
新しいページを作成する方法
Wiki では幾つかの方法で新しいページを作ることができます。以下の様な方法があります。
1. 上部メニューの[新規]で作成
画面上部のメニューで[新規]をクリックして、ページ名を記入すると新しいページを作成できます。
2. リンクを使って作成
ページ編集中に [[ページ名]] のように[[と]]で囲ってページ名を書くとリンクになります。
リンクをクリックした時、リンク先ページが存在しないと、自動的に新規ページ作成画面になります。
このように Wiki では簡単に新しいページを作れます。
5. Wiki 文法の基本
PukiWiki でページを作成するための構文のうち、主なものを紹介します。(来週の講義でより詳しく説明します。)
5.1.
段落
文字入力時に１行以上空行をつくると、段落となり、上下に１行分の空行が挿入されます。
5.2.
改行
ウィキでページを作成~
wiki では通常、改行はページ右端での自動折り返しですが、行末に~をつけると、その場で改行されます。
(参考) pukiwiki.ini.php 内で$line_break の設定を変更すると、編集画面での改行を、そのままページに反映させられ
ます。 $line_break=0; (初期設定。改行が反映しない。) → $line_break=1; (改行が反映する。)
5.3.
整形済みテキスト
この文章は、
そのままページに表示される。
行頭に半角スペースを記入すると、行の自動折り返しは行なわれず、入力したテキストがそのまま画面に表示され
る整形済みテキスト状態になります。外観は四角形で囲まれたようになります。
-3-
コンピュータ基礎実習(上級) 第 11 週
5.4. 強調
このキーワードは''重要''です。
行中の文字を '' (シングルクォーテーション 2 つ) ではさむと強調表示として太字になります。
5.5.
水平線
--------------------------------------------行頭に 4 つ以上の - (ハイフン)を書くと水平線になります。
5.6.
見出し
*第一章
**はじめに
行頭に * (アスタリスク) を書くと見出しになります。見出しは *、**、*** の 3 段階あります。
5.7.
リンク
[[ページ名]]
[[エイリアス名>ページ名]]
[[と]]でページ名をはさむと、Wiki サイト内でページ名に該当するページヘのリンクになります。
ページ名はページを新規作成するときに決める、ページのタイトルのようなものです。
ページ名は、全角文字、記号、数字、半角空白文字など、比較的自由な名前にできます。
( "#&<> 等の記号は、ページ名には使えません。)
リンクをクリックした時、リンク先ページが存在しない場合、自動的に新規ページ作成画面になります。
(とりあえずリンクを先に作れるので編集が楽です。)
ページ名と異なる文字を画面に表示したい場合は、エイリアス名を使うことができます。
[[エイリアス名:URL]]
外部のサイトにリンクしたいときは、: の前に好きな名前を、: の後ろに URL を記述すると、その名前を画面に表
示しつつ URL に対してリンクすることができます。
(例) [[ヤフー:http://www.yahoo.co.jp/]]
6. Wiki のデザインを変える
PukiWiki では、スキンによって外観を自由に変更することができます。
試しに irid というスキンを導入してみます。
1. PukiWiki の公式サイト http://pukiwiki.sourceforge.jp/ にアクセス。
( [ぷきうぃき] で Google 検索すると簡単にアクセスできる。)
2.
ページ左上メニューから [自作スキン] コーナーにアクセス。
3.
irid のリンクをクリックし、irid スキンの説明画面を開く。
4.
[設置方法] コーナーの説明を参考に設定します。
スキンの外観変更例
 irid フォルダを、skin ディレクトリ以下にアップロード
 pukiwiki.ini.php を下のように修正。
// スキン/スタイルシートファイル格納ディレクトリ
define('SKIN_DIR', 'skin/irid/');
5.
URL にアクセスして、動作確認します。外観デザインが変わっていたら成功です。
(URL 例) http://www.cc.kyoto-su.ac.jp/~g000000/wiki/
このようにサイトのデザインを簡単に変えることができるのも Wiki の特徴です。
あなたのサイト制作の際などに、活用してみてください。
次週、この PukiWiki を使って、簡単なサイトの制作を行います。
以上
-4-

Download Report