スタッフブログ
こんにちわ。 なおとです。
テンプレートの使いこなしテクニックを紹介します。 やや上級向けですが、ぜひ見てください。
xugj_blockとpicoのコンテンツ表示ブロックを組み合わせる例
カスタマイズの例として、2つ取り上げます。
- 目的1 サイトのヘッダー部分をテーマから分離する
- 目的2 D3ブログで、常に表示するコンテンツを追加する
picoのメリット
今回ここで紹介する手法を使わなくても、いくつか別の方法で同じようなことができます。 それに対してpicoを活用する方法によるメリットを、挙げてみましょう。
- Smartyのテンプレート機能を活用できる
- 編集履歴が残る
- 権限管理を細かく設定することができる
- など
このうち権限管理は、主にサイト管理やコンテンツ管理を複数人で行う場合の利点です。
コンテンツのパーツを、picoのあるカテゴリにまとめておきます。 すると「カテゴリーアクセス権限」で特定のグループやユーザーに、編集権限を設定することもできます。 モジュールの管理者権限を渡さずに、つまり管理者メニューにアクセスできなくても、コンテンツを管理できるのです。
xugj_block
カスタマイズの肝になるのは、「xugj_block」の利用です。 xugj_blockについての詳しい説明は今回の趣旨とは外れますが、簡単に言うと「ブロックを自在に表示できるようになるSmartyプラグイン」です。 ただしXOOPSの標準的な機能ではなく、プラグインを追加する必要があります。
- カスタムテンプレート
- テンプレート
- テーマ
- picoのコンテンツ
といった部分を編集する際に使えます。
SourceForge.net function.xugj_block.php
上記のリンクからダウンロードできるほか、ホダ塾ディストリビューションであれば含まれていますので、追加インストールの必要はありません。
自分でインストールする場合は、 xoops_trust_path/libs/smartyplugins/function.xugj_block.php もしくは html/class/smarty/plugins/function.xugj_block.php に配置します。作業前の時点でxoops_trust_path/libsが空であるなら、html/class/smarty/plugins/を使った方が手軽でしょう。
カスタムテンプレート
xugj_blockは非常に「使い出」があり、オプションなどの記述もかなり複雑です。 使うたびに長い記述をするのはミスを招きます。 そのため今回は、「カスタムテンプレート」を使って、簡単に書けるようにします。
<{xugj_block func="b_pico_content_show" options="pico|12||1" file="/modules/pico/blocks/blocks.php"}>
このような記述をするところを、picoのdirnameが標準的な「pico」であるならば、最低限度として、content_idだけ指定すれば動きます。
<{include file="db:_custom_xugj_block_pico.html" content_id="12"}>
こうなります。「db:_custom_xugj_block_pico.html」部分は固定ですので、最後の数字だけ変えればいいことが解かります。
カスタムテンプレート作成
カスタムテンプレートというものが出てきました。 これはALTSYSモジュールを使って作成します。
今回はテンプレート名「_custom_xugj_block_pico.html」として説明します。 実際にはファイルではなく、データベース内にのみ作成されます。なのでファイルを探してもありません。
作成するときは「新規カスタムテンプレート作成」リンクを、既に作成済のテンプレートを編集する場合は、「編集」リンクです。
<{* xugj_block pico.content_block ここから *}> <{assign var="picoDirname" value=$picoDirname|default:"pico"}> <{assign var="content_id" value=$content_id|default:"1"}> <{assign var="this_template" value=$this_template|default:""}> <{assign var="process_body_yes" value=$process_body_yes|default:"1"}> <{capture assign="xugj_block_options"}><{strip}> <{$picoDirname}>|<{$content_id}>|<{$this_template}>|<{$process_body_yes}> <{/strip}><{/capture}> <{capture assign="xugj_block_file"}><{strip}> /modules/<{$picoDirname}>/blocks/blocks.php <{/strip}><{/capture}> <{xugj_block func="b_pico_content_show" options=$xugj_block_options file=$xugj_block_file}> <{* xugj_block pico.content_block ここまで *}>
ここまででまだ、準備も半ばです。
コンテンツの作成
次に、コンテンツの「パーツ」を作成します。
「サイトのヘッダー部分」「D3ブログで、常に表示するコンテンツ」の2つです。
picoの扱いに付いては説明を省きます。 うさぎにもできるXOOPS Cube入門♪ - モジュールを使おうpico編を参考にしてください。
注意点として、オプションで「表示」のチェックを付けてください。 これを忘れると、ゲスト(ログイン前の状態)に対して正常な表示ができません。 ほかに適宜、アクセス権現の設定を見直してください。ゲストにpicoモジュールのアクセスを許可する必要があります。
目的1 サイトのヘッダー部分をテーマから分離する
そして次に、テーマの編集です。 「default」テーマを使っていて、またDBテーマ編集モジュールを使う場合の例を挙げますが、ここは特に決まりはなく、基本的にどのテーマでも可能ですし、直接テーマ・ファイルを修正しても構いません。(その方が手順はシンプルになるかもしれません。)
目的2 D3ブログで、常に表示するコンテンツを追加する
次にD3ブログのテンプレートを修正します。 修正するテンプレート名は「d3blog_inc_header.html」です。(d3blogというdirnameでインストールしている場合)
以上で修正箇所は終わりです。
プラスαの応用編
最後に、プラスαの技を紹介します。 pico側で作成したコンテンツを全て表示する替わりに、「続きを読む」形式で省略表示する方法です。
次の内容でカスタムテンプレートを作成(_custom_pico_short)し、
<{include file="db:_custom_pico_short" content_id="12" truncate_num="100"}>
のように呼び出して使います。
<{* xugj_block pico.content_block ここから *}> <{assign var="picoDirname" value=$picoDirname|default:"pico"}> <{assign var="content_id" value=$content_id|default:"1"}> <{assign var="this_template" value=$this_template|default:""}> <{assign var="process_body_yes" value=$process_body_yes|default:"1"}> <{assign var="truncate_num" value=$truncate_num|default:"30"}> <{capture assign="xugj_block_options"}><{strip}> <{$picoDirname}>|<{$content_id}>|<{$this_template}>|<{$process_body_yes}> <{/strip}><{/capture}> <{capture assign="xugj_block_file"}><{strip}> /modules/<{$picoDirname}>/blocks/blocks.php <{/strip}><{/capture}> <{xugj_block item="xugj_block_pico" func="b_pico_content_show" options=$xugj_block_options file=$xugj_block_file}> <{$xugj_block_pico.content.body|mb_truncate:$truncate_num}> <a href="<{$xugj_block_pico.mod_url}>/<{$xugj_block_pico.content.link}>">続きを読む</a> <{* xugj_block pico.content_block ここまで *}>