How to Develop a Basic Magento Extension Tutorial
-
Upload
hendy-irawan -
Category
Technology
-
view
30.540 -
download
1
description
Transcript of How to Develop a Basic Magento Extension Tutorial
![Page 1: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/1.jpg)
Tutorial: How to DevelopA Basic Magento Extension
How to create your own blocks and templates in Magento Commerce using Extensions.
Hendy Irawan@hendyirawan magentoadmin.blogspot.comCTO, Bippo
![Page 2: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/2.jpg)
Magento ExtensionProject Folder Structure
![Page 3: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/3.jpg)
Project Folder Structure(design & skin)
![Page 4: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/4.jpg)
Filename Mapping Conventions
code/{Company}/{Module}-> app/code/community/{Company}/{Module}
design/frontend/base/default/...-> app/design/frontend/base/default/...
skin/frontend/base/default/...-> skin/frontend/base/default/...
{Company}_{Module}.xml-> app/etc/modules/{Company}_{Module}.xml
![Page 5: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/5.jpg)
Creating a Basic Block + Template
![Page 6: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/6.jpg)
Module etc/config.xml (Basic)
<?xml version="1.0" encoding="UTF-8"?><config> <modules> <Bippo_Twitter> <version>1.0.0</version> </Bippo_Twitter> </modules></config>
code/Bippo/Twitter/etc/config.xml
![Page 7: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/7.jpg)
Block & Helper config.xml
<config>... <global> <models/> <blocks> <bippotwitter> <class>Bippo_Twitter_Block</class> </bippotwitter> </blocks> <helpers> <bippotwitter> <class>Bippo_Twitter_Helper</class> </bippotwitter> </helpers> </global></config>
code/Bippo/Twitter/etc/config.xml
![Page 8: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/8.jpg)
Helper class
<?php
class Bippo_Twitter_Helper_Data extends Mage_Core_Helper_Abstract{ }
code/Bippo/Twitter/Helper/Data.php
![Page 9: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/9.jpg)
Block Class Skeleton
<?php/** * Twitter Profile Stream. * * @category Bippo * @package Bippo_Twitter * @author Rully Lukman <[email protected]> */class Bippo_Twitter_Block_Profilestream extends Mage_Core_Block_Template{}
code/Bippo/Twitter/Block/Profilestream.php
![Page 10: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/10.jpg)
Block Class Implementation
class Bippo_Twitter_Block_Profilestream extends Mage_Core_Block_Template {
public function __construct() { parent::__construct(); // template $this->setTemplate('bippotwitter/twitter-box.phtml');}
}
code/Bippo/Twitter/Block/Profilestream.php
![Page 11: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/11.jpg)
Template File
<div class="twitterbox"><script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({ version: 2, type: 'profile',... }}).render().setUser('bippoindonesia').start();</script></div>
design/frontend/base/default/ template/bippotwitter/twitter-box.phtml
![Page 12: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/12.jpg)
How to Use
Usage in CMS Content Editor{{block type="bippotwitter/profilestream"}}
Usage in CMS Design tab / Layout XML<reference name="content"> <block type="bippotwitter/profilestream" name="twitterbox1"/></reference>
![Page 13: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/13.jpg)
Making the Block Configurable
![Page 14: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/14.jpg)
Adding Properties
private $twitterUsername;
public function __construct() { parent::__construct(); // property default values $this->twitterUsername = 'bippoindonesia'; // template $this->setTemplate('bippotwitter/twitter-box.phtml');}
public function getTwitterUsername() { return $this->twitterUsername;}
public function setTwitterUsername($twitterUsername) { $this->twitterUsername = $twitterUsername;}
code/Bippo/Twitter/Block/Profilestream.php
![Page 15: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/15.jpg)
Using Properties
<div class="twitterbox"><script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({ version: 2, type: 'profile',... }}).render() .setUser('<?php echo $this->getTwitterUsername() ?>') .start();</script></div>
design/frontend/base/default/ template/bippotwitter/twitter-box.phtml
![Page 16: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/16.jpg)
Usage in CMS Content
{{block type="bippotwitter/profilestream" twitterUsername="hendyirawan"}}
![Page 17: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/17.jpg)
Usage in CMS Design tab / Layout XML
<reference name="content"> <block type="bippotwitter/profilestream" name="twitterbox2"> <action method="setTwitterUsername"> <twitterUsername> soluvas </twitterUsername> </action> </block></reference>
![Page 18: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/18.jpg)
SupportingAdmin Panel > System > Configuration
![Page 19: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/19.jpg)
Bippo Twitter Configuration :)
![Page 20: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/20.jpg)
Adminhtml Input Fields<?xml version="1.0"?><!--/** * Bippo Twitter * * @category Bippo * @package Bippo_Twitter * @copyright Copyright (c) 2011 Bippo.co.id */--><config> <tabs> <bippo> <label>Bippo</label> <sort_order>196</sort_order> </bippo> </tabs>...
code/Bippo/Twitter/etc/system.xml
![Page 21: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/21.jpg)
Tabs in Configuration Page<?xml version="1.0"?><!--/** * Bippo Twitter * * @category Bippo * @package Bippo_Twitter * @copyright Copyright (c) 2011 Bippo.co.id */--><config> <tabs> <bippo> <label>Bippo</label> <sort_order>196</sort_order> </bippo> </tabs>...
code/Bippo/Twitter/etc/system.xml
![Page 22: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/22.jpg)
Sections
<config> ... <sections> <bippotwitter translate="title" module="bippotwitter"> <label>Twitter</label> <tab>bippo</tab> <frontend_type>text</frontend_type> <sort_order>73</sort_order> <show_in_default>1</show_in_default> <show_in_website>1</show_in_website> <show_in_store>1</show_in_store> <groups> ...
code/Bippo/Twitter/etc/system.xml
![Page 23: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/23.jpg)
Groups
<config>... <sections> <bippotwitter translate="title" module="bippotwitter"> ... <groups> <general translate="label"> <label>General</label> <sort_order>100</sort_order> <show_in_default>1</show_in_default> <show_in_website>1</show_in_website> <show_in_store>1</show_in_store> <fields> ...
code/Bippo/Twitter/etc/system.xml
![Page 24: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/24.jpg)
Fields
<config> ... <sections> <bippotwitter ...> ... <groups> <general ...> ... <fields> <custom_twitter_id translate="label"> <label>Twitter ID</label> <comment><![CDATA[Twitter username]]></comment> <frontend_type>text</frontend_type> <sort_order>20</sort_order> <show_in_default>1</show_in_default> <show_in_website>1</show_in_website> <show_in_store>1</show_in_store> </custom_twitter_id> <number_of_tweets translate="label"> ...
code/Bippo/Twitter/etc/system.xml
![Page 25: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/25.jpg)
Access Control<?xml version="1.0"?><config><acl> <resources> <admin> <children> <system> <children> <config> <children> <bippotwitter translate="title" module="bippotwitter"> <title>Twitter</title> </bippotwitter> </children> </config> </children> </system> </children> </admin> </resources></acl></config>
code/Bippo/Twitter/etc/adminhtml.xml
![Page 26: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/26.jpg)
Default Configuration Values
<config>... <default> <bippotwitter> <general> <custom_twitter_id>bippoindonesia</custom_twitter_id> <number_of_tweets>5</number_of_tweets> <live>1</live> </general> </bippotwitter> </default>...</config>
code/Bippo/Twitter/etc/config.xml
![Page 27: How to Develop a Basic Magento Extension Tutorial](https://reader034.fdocuments.in/reader034/viewer/2022051411/54710e8ab4af9fa30a8b4a2f/html5/thumbnails/27.jpg)
Need More Resources?
Magento eCommerce Development Blogmagentoadmin.blogspot.com
Follow @hendyirawan on Twitter
Follow ceefour on Slidesharewww.slideshare.net/ceefour
Hendy Irawan