【テーマ名 】 fb
【バージョン】 0.8
【作 成 者】 marine / mistgreen
【動作 環境】 XOOPS Cube Legacy 2.1x (HD1.04)、2.2
【ライセンス】 MIT
【公 開 日 】 2012-5-20
======================================================
説明(概要)
======================================================
XCL2.1x(HD1.04)・XCL2.2用テーマです。某F○cebook似のデザインを採用してみました。
基本構造をHTML5で作っていますが、IE対策のため少し工夫を加えています。 Xoops Cube Legacy 2.2 で動作確認しました。
下記サイトのテンプレートを流用してXoops用のテーマとした basic5 をベースとしていますが、デザインの関係上、横幅固定のテーマとなっています。基本、3カラム構成として作成しており、左カラムは固定で表示されますが、右カラムを利用しない場合は、2カラム表示も可能となっています。
http://www.onextrapixel.com/2011/09/12/create-a-responsive-web-design-template/ 左カラム上部には、xugj_assign プラグインを利用して、インストールされたモジュールに対応するメニューを自動表示するようにしています。
また、フッターにユーザーメニュー項目も自動表示するので、xoopsの互換モジュールである「メインメニュー」「ユーザーメニュー」を利用しない運用が可能となっています。
なお、このテーマでは実験的に機能拡張のためのプラグインを利用する設定としておりますので、解凍してできあがった fb フォルダ下にある up/plugin フォルダの modifier.xoops_blocktitleclass.php と modifier.xoops_blocktitleclassdel.php をサイトのプラグインディレクトリにコピーしてください。(必須です。)
このテーマについては MIT ライセンスとさせていただきます。
======================================================
説明(詳細)
======================================================
とりあえず、utf8とeucのlanguageファイルは用意しましたが、HTML5ということで utf8ベースで動作すると思います。eucでの動作は確認していません。
メニューは、Xoops Users Group Japan(XUGJ) で GIJOEさんが提唱された xugj_assign.php を利用したメニューを採用しています。
通常のメインメニューに表示されるのと同じ項目が自動で表示されるので、メニューの項目を編集する必要もありません。
http://www.xugj.org/modules/d3forum/index.php?topic_id=125 なお、同封しているものは、オリジナルの xugj_assign.php から少し変更しているので、xugj_assign_fb.php という名称に変更しています。
jQuery.js + jquery.jgrowlプラグインを利用して、画面遷移せずにリダイレクト表示できるので、スピーディーでセンスの良い表示が可能となっています。 なお、本テーマには、domifaraさん作成のphpファイルによるインクルード方法を用いております。
domifaraさん、ありがとうございます。(javascriptオフ時には、リダイレクトの文字などがボックス表示されます。)
jQueryについては、domifaraさんによるXCL2.2対応措置がとられており、jQueryの二重読み込み防止や他のjavascriptとのバッティングを可能な限り避ける仕組みが用いられております。 (xugj_already_js.php をXCL2.1対応版に差し替えております。)
【画面表示について】
基本は、左カラム、中央メイン・右カラムの3カラム表示となっており、表示幅は990pxです。
右カラムを表示しない設定とすると、2カラム表示となります。
画面上部のヘッダー部には、F○cebookに似た色合いで横一杯のバーが表示され、サイト名と検索窓が表示されるようになっています。
左カラムの上部には、ユーザーのアバターとユーザ名が表示され、その下にxugj_assignを用いたメインメニュー項目が表示されるようになっています。
======================================================
インストール
======================================================
インストールは通常テーマと同じですが、主要モジュールのテンプレートを本テーマに最適化させ、テーマ下テンプレートとして利用する設定が可能ですので、その場合+αの作業が必要となります。(+αの作業をしないと、エラーとなりますので、ご注意ください。)
まずは、解凍してできあがったフォルダ「fb」をFTPにてサイトのテーマ・ディレクトリへコピーしてください。(場合によっては、解凍したフォルダの階層が深くなっていることもありますので、ご注意ください。)
次に、以下の手順でテーマ下テンプレート利用のための作業とプラグインの追加作業を行ってください。
完了したら通常のテーマと同様、管理画面の「互換モジュール」「テーマの管理」でこのテーマを使用する設定としてください。
【テーマ下テンプレートが利用可能な場合】
ご利用になっている xoops がテーマ下テンプレート利用可能な場合は、本テーマディレクトリ下にある 「templates」ディレクトリに収納されたカスタマイズ済みのテンプレートを利用するようになります。
XOOPS X(Pack2011~)の場合、既にpreloadに「HypXoopsTplHook.class.php」が入っていますので、テーマ下テンプレートが利用可能となっています。
テーマ下テンプレートを利用する場合、xugj_date や xugj_block を利用しますので、本テーマ下の「up/plugin」フォルダに収納されている modifier.xugj_date.php と function.xugj_block.php をFTPにてサイトの「plugin」ディレクトリにコピーしてください。(既に存在する場合は不要)
「plugin」ディレクトリは、XCL2.1x と XCL2.2 では場所が違うのでご注意ください。
XCL2.1xの場合 /XOOPS_ROOT_PATH/class/smarty/plugins/
XCL2.2の場合 /XOOPS_TRUST_PATH/libs/smarty/plugins/ または
/XOOPS_TRUST_PATH/libs/smartyplugins/ (preload「HdXoopsTplHook.class.php」または「HypXoopsTplHook.class.php」を使っている場合、このディレクトリが優先となります。)
【テーマ下テンプレートが利用できない場合】
もし、テーマ下テンプレートを利用できない環境の場合、本テーマ下の「up/preload」フォルダにある HdXoopsTplHook.class.php をFTPにてサイトの「preload」ディレクトリに、本テーマ下の「up/plugin」フォルダにある resource.db.php をサイトの「plugin」ディレクトリにそれぞれコピーしてください。
なお、XOOPS X(Pack2011~)の場合、既にpreloadに「HypXoopsTplHook.class.php」が入っていますので、この作業は不要です。(「HypXoopsTplHook.class.php」は、「HdXoopsTplHook.class.php」の機能を最新版にしたものです。)
詳細はこちらを参照して下さい。
http://xoops.peak.ne.jp/md/news/index.php?page=article&storyid=450【テーマ下テンプレート利用可能だが、本テーマのテーマ下テンプレートを使いたくない場合】
逆に、本テーマ下のテンプレートを使いたくない場合は、テーマ下にある「templates」ディレクトリを削除してください。ただし、webphotoモジュール使用時のギャラリー表示などはできなくなります。
■理由:テーマ下テンプレート利用可能なxoops(HDやXOOPS X(Pack2011~)など)では、次の優先順位でテンプレートを読み込むため
1 テーマ下テンプレート
2 現在ActiveなDBテンプレート
3 Default(DB)テンプレート
テンプレートを変更しようとして、Altsysで「現在ActiveなDBテンプレート」をいくら修正しても、テーマ下テンプレートがある場合はそちらが優先されてしまうということに注意が必要です。
【prettyPhotoを利用する場合】
このテーマでは、jQuery のプラグインである prettyPhoto を利用するとお洒落なポップアップ画像表示ができるように設定しています。
ご利用になるには、同封している jQuery_Pretty.class.php をサイトのプリロードディレクトリにアップロードしてください。
xcl2.2の場合は、xoopsのcommonディレクトリに jQuery と一緒に prettyPhoto が入っていると思いますので、それで作動すると思います。もし、commonディレクトリに prettyPhoto がない場合は、このテーマに同封しているものをアップロードしてください。
利用しているプリロードはdomifaraさん作のもので、最新のものは次のurlとなります。(domifaraさん、感謝します。)
http://xodomifara.lolipop.jp/doxo/modules/d3downloads/index.php?page=singlefile&cid=3&lid=67【webphotoの利用について】
webphotoでprettyPhotoを利用する場合、webphotoの一般設定画面にて、次の設定を行ってください。
PopBoxを使用する 「いいえ」
LightBoxを使用する「いいえ」
一般設定画面にて設定する各種画像の大きさはデフォルトを想定しています。
一覧表示の表示タイプは、「テーブル表示」「説明文付きリスト表示」のいずれでも prettyPhoto が動作するように設定していますが、テーブル表示を選択した場合、テーブルではなく div(ボックス)を利用した表示としており、画面幅に応じてボックスが並ぶように設定していますので、テーブル表示時のカラム数欄の数値は意味をなしません。
なお、このテーマでは、webphotoモジュールを「webphoto」ディレクトリ名にて利用する場合を想定して、テンプレート等の設定を行っています。もし、違うディレクトリ名でご利用の場合は、別途カスタマイズが必要となりますので、ご了承ください。
======================================================
カスタマイズ
======================================================
【メニュー表示項目の変更】
このテーマでは、xugj_assign_phpを用いたメニュー表示を行いますが、インストールして初回表示した時に、メインメニュー表示する設定となっているメニュー項目を自動で引用してきます。(表示用のキャッシュファイルを自動作成して利用)
従って、モジュールの管理にてモジュールの表示名を変えたり、並び順を「0」として非表示指定した場合でも、テーマのメニュー表示は以前作成したキャッシュファイルを利用することから、変更した表示となりません。
そのような場合、FTPソフトを使って、cacheディレクトリ内の theme_fb_menus_****.php を削除してください。再度、サイトを表示した際に、新しくメニュー用のキャッシュファイルが自動生成されます。
なお、domifaraさん作成の「xugjメニューキャッシュリフレシュ 管理画面モジュール」を利用すると、FTPソフトを使わずにキャッシュファイルの削除ができるので、便利だと思います。(domifaraさん、ありがとうございます。)
http://xodomifara.lolipop.jp/doxo/modules/d3downloads/index.php?cid=2======================================================
バージョンアップ履歴
======================================================
2011-5-20 ver0.8
とりあえず公開してみる。
======================================================
お願い
======================================================
できましたら、当方のサイト掲示板(ご訪問帳)に何か書き込んでいただけると嬉しいです~m(_ _)m
http://xoops123.com/modules/d3forum/?forum_id=1