MediaWikiにOGPのメタタグを追加してみる

MediaWikiにOGPのメタタグを追加してみるよ。僕が使っているMediaWikiのバージョンから最新はだいぶアップデートされているみたいなので…Ver.1.22.6をベースに話を進めるよ。ちなみに今回設定したOGPは以下のプロパティを設定したよ。

og:type
トップページなら「website」そのほかは「article」で設定。
og:title
ページのタイトル。
og:url
トップページのＵＲＬ。
og:site_name
サイトの名称。このサイトなら「Rin Knowledge Database」。
og:image
サイトアイコン（イメージ）へのURL。（facebookのことを考えて200px以上のイメージ）

Vector.phpの編集

きっと、うまくやればExtensionでできるんだろうけど…と思ってみて探しに探したけど、良い感じのExtensionが見つからなかったんだ。しかも、Extensionを作れる自信がないので、いっそのことって事で「Vector.php」を直接編集したんだ。

以下のディレクトリのVector.phpをさがす。

【Mediawikiをインストールしたディレクトリ】/skins/Vector.php

FTPのソフトなどを使ってダウンロードする。（直接編集できる人はこの手順は必要ないよ）
エディタなどでファイルを開く。（さまざまな文字コードに対応したエディタを使ってね）

以下の部分を探してね。（「SkinVector」クラスの「initPage」メソッドだよ。）

public function initPage( OutputPage $out ) {
	global $wgLocalStylePath;

	parent::initPage( $out );

	// Append CSS which includes IE only behavior fixes for hover support -
	// this is better than including this in a CSS file since it doesn't
	// wait for the CSS file to load before fetching the HTC file.
	$min = $this->getRequest()->getFuzzyBool( 'debug' ) ? '' : '.min';
	$out->addHeadItem( 'csshover',
		'<!--[if lt IE 7]><style type="text/css">body{behavior:url("' .
			htmlspecialchars( $wgLocalStylePath ) .
			"/{$this->stylename}/csshover{$min}.htc\")}</style><![endif]-->"
	);

	$out->addModules( array( 'skins.vector.js', 'skins.vector.collapsibleNav' ) );
}

上記のソースを以下のように修正してね。

public function initPage( OutputPage $out ) {
	global $wgLocalStylePath;

	parent::initPage( $out );

	// Append CSS which includes IE only behavior fixes for hover support -
	// this is better than including this in a CSS file since it doesn't
	// wait for the CSS file to load before fetching the HTC file.
	$min = $this->getRequest()->getFuzzyBool( 'debug' ) ? '' : '.min';
	$out->addHeadItem( 'csshover',
		'<!--[if lt IE 7]><style type="text/css">body{behavior:url("' .
			htmlspecialchars( $wgLocalStylePath ) .
			"/{$this->stylename}/csshover{$min}.htc\")}</style><![endif]-->"
	);

	/* OGPtag ここから追加 */
	if(strcmp($out->getPageTitle(), 'メインページ') == 0)
	{
		$out->addHeadItem('og:type','<meta property="og:type" content="website">');
	}
	else
	{
		$out->addHeadItem('og:type','<meta property="og:type" content="article">');
	}
	
	$out->addHeadItem('og:title', '<meta property="og:title" content="' . $out->getPageTitle() . '">');
	$out->addHeadItem('og:url', '<meta property="og:url" content="http://rinknowledge.com/">');
	$out->addHeadItem('og:site_name', '<meta property="og:site_name" content="Rin Knowledge Database">');
	$out->addHeadItem('og:image', '<meta property="og:image" content="http://rinknowledge.com/images/c/c2/Logo_200_200.png">');
	/* OGPtag ここまで */

	$out->addModules( array( 'skins.vector.js', 'skins.vector.collapsibleNav' ) );
}

文字コードをUTF-8にして保存してね…
僕はUTF-8で保存しないと、追加したIF文が機能しなかったんだよ…。もしかしたら他に解決方法があるかもしれないよ…
ファイルを元の場所にアップロードしてね。（直接編集している人は必要ないよ）
サイトのページを開いて、OGP用のメタタグがついていることを確認してね。

参考サイト

MediaWikiにmetaタグの追加 - サクラタロウmeta
Windows環境でのPHPの文字化け対策 | web開発日報
 Extension:Advanced Meta - MediaWiki　…　テーブルを作るので却下
Extension:MetaTags - MediaWiki　…　MediaWikiのバージョンミスマッチで動かなかった…
Extension:Add HTML Meta and Title - MediaWiki　…　titleタグをいじる理由が良くわからなかったので却下
Extension:WikiSEO - MediaWiki　…　ページ毎にタグ（またはテンプレート）を設定しないとだめらしいので却下（「MediaWiki:Sitenotice」に追加してみたけど…コメントアウトされた…）