hypweb.net
XOOPSマニア  最新情報のRSS(サイト全体)
[ 自宅サーバーWebRing |ID=54 前後5表示乱移動サイト一覧 ]

17年5月30日(Tue) 12時32分
TOP » xpWiki::Dev » keyword » HypCommonPreLoad » KtaiRender » テーマ調整

XOOPSテーマ調整 anchor.png Edit

HypCommonFunc Ver 20080717 以降では、デフォルトで携帯対応レンダー専用のテーマセット(ktai_default)を使用し、各モジュールのテーマ下テンプレートに対応しています。

携帯対応レンダー専用のテーマセットを使用する場合は、テーマの調整は不要です。

一方、携帯対応レンダー専用のテーマセットを使用しない場合は、設定で

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

とします。その場合は、通常のテーマセットが使用されます。

通常使用するテーマセットが DIVレイアウトの場合は、そのままでもある程度、携帯で見やすい形で表示されますが、TABLE レイアウトの theme では、コンテンツ部分を先に表示したりと、HTMLの再構成をしないと、実用的でない場合があります。

HTML の再構成をする場合は、携帯対応レンダーが適切に部分抽出できるように、簡単なタグを仕込む必要があります。

Page Top

HTML 再構成用タグの説明 anchor.png Edit

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

開始タグ終了タグ
<!--headerlogo--><!--/headerlogo-->
<!--headerbar--><!--/headerbar-->
<!--breadcrumbs--><!--/breadcrumbs-->
<!--leftcolumn--><!--/leftcolumn-->
<!--centerCcolumn--><!--/centerCcolumn-->
<!--centerLcolumn--><!--/centerLcolumn-->
<!--centerRcolumn--><!--/centerRcolumn-->
<!--content--><!--/content-->
<!--rightcolumn--><!--/rightcolumn-->
<!--footerbar--><!--/footerbar-->
<!--HypKTaiIgnore--><!--/HypKTaiIgnore-->

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

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

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

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

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

Everything is expanded.Everything is shortened.
 
 
 
 
 
 
 
 
 
 
<{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}>

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

Everything is expanded.Everything is shortened.
 
 
 
 
 
 
 
 
 
 
 
 
<{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変数の $smarty.const.HYP_K_TAI_RENDER が TRUE になりますので、この値で、場合分けができます。

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

filetheme.html
Everything is expanded.Everything is shortened.
  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
-
|
!
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<{$xoops_langcode}>" lang="<{$xoops_langcode}>">
<head>
<meta http-equiv="content-type" content="text/html; charset=<{$xoops_charset}>" />
<meta http-equiv="content-style-type" content="text/css" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-language" content="<{$xoops_langcode}>" />
<meta name="robots" content="<{$xoops_meta_robots}>" />
<meta name="keywords" content="<{$xoops_meta_keywords}>" />
<meta name="description" content="<{$xoops_meta_description}>" />
<meta name="rating" content="<{$xoops_meta_rating}>" />
<meta name="author" content="<{$xoops_meta_author}>" />
<meta name="copyright" content="<{$xoops_meta_copyright}>" />
<meta name="generator" content="XOOPS Cube" />
<link rel="shortcut icon" href="<{$xoops_url}>/favicon.ico" />
<link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_url}>/xoops.css" />
 
<{* If you change standard Legacy theme structure removing style*.css from the theme directory, you have to remove the following; *}>
<{if $xoops_themecss != ""}>
  <link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_themecss}>" />
<{/if}>
 
<title><{$xoops_sitename}> - <{$xoops_pagetitle}></title>
<!-- RMV: added module header -->
<{$xoops_module_header}>
<script type="text/javascript">
<!--
<{$xoops_js}>
// -->
</script>
</head>
<body>
<div class="outline">
<table cellspacing="0">
<tr>
<td class="headerlogo">
<!--headerlogo--><a href="<{$xoops_url}>/"><img src="<{$xoops_imageurl}>images/logo.gif" width="200" height="100" alt="<{$xoops_sitename}>" title="<{$xoops_sitename}>" /></a><!--/headerlogo--></td>
<td class="headerbanner"><{$xoops_banner}></td>
</tr>
</table>
<!--headerbar-->
<{if $smarty.const.HYP_K_TAI_RENDER}>
<center>
<{/if}>
<div class="headerbar">Welcome <{if $xoops_isuser}><{$xoops_uname}><{else}>Guest<{/if}>&nbsp;</div>
<{if $smarty.const.HYP_K_TAI_RENDER}>
[ <a href="#leftcolumn">Main menu</a> ]
</center>
<{/if}>
<!--/headerbar-->
 
<table cellspacing="0">
<tr>
<{if $xoops_showlblock == 1}>
<td id="leftcolumn" class="leftcolumn">
<!-- Start left blocks loop -->
<!--leftcolumn-->
<{if $smarty.const.HYP_K_TAI_RENDER}><div id="leftcolumn"><{/if}>
<{foreach item=block from=$xoops_lblocks}>
<div class="leftblockTitle"><{$block.title}></div>
<div class="leftblockContent"><{$block.content}></div>
<{/foreach}>
<{if $smarty.const.HYP_K_TAI_RENDER}></div><{/if}>
<!--/leftcolumn-->
<!-- End left blocks loop -->
</td>
<{/if}>
 
<td id="centercolumn" class="centercolumn">
<{if $xoops_showcblock == 1}>
<table cellspacing="0">
<tr>
<td class="centerCcolumn" colspan="2">
<!--centerCcolumn-->
<{foreach item=block from=$xoops_ccblocks}>
<div class="centeroutline">
<div class="centerCblockTitle"><{$block.title}></div>
<div class="centerCblockContent"><{$block.content}></div>
</div>
<{/foreach}>
<!--/centerCcolumn-->
</td>
</tr>
<tr>
<td class="centerLcolumn">
<!--centerLcolumn-->
<{foreach item=block from=$xoops_clblocks}>
<div class="centeroutline">
<div class="centerLblockTitle"><{$block.title}></div>
<div class="centerLblockContent"><{$block.content}></div>
</div>
<{/foreach}>
<!--/centerLcolumn-->
</td>
<td class="centerRcolumn">
<!--centerRcolumn-->
<{foreach item=block from=$xoops_crblocks}>
<div class="centeroutline">
<div class="centerRblockTitle"><{$block.title}></div>
<div class="centerRblockContent"><{$block.content}></div>
</div>
<{/foreach}>
<!--/centerRcolumn-->
</td>
</tr>
</table>
<{/if}>
<!--content-->
<div class="content"><{$xoops_contents}></div>
<!--/content-->
</td>
 
<{if $xoops_showrblock == 1}>
<td id="rightcolumn" class="rightcolumn">
<!--rightcolumn-->
<{foreach item=block from=$xoops_rblocks}>
<div class="rightblockTitle"><{$block.title}></div>
<div class="rightblockContent"><{$block.content}></div>
<{/foreach}>
<!--/rightcolumn-->
</td>
<{/if}>
</tr>
</table>
 
<div class="footerbar">
<!--footerbar-->
<a href="http://xoopscube.sourceforge.net/"><img src="<{$xoops_imageurl}>images/poweredby.gif" width="287" height="10" alt="XOOPS Cube PROJECT" title="XOOPS Cube PROJECT" /></a><br />
<{if $xoops_footer != 'Powered by XOOPS Cube 2.1&copy; 2001-2006 <a href="http://xoopscube.sourceforge.net/" target="_blank">XOOPS Cube Project</a>'}><{$xoops_footer}><{/if}>
<!--/footerbar-->
</div>
 
</div>
</body>
</html>


*1 HypCommonFunc >= 20080626

新しくコメントをつける

題名
ゲスト名
投稿本文

より詳細なコメント入力フォームへ

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード印刷に適した表示   ページ新規作成 全ページ一覧 単語検索 最新ページの一覧   ヘルプ   最新ページのRSS 1.0 最新ページのRSS 2.0 最新ページのRSS Atom Powered by xpWiki
Counter: 6207, today: 2, yesterday: 3
初版日時: 2008-09-16 (火) 15:05:54
最終更新: 2008-09-16 (火) 15:05:54 (JST) (3177d) by nao-pon
このページのTopへ
ログイン
ユーザ名:

パスワード:

オートログイン

Basic 認証 | SSLログイン

新規登録 | パスワード紛失



メインメニュー
付箋機能 (xpwiki)
付箋メニュー 
付箋の編集
文字色: 背景色:
お名前:  線接続id:
 
MenuBar (xpwiki)
ブックマーク
オンサイトブックマークは
ログインするとご利用になれます
[ログインする]
サイト内 Wiki
☆ 検索 ☆



高度な検索(サイト内)
FireFox検索プラグイン
オンライン状況
合計 40 人がオンライン中 :-)
(xpWiki::Dev : 6 人)

登録ユーザ: 0 & ゲスト: 40

もっと...
サイト情報
管理人

nao-pon
 

登録ユーザ数: 4435


Web Services by Yahoo! JAPAN
楽天ウェブサービスセンター
Amazon.co.jpアソシエイト
現在ページのQRコード
現在ページのQRコード
[携帯対応]
参照元情報
参照なし