Những developer mới làm việc với magento thường bị nhầm lẫn layout với hệ thống hiển thị. Bài viết này sẽ cho chúng ta biết chúng liên kết với nhau như thế nào và chúng có tính năng gì trong cái mô hình MVC.
Trong Magento thì tầng View bao gồm có Block và Template. Block là những đối tượng PHP còn Template là những file phối hợp cả mã html và php (có đuôi là phtml). Bên trong file template có sử dụng $this để reference đến đối tượng block của nó.
Các sản phẩm Magento của chúng tôi :
- magento 2 checkout extension
- Magento Multi Vendor Marketplace
1. Block
Magento tách block thành hai loại|kiểu: content block và structure block.
- Structural Block: đây là những block được tạo ra để định dạng địa điểm cho những block khác trong một trang. Hãy lấy thí dụ với trang chủ của magento default dùng three column layout:
- Head
- Left
- Content
- Right
- Footer
- Content Block: Đây là những block nội dung, chúng được hiển thị bên trong những structure block. Mỗi content block thường hiển thị một khối nội dung nào đó thông qua những file template và chèn vào những block cha là structure block.. Hãy em right column trog hình trên có những content blocks nào:
- Minicart
- Recently viewed product
- Newsletter subsription block
- Poll
Khi thu được 1 request từ người dùng để hiển thị 1 trang:
– Magento sẽ load những vùng cấu trúc
– Mỗi vùng kiến trúc có những content block. Magento sẽ tụ hội những block này lại và gán cho các structure block tương ứng theo layout để xử lý đầu ra.
– Sau cuối hệ thống sẽ trả lại kết quả sau cùng cho trình duyệt web phần nội dung đã được định dạng địa điểm.
2. Template
Template là những file phtml được đặt trong thư mục design. Chúng bao gồm cả code php và mã html nên có phần mở rộng là phtml. Những file template có tác dụng lấy dữ liệu từ file block và hiển thị.
Ví dụ về file template:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="?php echo $this->getLang() ?>" lang="<?php echo $this->getLang() ?>">
- <head>
- <?php echo $this->getChildHtml('head') ?>
- </head>
- <body class="page-popup <?php echo $this->getBodyClass()?$this->getBodyClass():'' ?>">
- <?php echo $this->getChildHtml('content') ?>
- <?php echo $this->getChildHtml('before_body_end') ?>
- <?php echo $this->getAbsoluteFooter() ?>
- </body>
- </html>
3. Layout
Qua hai phần đầu chúng ta đã hình dung được block là gì và template là gì, chúng có tác dụng gì nhưng vẫn còn có một số vấn đề mà chúng ta chưa hề biết về chúng:
– Làm thế nào để cho magento biết rằng tôi sẽ sử dụng block này trên cái page này?
– Làm thế nào để cho magento biết block nào sẽ được rendering đầu tiên?
– Làm thế nào để có thể gọi hàm getChildHtml trong khi tham số truyền vào không phải là tên của block.
Để các bạn có thể hình dung được dễ dàng hơn mình sẽ đi vào một ví dụ cụ thể, đó là action in "Hello World" ra trình duyệt.
* Bước 1: tạo 1 file layout với tên local.xml
app/design/frontend/base/default/layout/local.xml
- <layout version="0.1.0">
- <default>
- <block type="page/html" name="root" output="toHtml" template="magentotutorial/helloworld/simple_page.phtml" />
- </default>
- </layout>
* Bước 2: tạo file template simple_page.phtml
app/design/frontend/base/default/template/magentotutorial/helloworld/simple_page.phtml
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Hello World</title><style type="text/css">bodybackground-color:#f00;</style></head><body></body></html>
* Bước 3: trong bước cuối cùng này ta sẽ xem được thành quả bằng cách tạo một action trong một controller bất kỳ và trong đó có gọi hai phương thức loadLayout() và renderLayout():
- public function indexAction()
- $this->loadLayout();
- $this->renderLayout();
Sau khi kết thúc hãy clear cache và refresh lại action vừa viết để thấy kết quả hiển thị.
Trong ví dụ trên thì file layout đã map block page/html với template simple_page.phtml để hiển thị trên tất cả các page của magento (thẻ default của file layout). Như vậy ta đã trả lời được câu hỏi thứ nhất ở trên "Làm thế nào để cho magento biết rằng tôi sẽ sử dụng block này trên cái page này?".Hai câu hỏi thứ 2 và thứ ba mình sẽ giải đáp cho các bạn trong những bài học sau.
Trong bài viết vẫn còn rất nhiều chỗ thiếu sót và mong được sự góp ý của tất cả các anh chị. Cám ơn và hẹn gặp lại ở bài học sau. :)
0 nhận xét:
Đăng nhận xét