Pukiwiki/スマホ対応 - Webデザイン周りの雑記

スマホ用スキン表示

既存のガラケー用出し分けを廃止してスマホ用に使う。
クッキーを使って、ユーザーがスキンを切り替えられるようにする。

手順

skin/pukiwiki.skin.php をコピーして smartphone.skin.php を作成。
- <body>内にスマホ版だということが分かるように何か追記しておく。
default.ini.php をコピーして smartphone.ini.php を作成。（keitai.skin.php は削除。）
- 下記変更する
```
- define('SKIN_FILE', DATA_HOME . SKIN_DIR . 'pukiwiki.skin.php');
+ define('SKIN_FILE', DATA_HOME . SKIN_DIR . 'smartphone.skin.php');
```
- フェイスマーク定義ルールなど、全く同じでよい記述は pukiwiki.ini.php に移動させてしまっても良い。

pukiwiki.ini.php

User-Agent settingsを以下に差し替え

/////////////////////////////////////////////////
// User-Agent settings
//

$sp_ua = array(
	'iPhone',			// iPhone
	'iPod',				// iPod touch
	'Android',			// Android
	'BlackBerry',		// Blackberry
	'Windows Phone', 	// Windows Phone
);
$sp_ua_list = '/'.implode('|', $sp_ua).'/i';
$expire = time() + 2592000; //クッキーの有効期限

if( isset($_COOKIE['skin']) ){
	$usr_skin=$_COOKIE['skin'];
}elseif(preg_match($sp_ua_list, $_SERVER['HTTP_USER_AGENT'])){
	setcookie('skin', 'sp', $expire);
	$usr_skin='sp';
}else{
	setcookie('skin', 'pc', $expire);
}

if($usr_skin=='sp'){
	$set_skin='smartphone';
}else{
	$set_skin='default';
}

$agents = array(
	array('pattern'=>'#^#',	'profile'=>$set_skin)
);

setpkin.phpファイルを作成して / にアップロード、あとはsetpkin.phpをブラウザで叩く度にスキンとクッキーが変わります。

<?php
	$ref = $_SERVER['HTTP_REFERER'];
	$expire = time() + 2592000; //クッキーの有効期限
	setcookie('skin', 'sp', $expire);

	if($_COOKIE['skin'] == 'sp'){
		$skin='pc';
	}elseif($_COOKIE['skin'] == 'pc'){
		$skin='sp';
	}
	setcookie('skin', $skin, $expire);
	header("Location: $ref");
?>

HTML

<a href="setskin.php">setskin</a >

参考

tDiaryスキン BugTrack/769
- tdiary.skin.phpも使わなければ削除できます。tdiary関連の記述はindex.php、default.ini.php、INSTALL.txtにあります。
続・質問箱/468
- Runtime errorが出てしまう場合は、default.ini.php または smartphone.ini.php の読み込みに失敗しています。

最新の10件を表示しています。一覧はコメント/Pukiwiki/スマホ対応を参照

はじめまして setpkin.phpのとこがよく分からなく教えていただきたいです -- [id:YjQ242]
2017-06-28 (水) 01:56:44

カテゴリ別

設定

その他