sugarcrm勉強会#003 新テーマシステムを読み解く
TRANSCRIPT
![Page 1: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/1.jpg)
Sugar 5.5 新テーマシステムを読み解くCogniTom Academic Design
2009年11月25日水曜日
![Page 2: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/2.jpg)
GUIで出来ること
ロゴの設定 (以前のバージョンから可) 使用可能なテーマを限定
NEW!
2009年11月25日水曜日
![Page 3: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/3.jpg)
What’s new?
• まっとうなHTMLに近づいた!• テンプレートエンジンXTemplate → Smarty
• 継承可能なテーマシステム(SugarThemeクラス)
0
50
100
150
200
250
300
Sugar 5.2
Sugar 5.5
HTMLエラー
2009年11月25日水曜日
![Page 4: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/4.jpg)
5.2 5.5
2009年11月25日水曜日
![Page 5: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/5.jpg)
テーマファイルの構成Sugar 5.2 Sugar 5.5 備考
config.php themedef.php テーマの定義 (名称・機能対応など)
header.html tpls/ Smartyテンプレート
images/ images/ アイコンなどの画像
各種CSSファイル css/ スタイルをcssディレクトリに集約
style.js js/style.js YUIベースに
header.php 廃止へ SugarView::displayHeader()
footer.php 廃止へ SugarView::displayFooter()
layout_utils.php 廃止へ
2009年11月25日水曜日
![Page 6: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/6.jpg)
5.2 5.5
2009年11月25日水曜日
![Page 7: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/7.jpg)
テンプレートの継承• テーマ「SugarIE6」の場合• custom/themes/SugarIE6/tpls/ ← 子テーマのカスタマイズ
• themes/SugarIE6/tpls/ ← 子テーマ
• custom/themes/Sugar/tpls/ ← 親テーマのカスタマイズ
• themes/Sugar/tpls/ ← 親テーマ
• custom/themes/default/tpls/ ← デフォルトテーマのカスタマイズ
• themes/default/tpls/ ← デフォルトテーマ
2009年11月25日水曜日
![Page 8: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/8.jpg)
テンプレートの継承
default
Sugar
SugarIE6 子テーマcustom
custom
custom
孫テーマも可
親テーマ
デフォルトテーマ
優先度
2009年11月25日水曜日
![Page 9: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/9.jpg)
JavaScriptの継承
default
Sugar
SugarIE6
custom+
+
+
custom+
custom+
cache/theme/SugarIE6/js/style.js
minified
※ただし開発者モードではミニファイされない
2009年11月25日水曜日
![Page 10: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/10.jpg)
CSSの継承
default
Sugar
SugarIE6
custom+
+
+
custom+
custom+
cache/theme/SugarIE6/css/style.css
minified
※ただし開発者モードではミニファイされない
2009年11月25日水曜日
![Page 11: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/11.jpg)
CSS (スタイルと色とフォント)
•style.css• print.css• chart.css• yui.css• color.<色>.css ←色に関する記述はここに
• font.<フォント>.css ←フォントサイズに関する記述はここに
$themedef = array( 'name' => "Sugar", 'description' => "Sugar", 'colors' => array("sugar","red","green","blue","purple","gray"), 'fonts' => array("normal", "larger", "largest"), 'group_tabs' => true, );
2009年11月25日水曜日
![Page 12: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/12.jpg)
画像の呼出しCSSの場合div.sample { background-image: url(../../../../index.php entryPoint=getImage&imageName=sampleImage.gif);}
HTMLの場合<img src=”index.php? entryPoint=getImage&imageName=sampleImage.gif” />
PNGもOK!
2009年11月25日水曜日
![Page 13: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/13.jpg)
テーマ作成にチャレンジ1. 下準備a. 既存のテーマをコピーして配置b. 名称などを設定 → themedef.phpc. 不要なファイルを削除2. テーマ作成a. 新規テーマを選んでログインb. 開発者モードをONにc. CSSとSmartyテンプレートを書き換え(書き換えと、ブラウザの再読込を繰り返す...)
3. パッケージ化2009年11月25日水曜日
![Page 14: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/14.jpg)
デフォルトテーマのみ適用した状態
2009年11月25日水曜日
![Page 15: SugarCRM勉強会#003 新テーマシステムを読み解く](https://reader034.vdocuments.pub/reader034/viewer/2022052316/558df6131a28abdf1c8b456c/html5/thumbnails/15.jpg)
サンプルとして作成したテーマ
2009年11月25日水曜日