Thứ Ba, 19 tháng 4, 2016

Tutorials Magento 05 : Phát triển một module mới trong magento như thế nào?.

Trong phần kiến trúc magento chúng mình đã hiểu hầu hết các chức năng của Magento đều được module hóa hay nói cách khác Magento là một tập hợp các module thực hiện những nhiệm vụ khác biệt. Trong tutorials này mình sẽ chỉ dẫn các bạn phát triển 1 mô đun mới có đầy đủ các thành phần chính với tên là "Helloworld".
Chú ý- Tất cả các module demo được viết trong thư mục local vì chắc chắn magento sẽ đưa ra những version mới và nếu để code trong folder local thì mỗi lần update code của ta vẫn không hề bị liên quan.

Trước khi đi vào vẫn đề chính ta cần disable all cache để mọi thay đổi trên mô đun mới sẽ được hiện lên ngay trên site mà không cần phải refresh cache.

truy cập vào: Admin -> system -> Cache Management sau đó chọn all cache và disable chúng.

Ok đã ngừng phần chuẩn bị và bây giờ chúng ta sẽ bắt đầu xây dựng một module|mô đun tên "Helloworld" với namespace là "Basetut". vì đây là module trước tiên nên mình sẽ làm dễ hiểu nhất để cả nhà có thể hiểu được. Module|Mô đun này chỉ có nhiệm vụ in ra dòng text "Hello world!" ngoài frontend.

Các sản phẩm Magento của chúng tôi :

- product designer

- multi vendor marketplace

- Magento 2 one page checkout

* Bước 1: tạo các thư mục chính cho module

Đầu tiên mình sẽ tạo một hệ thống các thư mục cần thiết:

app\code\local\Basetut\Helloworld

app\code\local\Basetut\Helloworld\controllers

app\code\local\Basetut\Helloworld\etc

app\code\local\Basetut\Helloworld\etc\config.xml

app\code\local\Basetut\Helloworld\Helper

app\code\local\Basetut\Helloworld\Model

* Bước 2: Tạo file cấu hình cho module với tên là Basetut_Helloworld.xml trong thư mục app/etc/modules

File này có tác dụng khai báo với hệ thống magento codePool và trạng thái của module:

+ codePool: local (code được đặt trong thư mục local chứ không phải community hay core).

+ active: true (module đang được active).

* Bước 3: tạo file config.xml trong thư mục app\code\local\Basetut\Helloworld\etc để khai báo các thành phần của module cho hệ thống magento.

Trong file config này ta có khai báo một số thông tin cho module:
+ version: 1.0 – version hiện tại của module là 1.0
+ thư mục đặt block của module là app/code/local/Basetut/Helloworld/Block (nếu không có config này thì ta sẽ không thể dùng được block của nó)
+ router hay frontname trên frontend là helloworld
+ file layout frontend là helloworld.xml

* Bước 4: viết block helloword

File Helloworld.php trong thư mục app/code/local/Basetut/Helloworld/Block

* Bước 5: tạo file template helloworld.phtml

trong thư mục app/design/frontent/base/default/template/helloworld với nội dung

* Bước 6: tạo file layout helloworld.xml trong thư mục: app/design/fronted/base/default/layout

Trong file layout này ta chỉ cần nắm được một số thông tin sau:
+ handle: helloworld_index_index
– helloworld: router name (đã khai báo trong file config.xml)
– index: controller name (chưa tạo controller :v)
– index cuối cùng là action name (function trong controller index)
Để hiểu được luồng hoạt động của Magento chúng ta sẽ đi sâu vào một tut khác còn bây giờ chúng ta sẽ tạm hiểu rằng mỗi handle này tương đương với 1 đường link trong magento. Ví dụ handle helloworld_index_index trong ví dụ này nó sẽ tương đương với http://yoursite.com/index.php/helloworld/index/index
+ block
type: type này chính là đường dẫn đến file block, trong ví dụ nó có giá trị là "helloworld/helloworld" như vậy đường dẫn đến file block là app/code/local/Basetut/Hellowordl/Block/Helloworld. Mọi người để ý sự tương đồng giữa phần in đậm và type của block nhé!
name: đây chỉ là tên của block trong cái handle mà thôi (mục đích để phần biệt với các block khác)
template: đây là đường dẫn đến file template mà block kia map (liên kết) tới trong handle này. Sau khi khai báo như thế này mỗi lần file template sử dụng con trỏ $this hệ thống sẽ gọi tới block Helloworld (chỉ ở trong handle này thôi nhé!).

* Bước 7: tạo controller IndexController.php trong thư mục app/code/local/Basetut/Helloworld/controllers

Tại sao ta lại lấy tên controller là index? Khi người dùng đánh vào 1 đường link rút gọn trên trình duyệt yoursite .com/helloworld sẽ bị thiếu controller name và action name. Trong trường hợp này hệ thống sẽ biết lấy controller mặc định là IndexController và lấy action mặc định indexAction.
Trong action index ở trên chỉ bao gồm có 2 câu lệnh:
+ $this->loadLayout(): dùng để load layout, block, template từ file layout ra
+ $this->renderLayout(): render giao diện từ những block, template theo thư tự đã được định sẵn trong file layout

Vậy là chúng ta vừa hoàn thành được module đầu tiên trên open source Magento. Bây giờ chúng ta sẽ xem thành quả nhé!
+ Copy source code vào thư mục cài magento
+ Disable/refresh cache trước khi chạy
+ Truy cập vào đường link yoursite .com/helloworld (với yoursite.com là website của bạn, của mình là localhost.com)
Kết quả hiển thị:

Các bạn hãy tìm hiểu kỹ tut này sau đó làm theo để xem có ra được kết quả như mình không nhé! Nếu có bất cứ vấn đề gì có thể comment và mình sẽ trả lời ngay lập tức.
Nếu vẫn ko làm được các bạn hãy download source code của module Helloworld version 1.0 về xem nhé!