Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
新・Magentoカスタマイズ入門 
Magento-JP User Group 西 宏和
Agenda 
• Magentoのディレクトリ構造 
• コードプールとinclude_path 
• フォールバック 
• 1.9での変更箇所 
• デザインカスタマイズ
Magentoのディレクトリ構造 
app code core コアコード 
community コミュニティコード 
local ローカルコード 
design frontend 公開側テンプレート等 
adminhtml 管理側テンプレート...
テンプレートだけ拡大 
app design frontend default default layout レイアウトXML 
locale テーマ固有ロケール 
etc 設定ファイル 
template テンプレートファイル 
foo ba...
カスタマイズする前に理解しておくこと 
• コードプール 
• include_path 
• コードプールに影響されないもの 
• レイアウトの概念 
• フォールバック
コードプール 
app code core コアコード 
community コミュニティコード 
local ローカルコード 
lib 共通ライブラリ
include_path
include_path 
コンパイラ有効時の処理
include_path 
コンパイラ有効時の処理 
通常の処理
対象外 
• エクステンションの設定ファイルは 
include_pathの対象外 
• app/etc/modulesの中にあるXML 
で定義されている 
• Mage_Core_Model_Config::getM 
oduleDirを参...
対象外 
• エクステンションの設定ファイルは 
include_pathの対象外 
• app/etc/modulesの中にあるXML 
で定義されている 
• Mage_Core_Model_Config::getM 
oduleDirを参...
基本的なMagentoのレイアウト構造
基本的なMagentoのレイアウト構造
基本的なMagentoのレイアウト構造
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能 
mytheme/mytheme
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能 
mytheme/mytheme
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能 
mytheme/mytheme 
mytheme/default
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能 
mytheme/mytheme 
mytheme/default
フォールバック 
• 現在のテーマに存在しないファイ 
ルを、親テーマに遡って使用する 
仕組み 
• テンプレート・レイアウトXML・ 
スキンで利用可能 
mytheme/mytheme 
mytheme/default 
base/def...
1.9での変更点 
• theme.xmlの導入 
• フォールバック機構の仕様変更
親テーマ・子テーマ 
• theme.xmlを記述することで、任意 
のテーマを親テーマとして指定可能 
<?xml version="1.0"?> 
<theme> 
<parent>rwd/default</parent> 
</theme...
フォールバック機構の仕様変更 
• 1.8までは、 
• 現在テーマ → 現在テーマのデフォルト → base/default 
• 1.9からは、 
• 現在テーマ → 親テーマ or デフォルト → base/default
Magentoのリクエストフロー
Varien_Object 
• ArrayObjectを拡張したMagentoでよく使われるオブジェクト 
• getXxx, setXxx等が既に実装されているので、データ入れとしてよく使われ 
ている 
• BlockやHelper、Mo...
レイアウトXML 
• Magento独自の画面レイアウト定義用XMLファイル 
• これを知らなくちゃデザインカスタマイズは始まらない 
• 定義単位はエクステンション単位だが、1ファイルに複数画面の定義を記述可 
能 
• メールテンプレー...
レイアウトXMLで使用するタグ 
• block 
• reference 
• action 
• update 
• remove 
• label 
• actionのパラメータタグ
block 
• レイアウト上にブロックを追加 
• typeまたはclass属性でブロッククラスを指定 
• name属性でレイアウト上のブロック名を指定(重複しないように) 
• as属性でnameの別名を設定可能 
• before / ...
reference 
• 既にそのレイアウトで定義されているblockを参照する 
• nameでブロック名を指定 
• action、blockを記述可
update 
• 既に定義してあるレイアウトを読み込む 
• 読み込んだ後でreferenceを使って追加・変更が可能 
• handle属性にレイアウト定義名を指定する
remove 
• 既に定義されているブロックをレイアウト上から削除する 
• name属性にブロック名を指定する 
• 削除後、同名で再定義も可能
action 
• ブロックのクラスに定義されているpublicメソッドを実行する 
• 子要素にパラメータを指定可能 
• ifconfig属性を使うことで、実行の制御が可能 
• blockの違いを知る
カスタマイズの実例
CSSやJSの追加 
• page/html_headブロックの子要素で以下のような記述をすればOK 
• <action method=“addJs"><script>mage/cookies.js</script></action> 
• ...
静的ブロックの埋め込み 
<block type="cms/block" name=“my_custom_block”> 
<action method=“setBlockId"> 
<block_id>my_custom_block</blo...
Upcoming SlideShare
Loading in …5
×

第2回 Magento cafe plus 〜新・Magentoカスタマイズ入門

2,546 views

Published on

第2回 Magento cafe plusの資料です。
主にディレクトリ構成、レイアウトXMLなどについて解説しています。

Published in: Software
  • Be the first to comment

第2回 Magento cafe plus 〜新・Magentoカスタマイズ入門

  1. 1. 新・Magentoカスタマイズ入門 Magento-JP User Group 西 宏和
  2. 2. Agenda • Magentoのディレクトリ構造 • コードプールとinclude_path • フォールバック • 1.9での変更箇所 • デザインカスタマイズ
  3. 3. Magentoのディレクトリ構造 app code core コアコード community コミュニティコード local ローカルコード design frontend 公開側テンプレート等 adminhtml 管理側テンプレート等 etc 設定ファイル locale ロケールファイル lib 共通ライブラリ js 共通javascriptファイル skin frontend 公開側スキン adminhtml 管理側スキン
  4. 4. テンプレートだけ拡大 app design frontend default default layout レイアウトXML locale テーマ固有ロケール etc 設定ファイル template テンプレートファイル foo bar ・・・以下略
  5. 5. カスタマイズする前に理解しておくこと • コードプール • include_path • コードプールに影響されないもの • レイアウトの概念 • フォールバック
  6. 6. コードプール app code core コアコード community コミュニティコード local ローカルコード lib 共通ライブラリ
  7. 7. include_path
  8. 8. include_path コンパイラ有効時の処理
  9. 9. include_path コンパイラ有効時の処理 通常の処理
  10. 10. 対象外 • エクステンションの設定ファイルは include_pathの対象外 • app/etc/modulesの中にあるXML で定義されている • Mage_Core_Model_Config::getM oduleDirを参照
  11. 11. 対象外 • エクステンションの設定ファイルは include_pathの対象外 • app/etc/modulesの中にあるXML で定義されている • Mage_Core_Model_Config::getM oduleDirを参照
  12. 12. 基本的なMagentoのレイアウト構造
  13. 13. 基本的なMagentoのレイアウト構造
  14. 14. 基本的なMagentoのレイアウト構造
  15. 15. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能
  16. 16. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能 mytheme/mytheme
  17. 17. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能 mytheme/mytheme
  18. 18. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能 mytheme/mytheme mytheme/default
  19. 19. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能 mytheme/mytheme mytheme/default
  20. 20. フォールバック • 現在のテーマに存在しないファイ ルを、親テーマに遡って使用する 仕組み • テンプレート・レイアウトXML・ スキンで利用可能 mytheme/mytheme mytheme/default base/default
  21. 21. 1.9での変更点 • theme.xmlの導入 • フォールバック機構の仕様変更
  22. 22. 親テーマ・子テーマ • theme.xmlを記述することで、任意 のテーマを親テーマとして指定可能 <?xml version="1.0"?> <theme> <parent>rwd/default</parent> </theme>
  23. 23. フォールバック機構の仕様変更 • 1.8までは、 • 現在テーマ → 現在テーマのデフォルト → base/default • 1.9からは、 • 現在テーマ → 親テーマ or デフォルト → base/default
  24. 24. Magentoのリクエストフロー
  25. 25. Varien_Object • ArrayObjectを拡張したMagentoでよく使われるオブジェクト • getXxx, setXxx等が既に実装されているので、データ入れとしてよく使われ ている • BlockやHelper、Modelはこのクラスを継承して実装されている
  26. 26. レイアウトXML • Magento独自の画面レイアウト定義用XMLファイル • これを知らなくちゃデザインカスタマイズは始まらない • 定義単位はエクステンション単位だが、1ファイルに複数画面の定義を記述可 能 • メールテンプレートの一部パーツもレイアウトXMLで定義されている
  27. 27. レイアウトXMLで使用するタグ • block • reference • action • update • remove • label • actionのパラメータタグ
  28. 28. block • レイアウト上にブロックを追加 • typeまたはclass属性でブロッククラスを指定 • name属性でレイアウト上のブロック名を指定(重複しないように) • as属性でnameの別名を設定可能 • before / after 属性で追加位置を調整可能 • ネスト可
  29. 29. reference • 既にそのレイアウトで定義されているblockを参照する • nameでブロック名を指定 • action、blockを記述可
  30. 30. update • 既に定義してあるレイアウトを読み込む • 読み込んだ後でreferenceを使って追加・変更が可能 • handle属性にレイアウト定義名を指定する
  31. 31. remove • 既に定義されているブロックをレイアウト上から削除する • name属性にブロック名を指定する • 削除後、同名で再定義も可能
  32. 32. action • ブロックのクラスに定義されているpublicメソッドを実行する • 子要素にパラメータを指定可能 • ifconfig属性を使うことで、実行の制御が可能 • blockの違いを知る
  33. 33. カスタマイズの実例
  34. 34. CSSやJSの追加 • page/html_headブロックの子要素で以下のような記述をすればOK • <action method=“addJs"><script>mage/cookies.js</script></action> • <action method=“addCss"><stylesheet>css/styles.css</stylesheet></action> • <action method=“addItem"><type>skin_js</type><name>js/lib/jquery-1.10.2.min.js</name></action> • <action method="addItem"><type>skin_css</type><name>css/styles-ie8.css</name><params/><if><![CDATA[ (lte IE 8) & (!IEMobile)]]></if></action> • <action method="addLinkRel"><rel>stylesheet</rel><href>//fonts.googleapis.com/css?family=Raleway: 300,400,500,700,600</href></action>
  35. 35. 静的ブロックの埋め込み <block type="cms/block" name=“my_custom_block”> <action method=“setBlockId"> <block_id>my_custom_block</block_id> </action> <action method=“setCacheLifetime"> <cache_lifetime>86400</cache_lifetime> </action> <action method=“setCacheKey"> <cache_key>header_slogan_block</cache_key> </action> </block>

×