ページへ戻る

− Links

 印刷 

携帯対応レンダラー のバックアップソース(No.13) :: XOOPS マニア

xpwiki:keyword/HypCommonPreLoad/KtaiRender のバックアップソース(No.13)

« Prev[5]  Next »[6]
TITLE:携帯対応レンダー
#nopagecomment
#navi(../../)

* 携帯対応レンダー [#c558a62d]

HypCommonPreLoad に含まれる出力フィルターで、XOOPSを丸ごと携帯対応にすることができます。

- この機能を利用するには、サーバーに HypCommonFunc をアップロード後、XOOPS に HypCommonPreLoad を導入し、[[HypCommonPreLoad の設定>../#y8348a4c]]を行ってください。
- 簡単ログイン機能を使用するには、XOOPS_TRUST_PATH/cache ディレクトリに書き込み権限が必要です。
- 外部サイトに移動するために「外部リンク用リダイレクトスクリプト」が必要です。&br;デフォルトでは、[ XOOPS_ROOT_PATH/class/hyp_common/redirect.php ] が設定されています。&br;サーバー上に該当ファイルがない場合は、[[redirect.php(ダウンロード):http://cvs.sourceforge.jp/cgi-bin/viewcvs.cgi/*checkout*/hypweb/XOOPS_TRUST/class/hyp_common/html/class/hyp_common/redirect.php]] を XOOPS_ROOT_PATH/class/hyp_common ディレクトリに配置してください。
- HypCommonFunc Ver 20080626 以降で、RSS 出力にも対応しています。
- HypCommonFunc Ver 20080717 以降で、各モジュールのテーマ下テンプレートに対応しています。
-- 各モジュールのテーマ下テンプレートは、[[モバイル テンプハウス:http://www.mc8.jp/HD/]] などで入手できます。
- HypCommonFunc Ver 20080720 以降で、携帯絵文字に対応しています。携帯三社とPCで絵文字の自動変換を行い、変換できない絵文字は画像で表示されます。
-- アーカイブ中の htp_common/html/images/emoji ディレクトリ以下を XOOPS_ROOT_PATH/images に忘れずアップロードしてください。
-- 詳しくは、[[Blog:携帯絵文字に対応してみた>UsersWiki:nao-pon/blog/2008-07-19]] や [[フォーラム:[HypCommonFunc] Ver 20080720 携帯絵文字に対応:http:///modules/forum/index.php?topic_id=2400]] を参照してください。

:&font(Red){注意事項};|
HypCommonFunc Ver 20080720 以降に含まれる SoftBankの絵文字を営利目的でホームページ、ソフトウェア、書籍等で利用される場合は、以下のアドレスから事前に連絡する必要があります。&br;
http://creation.mb.softbank.jp/web/web_privacy.html

** HTML 再構成用タグの説明 [#pdd0e0bc]
使用できるタグは、設定項目にある「HTML再構築用タグ設定」のキーワードを利用したタグなります。規定値では、次のタグが使えます。

|~開始タグ|~終了タグ|h
| <!--headerlogo--> | <!--/headerlogo--> |
| <!--headerbar--> | <!--/headerbar--> |
| <!--breadcrumbs--> | <!--/breadcrumbs--> |
| <!--leftcolumn--> | <!--/leftcolumn--> |
| <!--centerCcolumn--> | <!--/centerCcolumn--> |
| <!--centerLcolumn--> | <!--/centerLcolumn--> |
| <!--centerRcolumn--> | <!--/centerRcolumn--> |
| <!--content--> | <!--/content--> |
| <!--rightcolumn--> | <!--/rightcolumn--> |
| <!--footerbar--> | <!--/footerbar--> |
| BC:#EED2EE<!--HypKTaiIgnore--> | BC:#EED2EE<!--/HypKTaiIgnore--> |

"<!--HypKTaiIgnore-->" 以外のそれぞれのタグで囲まれた範囲が、XOOPS_TRUST_PATH/class/Hyp_common/ktairender/templates/default ディレクトリ内にある

- header.html [ページヘッダ]
- body.html   [コンテンツ部分(必要に応じて分割され、ページナビゲーションが付加されます)]
- footer.html [ページフッタ]

各ファイルの該当キーワードタグと置換され、「HTML再構築用タグ設定」の 各キーの 'above' の内容が前方に、'below' の内容が後方に挿入されます。

例外として、"<!--HypKTaiIgnore-->" と "<!--/HypKTaiIgnore-->" で囲まれた範囲は、出力から除去されます。((HypCommonFunc >= 20080626))

例えば、XOOPS Cube Legasy の "cube_default" テーマにおいて、"leftcolumn" を設定する場合は、theme.html に、次のような箇所があると思います

#code(html,nonumber){{
<{if $xoops_showlblock == 1}>
<td id="leftcolumn" class="leftcolumn">
<!-- Start left blocks loop -->
<{foreach item=block from=$xoops_lblocks}>
<div class="leftblockTitle"><{$block.title}></div>
<div class="leftblockContent"><{$block.content}></div>
<{/foreach}>
<!-- End left blocks loop -->
</td>
<{/if}>
}}

これを次のようにします。

#code(html,nonumber){{
<{if $xoops_showlblock == 1}>
<td id="leftcolumn" class="leftcolumn">
<!-- Start left blocks loop -->
<!--leftcolumn-->
<{foreach item=block from=$xoops_lblocks}>
<div class="leftblockTitle"><{$block.title}></div>
<div class="leftblockContent"><{$block.content}></div>
<{/foreach}>
<!--/leftcolumn-->
<!-- End left blocks loop -->
</td>
<{/if}>
}}

注意すべき点は、<{foreach ... }> 〜 <{/foreach}> を崩さないようにすることです。

また、携帯対応レンダーを使っている場合は、Smarty変数の &font(Blue){''$smarty.const.HYP_K_TAI_RENDER''}; が TRUE になりますので、この値で、場合分けができます。

このようにして、携帯対応レンダー用タグを仕込んだ "cube_default" テーマの theme.html が &ref(theme.html); です。参考にお使いください。

#code(theme.html)

** 設定 (hyp_preload.conf.php) [#gacdaf31]

"XOOPS_TRUST_PATH/class/hyp_common/preload/hyp_preload.conf.php" を編集して設定をします。該当ファイルがない場合は、同じディレクトリに含まれている "hyp_preload.conf.php.rename" をリネームしてください。

- hyp_preload.conf.php 内の携帯対応レンダー関連の設定項目
#code(php,nonumber){{
// 各機能のメインスイッチ (On = 1, Off = 0)
$this->use_k_tai_render      = 0; // 携帯対応レンダーを有効にする

/////////////////////////
// 携帯対応レンダー設定

// 携帯端末判定用 UA 正規表現
$this->k_tai_conf['ua_regex'] = '#(?:SoftBank|Vodafone|J-PHONE|DoCoMo|UP?.Browser)#';

// HTML再構築用タグ設定
$this->k_tai_conf['rebuilds'] = array(
	'headerlogo'    => array( 'above' => '<center>',
	                          'below' => '</center>'),
	'headerbar'     => array( 'above' => '<hr>',
	                          'below' => ''),
	'breadcrumbs'   => array( 'above' => '',
	                          'below' => ''),
	'leftcolumn'    => array( 'above' => '<hr>',
	                          'below' => ''),
	'centerCcolumn' => array( 'above' => '<hr>',
	                          'below' => ''),
	'centerLcolumn' => array( 'above' => '',
	                          'below' => ''),
	'centerRcolumn' => array( 'above' => '',
	                          'below' => ''),
	'content'       => array( 'above' => '<hr>',
	                          'below' => ''),
	'rightcolumn'   => array( 'above' => '<hr>',
	                          'below' => ''),
	'footerbar'     => array( 'above' => '',
	                          'below' => ''),
	'easylogin'     => array( 'above' => '<div style="text-align:center;font-size:0.9em">[ ',
	                          'below' => ' ]</div>'),
);

// 携帯用XOOPSテーマセット
$this->k_tai_conf['themeSet'] = 'ktai_default';

// 携帯用XOOPSテンプレートセット
$this->k_tai_conf['templateSet'] = '';

// 使用テンプレート
$this->k_tai_conf['template'] = 'default';

// インラインイメージのリサイズ最大ピクセル
$this->k_tai_conf['pictSizeMax'] = '200';

// インラインイメージを表示するホスト名(後方一致)
$this->k_tai_conf['showImgHosts'] = array('amazon.com', 'yimg.jp', 'yimg.com', 'ad.jp.ap.valuecommerce.com', 'ba.afl.rakuten.co.jp', 'assoc-amazon.jp', 'ad.linksynergy.com');

// リダイレクトスクリプトを経由しないホスト名(後方一致)
$this->k_tai_conf['directLinkHosts'] = array('amazon.co.jp', 'ck.jp.ap.valuecommerce.com');

// 外部リンク用リダイレクトスクリプト
$this->k_tai_conf['redirect'] = XOOPS_URL . '/class/hyp_common/redirect.php?l=';

// Easy login を有効にする
$this->k_tai_conf['easyLogin'] = 1;
// Easy login で IP アドレス帯域をチェックしない
$this->k_tai_conf['noCheckIpRange'] = 0;
// リンクメッセージ
$this->k_tai_conf['msg']['easylogin'] = '簡単ログイン';
$this->k_tai_conf['msg']['logout'] = 'ログアウト';

// 携帯対応レンダー設定 以上
/////////////////////////////
}}

** 各モジュールの対応など [#p8402e35]

各モジュールのテンプレート内でも、Smarty変数の &font(Blue){''Smarty変数の $smarty.const.HYP_K_TAI_RENDER''}; を使って、場合分けができます。

部分的に場合分けしてもいいですし、大胆に全体を

#pre(){{
<{if $smarty.const.HYP_K_TAI_RENDER}>
携帯の場合のテンプレート
<{else}>
PCの場合のテンプレート
<{/if}>
}}

とすることもできます。

*** d3forum [#j5f13651]

d3forum では、スパム対策のデフォルトフィルターで、ゲスト投稿時に JavaScript を利用してフィルタリングを行っていますが、このフィルターが有効になっていると、ゲストが携帯で投稿することができません。

そこで、携帯からのアクセスかを IP 帯域で判断して、携帯であると判断した場合は、フィルタリングを行わないフィルターを書いてみました。

- {{D3forumAntispamDefault_ktai.class.php}}

このファイルを、XOOPS_TRUST_PATH/modules/d3forum/class にアップロードし、[ d3forum の管理画面 - 一般設定 - SPAM投稿チェック用クラス ] に 「default_ktai」と指定してください。

*** mailbbs (写メールBBS) [#d0ec1420]

Version 2.3.6 で、携帯対応レンダーに対応しました。Ver 2.3.6 以降をお使いください。

- [[最新バージョンをCVSからダウンロード:http://cvs.sourceforge.jp/cgi-bin/viewcvs.cgi/hypweb/mailbbs.tar.gz?only_with_tag=MAIN&view=tar]]

*** yomi (Yomiサーチ) [#d820213d]

Version 0.89 にて、サイトバナーの表示に対応しました。

- [[最新バージョンをCVSからダウンロード:http://cvs.sourceforge.jp/cgi-bin/viewcvs.cgi/hypweb/yomi.tar.gz?only_with_tag=MAIN&view=tar]]

*** テンプレートでよく使う絵文字 (i-mode 基準) [#idd98a6b]

|TLEFT||||c
|~絵文字     |~絵文字コード  |~意味|~主な使用例|h
| ((i:f952)) | &#40;(i:f952)) |ペン|投稿する|
| ((i:f9be)) | &#40;(i:f9be)) |鉛筆|投稿数|
| ((i:f955)) | &#40;(i:f955)) |人型|投稿者|
| ((i:f8c4)) | &#40;(i:f8c4)) |家型|居住地・ホームページ|
| ((i:f95e)) | &#40;(i:f95e)) |時計|投稿日時|
| ((i:f982)) | &#40;(i:f982)) |New |最終更新・最新投稿|
//| ((i:)) | &#40;(i:)) |||

** 意見・要望 [#fe659f99]
- 意見要望を書くところが、あちこち探したがよくわからなかったのでここにコメント欄を作ってみました。 -- [[通りすがりさん]] &new{2008-08-17 (Sun) 10:16:25};
- 携帯判定にWILLCOMと、e-mobileを是非入れて欲しい。 -- [[通りすがりさん]] &new{2008-08-17 (Sun) 10:16:34};
- directLinkHosts に、Adsenseのgooglesyndication.comを入れて欲しい -- [[通りすがりさん]] &new{2008-08-17 (Sun) 10:32:53};
-- WILLCOM と e-mobile の端末の多くは、PCサイトブラウザを搭載していてほとんどのユーザーは、それでアクセスしているので、携帯対応はかえってユーザーの不利益になるという認識なのですが、如何でしょうか。(このあたり、私は詳しくないので間違っているかもしれません。)&br;Adsense対応に関しては、hyp_preload.conf.php にて設定していただければよいと思いますが、規定値に設定しておいたほうがよさそうなら加えておきます。 :-)  -- [[nao-pon]] &new{2008-08-17 (日) 21:38:06};

#comment


#navi(../../)

« Prev[5]  Next »[6]