XoopsCubeLegacy テーマ : vgrid2 バージョン: 1.00 掲載日: 2011-6-11 説明 XCL(HD1.04)・XCL2.2用のテーマです。
Xoops Cube Legacy 2.17 (HD1.04) ja_utf8 と XCL2.2 で動作確認しました。
カラフルな vgrid に対して、vgrid2は、シックなデザインで可変グリッドレイアウトのテーマとしました。
jQuery等のjavascriptを利用しているので、javascript許可環境にて閲覧することを前提としています。
デザインは、いわゆるリキッドデザインで、ウィンドウ幅に応じて各ブロックが並び変わりますので、どんなウィンドウサイズで閲覧しても縦スクロールだけで情報閲覧が可能となっています。
横幅480px以下になると 1カラムのデザインに変わります。(IE以外のモダンブラウザ)
他のテーマと同じく、xugj_assign.phpを用いた上部メニューを採用しており、メインメニュー項目を自動で表示します。
domifaraさんがモディファイされた
XCL2.2RC2 を気軽に試せるローカル環境 WARP 公開!
http://www.xugj.org/modules/d3forum/index.php?topic_id=1122#post_id6351内にある Sakura をベースに作成しました。
下記リンク先のブログに掲載された可変グリッドレイアウトを実現する jQuery のプラグインを利用して、Xoopsには珍しい可変グリッドのテーマが出来上がりました。(ありがとうございます。>作者様)
http://blog.xlune.com/2009/09/jqueryvgrid.html
可変グリッドを実現するにあたり、従来のメインカラムやサイドカラムを廃し、全体をくるむラッパーの下にdivでくるんだブロックを配置しております。
ウィンドウ幅に応じて、ブロックの配置も変わりますので、思い通りの表示にするのは少々難しいかもしれませんが、色々とお試しください。
utf8とeucのlanguageファイルを用意しましたので、eucでも動作すると思います。
(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_vgrid2.php という名称に変更しています。
jQuery.js + jquery.jgrowlプラグインを利用して、画面遷移せずにリダイレクト表示できるので、スピーディーでセンスの良い表示が可能となっています。
なお、本テーマには、domifaraさん作成のphpファイルによるインクルード方法を用いております。
domifaraさん、ありがとうございます。
(javascriptオフ時には、リダイレクトの文字などがボックス表示されます。)
jQueryについては、domifaraさんによるXCL2.2対応措置がとられており、jQueryの二重読み込み防止や他のjavascriptとのバッティングを可能な限り避ける仕組みが用いられております。
(xugj_already_js.phpをXCL2.1対応版に差し替えております。)
インストール インストールは通常のテーマと同様です。
解凍してできあがったディレクトリ(vgrid2)をサイトのテーマ・ディレクトリへコピーして、管理画面の「互換モジュール」「テーマの管理」でこのテーマを使用する設定としてください。
このテーマをインストールして初回表示した時に、メインメニューの内容からメニュー項目を自動で引用してきます。
その後、項目名を変えたりした場合、タブメニューの名称が自動で変わらない場合は・・・FTPソフトを使って、cacheフォルダ内の theme_vgrid_menus_****.php を削除してください。再度、サイトを表示した際に、新しくメニュー用のキャッシュファイルが自動生成されます。
別途、domifaraさん作成の「xugjメニューキャッシュリフレシュ 管理画面モジュール」を利用すると、FTPソフトを使わずにキャッシュファイルの削除ができるので、便利でしょう。(domifaraさん、ありがとうございます。)
http://xodomifara.lolipop.jp/doxo/modules/d3downloads/index.php?cid=2 カスタマイズ bodyには、ディレクトリ名に応じたclassが付加される設定となっておりますので、各ディレクトリ(モジュール)ごとの背景色やdiv幅など、自由な設定が可能となっております。
また、主要モジュールの項目で表示に支障の出る箇所は、テーマ下テンプレートと modules.css などを調整して、予め問題が出ないようにしていますが、すべての項目を確認した訳ではありませんので、その点はご了承願います。
style.cssとmodules.cssにて、色々と設定変更等をお試しください。
ウィンドウサイズ480px以下の表示については、iPhone.cssを編集してください。
バージョンアップ履歴2011-6-6 ver1.00
vgridを改造してシンプルな構造に変更、公開。
お願いできましたら、掲示板(ご訪問帳)
http://xoops123.com/modules/d3forum/?forum_id=1 に何か書き込んでいただけると嬉しいです~m(_ _)m