Layout, Template, block trong magento(Phần 1)
Bài đăng này đã không được cập nhật trong 7 năm
Layout, Template, block trong magento(phần 1)
- Những developer mới làm việc mớ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 kết nối với nhau như nào và chúng có vai trò 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 kết hợp mã php và html (có đuôi là phtml) . Bên trong file template có sử dụng $this để tham chiếu đến đối tượng block của nó .
1. Block
Magento chia block thành hai loại : structure block và content block.
- Structure Block: đây là những block được tạo ra để định dạng vị trí cho những block khác trong một page . Hãy lấy ví dụ với trang chủ của magento default sử 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 xem right column có những content block nào.
- minicart
- Recently viewed product
- Newsletter subscription block
- Poll
Khi nhận được một request từ người dùng để hiển thị một page :
- Magento sẽ load những vùng cấu trúc
- Mỗi vùng cấu trúc có những content block . Magento sẽ tập hợp những block này lại và gán cho các structure block tương ứng theo layout để xử lý đầu ra .
- Cuối cùng hệ thống sẽ trả lại kết quả sau cùng cho trình duyệt phần nội dung đã được định dạng vị trí .
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ị . ** VD 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ó một số vấn đề mà ta chưa hiêu rõ về chúng :
- Làm thế nào để 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 để 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
Để hình dung được rõ ràng hơn chúng ta 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 một file layout với cá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">
body {
background-color:#f00;
}
</style>
</head>
<body>
</body>
</html>
Bước 3 : trong bước cuối cùng này ta sẽ xem thành quả bằng cách tạo ra 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 trang của magento(thẻ default của file layout).
Kết luận:
Cám ơn bạn đã theo dõi phần bài viết của mình trong phần này, nếu là một develop magento 1 bạn không thể không hiểu kỹ cấu trúc của Layout, temblate & block vì vậy bạn nên tìm hiểu sâu phần này mới có thể sang bài tiếp theo. Tạo mới một một module trong magento và chạy hello world module trong cuộc đời làm dev magento.
Sang phần tiếp theo của phần này, mình xin viết về cách tạo một module helloworld trong magento1 để phục vụ câu trả lời cho câu hỏi: Làm thế nào để magento biết tôi sẽ sử dụng block này trên cái page này ?.
All rights reserved
