お疲れ様です。株式会社リスペクト プログラマ2年目の藤原です。
現在弊社では、Google Sitesを使って社内Wikiを運用しています。しかし、Google Siteですと「はてなキーワードやニコニコ大百科のような単語に対する自動リンク機能が無い」という事でMediaWikiとVisualEditorプラグインを新しく社内サーバにインストールすることになりました。
VisualEditorはMediaWikiのプラグインで、導入するとWiki記法を使わずワープロソフトのようなWYSIWYGでWikiへの記事投稿ができるようになります。
下図が導入したときのイメージです。
今回はMediaWikiのインストール方法、そしてVisualEditorプラグインの導入について説明します。
インストール前の状態
・CentOS 6.7
・Apache 2.2.15
・PHP 5.6.30
・MySQL 5.1.73
よくあるLAMP環境ですが、MediaWikiのバージョンによって必要なPHPのバージョンが異なりますので注意が必要です。
VisualEditorはParsoidが無いと動きませんので、「Parsoid」とParsoidを使うための「Node.js」もインストールしていきます。そして、「単語に対する自動リンク機能」が欲しいので、LinkTitlesもインストールします。
MediaWiki、Node.jsはVisualEditorのバージョンによって互換性の無い場合があります。そこで、今回は全て最新版をインストールするつもりで進めていきます。
1．MediaWikiのインストール
まずMediaWikiをインストールしていきます。
gitを使ってインストールするのでgitが入っているかを確認します。
$ git --version -bash: git: command not found
デフォルトでは入ってないようです。
ではgitをインストール
$ sudo yum install git
質問は全て「y」で答えてください。
$ git --version git version 1.7.1
ちゃんとインストールされているようですので、これでgitのインストールは完了です。
気を取り直してgitを使ってMediaWikiのインストールをします。
まずリポジトリをダウンロードします。
$ git clone https://gerrit.wikimedia.org/r/p/mediawiki/core.git
coreフォルダがダウンロードされました。
coreフォルダに移動してブランチを確認してみましょう。
$ cd core $ git branch -a
表示結果がこちら
$ git branch -a * master remotes/origin/HEAD -> origin/master remotes/origin/REL1_1 remotes/origin/REL1_10 remotes/origin/REL1_11 remotes/origin/REL1_12 remotes/origin/REL1_13 remotes/origin/REL1_14 remotes/origin/REL1_15 remotes/origin/REL1_16 remotes/origin/REL1_17 remotes/origin/REL1_18 remotes/origin/REL1_19 remotes/origin/REL1_2 remotes/origin/REL1_20 remotes/origin/REL1_21 remotes/origin/REL1_22 remotes/origin/REL1_23 remotes/origin/REL1_24 remotes/origin/REL1_25 remotes/origin/REL1_26 remotes/origin/REL1_27 remotes/origin/REL1_28 remotes/origin/REL1_3 remotes/origin/REL1_4 remotes/origin/REL1_5 remotes/origin/REL1_6 remotes/origin/REL1_7 remotes/origin/REL1_8 remotes/origin/REL1_9 remotes/origin/fundraising/REL1_22 remotes/origin/fundraising/REL1_23 remotes/origin/fundraising/REL1_25 remotes/origin/fundraising/REL1_26 remotes/origin/fundraising/REL1_27 remotes/origin/master remotes/origin/sandbox/jdlrobson/design remotes/origin/sandbox/twentyafterfour/group0 remotes/origin/wmf/1.29.0-wmf.1 remotes/origin/wmf/1.29.0-wmf.10 remotes/origin/wmf/1.29.0-wmf.11 remotes/origin/wmf/1.29.0-wmf.12 remotes/origin/wmf/1.29.0-wmf.2 remotes/origin/wmf/1.29.0-wmf.3 remotes/origin/wmf/1.29.0-wmf.4 remotes/origin/wmf/1.29.0-wmf.5 remotes/origin/wmf/1.29.0-wmf.6 remotes/origin/wmf/1.29.0-wmf.7 remotes/origin/wmf/1.29.0-wmf.8 remotes/origin/wmf/1.29.0-wmf.9
RELと書かれた物が安定版らしいのですが、最新版のVisualEditorはMediaWiki1.28では動きませんので、今回は1.29をダウンロードします。せっかくなので、一番新しい1.29.0-wmf.12を使います。
$ git checkout -b 1.29.0-wmf.12 origin/wmf/1.29.0-wmf.12
切り替えられたか、現在のブランチを確認しましょう。
$ git branch * 1.29.0-wmf.12 master
問題はなさそうです。
coreフォルダは好きな名前に変えて構いません。今回は「MediaWikiTest」という名前にしました。
ブラウザで見られるようにMediaWikiTestをドキュメントルートに移動します。
ブラウザで開こうとすると以下のようなエラーが出てきます。
MediaWiki 1.29 internal error Installing some external dependencies (e.g. via composer) is required. External dependencies MediaWiki now also has some external dependencies that need to be installed via composer or from a separate git repo.Please see mediawiki.org for help on installing the required components.
External dependencies(外部依存関係)でエラーが出ているのですが、要は「vendorの中身が無い」と怒っているみたいです。
gitでMediaWikiをインストールする場合は、vendorと後述するskinを個別でインストールする必要があります。それではvendorをインストールしていきましょう。
vendorもMediaWiki同様、gitでインストールすることができます。
$ git clone https://gerrit.wikimedia.org/r/p/mediawiki/vendor.git
MediaWikiと同じようにブランチを切り替えます。
$ cd vendor $ git checkout -b 1.29.0-wmf.12 origin/wmf/1.29.0-wmf.12
切り替えるブランチはMediaWikiと同じ名前のブランチで問題ありません。
これでvendorのインストールが終わりましたので、出来上がったvendorフォルダをMediaWikiTestフォルダに移動します。
もう一度ブラウザで開いてみましょう。
正しくインストールできました。次はMediaWikiの設定に入ります。
MediaWikiを使うためにはデータベースが必要なので事前に作っておきましょう。
今回、データベースの名前は「mediawiki」としました。
mysql> create database mediawiki;
テーブルを作る必要はありません。
それではMediaWikiの設定をしていきます。
最初は言語の設定です。迷うことなく日本語を選択しました。
MediaWikiをインストールできるそうなので、「続行」を押します。
次はデータベースの設定です。今回はMySQLを使用していますので、MySQLにチェックしてください。
データベース名には先ほど作成したデータベースの名前を入力します。
後はデフォルトで問題ありません。
こちらもデフォルトでOKです。
Wikiの名前やアカウントの設定です。
私は以下のように設定しました。
「私にもっと質問して下さい。」にチェックを入れて続行をクリックします。
オプションは特に変更する物もなさそうなので、このまま続行をクリックします。
確認画面も続行をクリック
LocalSettings.phpがダウンロードできますので、そのファイルをMediaWikiTestフォルダに保存してください。
これでMediaWikiが使えるようになります。
しかし、前述の通りgitでMediaWikiをインストールした場合、skinsが無いためWikiらしくない見た目になっています。skinsをダウンロードしていきましょう。
以下のURLから圧縮ファイルをダウンロードできるのでそれを解凍します。
https://www.mediawiki.org/wiki/Special:SkinDistributor/Vector
コマンドでダウンロードしたい場合は以下の通りです
$ wget https://extdist.wmflabs.org/dist/skins/Vector-master-df140be.tar.gz $ tar -xzf Vector-master-df140be.tar.gz -C ~
今回は最新版を使うという事で、先ほどのサイトのmasterを使う事にします。
安定版の中では1_28が一番新しいskinsなので、そちらを使っても問題ありません。
vectorというフォルダが作られていますので、それをMediaWikiTest/skinsへ移動して下さい。
MediaWikiTestの設定をして完了です。
MediaWikiTest/LocalSettings.phpに以下のコードを追加してください。
// Vectorを読み込む wfLoadSkin( 'Vector' ); // 検索フォームの外観を設定(検索アイコンを使用するかどうか) $wgVectorUseSimpleSearch = true; // ウォッチとウォッチ解除をメインナビゲーションの☆アイコンで行う $wgVectorUseIconWatch = true;
もう一度ブラウザで開いてメインページが表示されたらMediaWikiのインストールは完了です。
2．Nodejsのインストール
前述した通り、VisualEditorはParsoidに依存しているためParsoidが無いと動きません。そしてParsoidを使うためにはNode.jsもインストールする必要があります。
ではNode.jsをインストールしていきましょう。
まずNode.jsのバージョン管理ツールであるnvmをインストールします。
$ git clone https://github.com/creationix/nvm.git ~/.nvm $ source ~/.nvm/nvm.sh
次にNode.jsのバージョンを確認します。
$ nvm ls-remote ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 略 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー v6.9.4 (LTS: Boron) v6.9.5 (LTS: Boron) v6.10.0 (Latest LTS: Boron) v7.0.0 v7.1.0 v7.2.0 v7.2.1 v7.3.0 v7.4.0 v7.5.0
たくさん表示されると思いますが、始めに「最新版をインストールする」と書きましたので、一番下のv7.5.0をインストールしましょう。
$ nvm install v7.5.0 Downloading and installing node v7.5.0... Downloading https://nodejs.org/dist/v7.5.0/node-v7.5.0-linux-x64.tar.gz... ######################################################################## 100.0% Computing checksum with sha256sum Checksums matched! Now using node v7.5.0 (npm v4.1.2) Creating default alias: default -> v7.5.0 $ node -v v7.5.0
Node.jsのバージョンがv7.5.0になっている事を確認ください。
以上でNode.jsのインストールを終わります。
3．Parsoidのインストール
VisualEditorのためにParsoidをインストールしていきます。
こちらもgit cloneでインストールできます。
$ git clone https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid $ cd parsoid $ npm install $ npm test
parsoidフォルダの中に「config.example.yaml」,「localsettings.example.js」がありますので、それぞれ名前を「config.yaml」,「localsettings.js」に変更します。
config.yamlの設定を行います。
config.yamlの中に
mwApis: uri:'http: //localhost/w/api.php' domain: 'localhost' # optional
という部分がありますので、先頭に#を付けてコメントアウトしてください。削除しても構いません。
そして、以下のコードがコメントアウトされているので、#を外してコメントを解除してください。
localsettings: ./localsettings.js
最後にlocalsettings.jsの設定を行います。
exports.setup = function(parsoidConfig) {
parsoidConfig.setMwApi({
uri: 'http://192.168.33.20/MediaWikiTest/api.php',
domain: 'yoursite.com',
prefix: ''
});
};
uriはMediaWikiTestのapi.phpにアクセスするアドレスを記述します。
domain, prefixの記入は任意です。
Parsoidのインストールは以上です。
インストールされているか実際にサーバを動かして確かめてみます。
$ node bin/server.js
サーバが起動しましたのでブラウザでサイトを開いてみます。
Parsoidのデフォルトのポートは8000ですので、「http://192.168.33.20:8000」をブラウザで開くとparsoidのページが表示されます。
自分のwikiを開く場合、例えばメインページを開く場合は以下のURLで開きます。
http://192.168.33.20:8000/yoursite.com/v3/page/html/メインページ
4．VisualEditorのインストール
いよいよVisualEditorをインストールしていきます。
まずVisualEditorをgitでダウンロードして最新バージョンにします。
$ git clone https://gerrit.wikimedia.org/r/p/mediawiki/extensions/VisualEditor.git $ cd VisualEditor ブランチを確認 $ git branch -a MediaWikiと同じブランチにしておきましょう $ git checkout <MediaWikiと同じブランチ>
次にサブモジュールを更新します。更新しないとVisualEditorが動かないので、忘れずに更新しましょう。
VisualEditorフォルダ内で以下のコマンドを使用すると更新できます。
$ git submodule update --init
MediaWikiTestでVisualEditorを有効にします。
MediaWikiTest/LocalSettings.phpに以下のコードを追加します。
wfLoadExtension('VisualEditor');
//すべての人にデフォルトで有効にする
$wgDefaultUserOptions['visualeditor-enable'] = 1 ;
//オプション：匿名ユーザーのデフォルトとしてVisualEditorを設定します
//それ以外の場合はVEに切り替える必要があります
// $ wgDefaultUserOptions ['visualeditor-editor'] = "visualeditor";
//ユーザーが無効にすることを許可しない
$wgHiddenPrefs[] = 'visualeditor-enable';
次にparsoidで設定した内容をMediaWikiTestにも設定します。
$wgVirtualRestConfig['modules']['parsoid'] = array( 'url' => 'http://192.168.33.20:8000', 'domain' => 'yoursite.com', 'prefix' => '' );
最後にブラウザでMediaWikiTestを開き、編集タブをクリックします。
編集タブをクリックすると「ビジュアルエディタをインストールしますか？」と表示されるのでインストールしてください。
これでVisualEditorのインストールは完了となります。
5．LinkTitlesのインストール
こちらもgitでインストールしていきます。
$ git clone git://github.com/bovender/LinkTitles.git
LinkTitlesフォルダができますので、LinkTitlesフォルダに移動します。
そして、リポジトリを更新します。
$ cd LinkTitles/ $ git pull
LinkTitlesフォルダをMediaWikiTest/extensionsに移動します。
LinkTitlesを使えるように、MediaWikiの設定を行います。
MediaWikiTest/LocalSettings.phpを編集し設定します。
以下のコードを追加するとLinkTitlesが使えるようになります。
wfLoadExtension('LinkTitles');
それでは、リンク解析の詳細設定をしていきます。
この設定もMediaWikiTest/LocalSettings.phpに記述していきます。
今回の設定内容は以下の通りです。
・記事中に出てくるすべてのワードにリンク付けする
・どんなに短いタイトルにも対応させる(1文字タイトルにも対応させます)
・大文字小文字は区別しない
・自動的にリンク付けする
・日本語にリンク付けする
まずリンク付け解析をするタイミングを設定します。
編集時とページ表示時が設定できるので今回は以下のように設定しました。
$wgLinkTitlesParseOnEdit = false; // 編集時に解析しない $wgLinkTitlesParseOnRender = true; // ページを表示したときに解析する
編集時に解析するか、ページを表示した時に解析するかを選びます。編集時の解析の場合、ソースの変更が保存された時にリンクを解析し、見つけたらソースにリンクを挿入します。ソースを編集してほしくない場合は、$wgLinkTitlesParseOnEditをfalseにしておきましょう。
表示時の解析の場合は、リンク付けされますが、ソース自体に変更が加わりません。
どちらを使用しても問題はありませんが、どちらか一方はtrueにしておきましょう。当たり前ですが、両方ともfalseの場合はリンク付けされません。
次にワードの検索方法について設定します。
全てのワードにリンク付けするので、以下の設定を全てfalseにします。
$wgLinkTitlesFirstOnly = false; // リンク付けは1つだけ // 最初に見つけたワードにリンク付け $wgLinkTitlesWordStartOnly = false; // ワードの始めは区切り文字が必要 $wgLinkTitlesWordEndOnly = false; // ワードの最後は区切り文字が必要
$wgLinkTitlesFirstOnlyをtrueにすると、記事中で最初に見つけたワードにのみリンク付けされます。今回は記事中の全てのワードにリンク付けしたいので、falseに設定します。
$wgLinkTitlesWordStartOnlyをtrueに設定すると、ワードの前に区切り文字が無い場合はリンク付けされません。$wgLinkTitlesWordEndOnlyをtrueに設定すると、ワードの最後に区切り文字が無い場合はリンク付けされません。ここで言う「区切り文字」には空白、改行、スラッシュなどを用いることができます。日本語の文章では単語と単語の間に「区切り文字」を使われることは少ないので、どちらもfalseに設定しておきましょう。
リンク付けするワードの長さを設定します。
デフォルトでは2文字以上のワードにリンクするよう設定されています。今回は1文字のワードにも対応させたいので、以下のコードを追記します。
$wgLinkTitlesMinimumTitleLength = 1;
最後に検索する文字列の大文字小文字を区別するかどうかを設定します。
今回は大文字小文字を区別しないので以下のコードを追記します。
$wgLinkTitlesSmartMode = true;
大文字小文字を区別したい場合はfalseに設定してください。
しかし、falseにしても1文字目は大文字、小文字を区別しないようです。
これでLinkTitlesの設定を終わります。
6．おわりに
ここまでMediaWikiとVisualEditorのインストールの手順を説明してきました。
MediaWikiはウィキペディアだけでなく、アンサイクロペディアやWikia、スカラーペディアなど様々なサイトに利用されているメジャーなウィキソフトウェアです。
ぜひ自分のウィキを作って試してみてください。
今はウィキを作る予定がなくても、今後のために触れておくのも良いかと思います。
ありがとうございました。
