Showing posts with label Block. Show all posts
Showing posts with label Block. Show all posts

23 September 2014

Static block - Thêm trực tiếp một Static Block vào một file template .phtml trong Magento

Thêm Static Block thông qua Identifier trực tiếp vào templates (.phtml)
<?php echo $this->getLayout() ->createBlock('cms/block') 
->setBlockId('your_block_id')->toHtml(); ?>

Code chèn Static Block vào Static Block khác hay một CMS Page :
{{block type="cms/block" block_id="your_block_id"}}

Static Block - Cách chèn một static block vào CMS page trong Magento

Tạo Static Block: 
CMS => Static Blocks => Add New Block.
Ví dụ Block mới tạo có Identifier là: your_block_id

Chèn Static Block vào một trang CMS Pages:
{{block type="cms/block" block_id="your_block_id"}}

16 September 2014

Static Block - Gọi một Static block và đặt vào một trang CMS page trong magento

Trong phần content của một trang CMS page bất kỳ. Gọi một Static block thông qua Identifier của nó theo cú pháp sau đây:

{{block type="cms/block" block_id="block_identifier"}}

Muốn xác định Block Identifier:
Bước 1: Vào phần quản trị Admin hay Backend của Magento
Bước 2: Truy cập menu CMS => Static Block. Trong trang Static Block hiện ra sẽ thấy Identifier ( cột thứ 2 ).

24 August 2014

Block - Những thuộc tính có thể có của một Block Magento

Khai báo 1 Block trong file layout .xml của Magento:

<block type="..." name="..." as="..." template="...">
         <action> </action>
</block>
  • type: loại Block, có thể là Block trong Magento, hay block trong một module nhất định
  • name: Tên tham chiếu đến Block, tên này phải duy nhất trên toàn website, các block khác referrent ( Tham chiếu ) đến nó thông qua tên.
  • as: Tên mật danh của Block hay Block con của nó, tên này được dùng để gọi Block bằng phương thức getChildHTML(ten_mat_danh) trong file Template tương ứng với Block.
  • template: file có phần mở rộng .phtml, quy định nội dung bên trong của block, trong template có thể gọi đến một Block khác ( Block con hay bất kỳ Block nào đã được khai báo với Magento)
  • before (and) after: đây là hai cách giúp sắp xếp vị trí của một Block nội dung trong một Block cấu trúc gồm nhiều Block nội dung. Sắp xếp Block lên vị trí cao nhất hay thấp nhất trong một Block cấu trúc.
  • action – <action> : dùng để tác động lên các thay đổi trong một trang, một Block, và nhiều chức năng khác nữa.

23 August 2014

Products - Tạo block Grid hay List chứa danh sách các sản phẩm cần lọc trong Magento


////////////////////////////// Built Up Some Collection Of Products /////////////////////////// // Collection 1: $products = Mage::getResourceModel('catalog/product_collection') ->addAttributeToSelect('*') ->addAttributeToFilter('status', 1); ////////////////////////////// Built Up Some Collections Product End /////////////////////////// // Create Block List Of Product Base On Collections Above $block = Mage::getSingleton('core/layout')->createBlock('catalog/product_list') ->setTemplate('catalog/product/list.phtml') ->setCollection($products); // Write To Html Format to send to browser: echo $block->toHtml();

Layout - Phân biệt giữa name và as của Block trong Layout .xml

Ví dụ code gọi một Block trong Layout .xml như sau:

<block type="page/switch" name="store_switcher_stop" as="store_switcher_top" template="page/switch/stores-top.phtml"/>

Sự khác nhau giữa name và as là gì ?
name:
as:

Statitc Block - Gọi một Statitc Block từ các nơi khác nhau trong Magento

A. Gọi một Static Block trong file Template .phtml
Bước 1: Tạo 1 Static Block trong Backend Của Magento, có Identifier: new_static_block_in_magento
Bước 2: Trong template file .phtml bất kỳ. Gọi Static Block vừa tạo trong bước 1  theo code sau:

Cách 1: 

<?php 
$layout = Mage::getSingleton ('core/layout'); // Khởi tạo đối tượng Layout // 
$block = $layout->createBlock('cms/block'); // Khởi tạo đối tượng Static Block từ đối tượng Layout //
$block->setBlockId ('new_static_block_in_magento'); // Gán Block ID cho đối tượng Static Blick // 
echo $block->toHtml(); // Ghi Static Block ra màng hình //
?> 

Cách 2: ( Đây là cách viết tắt của cách 1 mà thôi )
<?php echo $this->getLayout()->createBlock('cms/block')->setBlockId('footer_links')->toHtml();?> 

B. Gọi một Static Block trong file Layout .xml
<block type="cms/block" name="'new_static_block_in_magento">
<action setBlockId ('new_static_block_in_magento')> </action>
</block>
<block type="page/switch" name="store_switcher_stop" as="store_switcher_top" template="page/switch/stores-top.phtml"/>

type="": loại block khai báo là gì => tham khảo thêm Liệt kê một số loại Block thường sử dụng trong Magento
name / as : tên của block, dùng để gọi block, tham chiếu đến block. => Phân biệt giữa nameas của Block.
template: template là file .phtml mà block sử dung để thể hiện nội dung của nó.





22 August 2014

Static Block - Cách nhúng bản đồ google maps vào Static Block của Magento

Bước 1: Truy cập bản đồ google maps trực tuyến tại http://maps.google.com.
Bước 2: Tìm khu vực bản đồ cần tìm thông qua thanh địa chỉ sau đây:
Nhập số nhà, đường, phường, xã, thị trấn, thành phố, tỉnh thành, Việt Nam vào ô trên. Bấm nút search.
Bước 3: Kéo thả phóng to thu nhỏ bản đồ sau cho nhì thấy rõ nhất trên màng hình. Sử dung thanh công cụ có sẵn trong cửa sổ.
Bước 4: Sau khi chọn khu vực vừa ý, ban tiến hành copy code ifram nhúng vào Static block trên Magento như sau:
- Vào Icon hình bánh răng => click sẽ xuất hiện một menu con => chọn share and embed map.
- Một cửa sổ mới xuất hiện, bạn chon Tab Embed map, chọn kích thước bản đồ cần nhúng
+ small : nhỏ
+ Medium: vừa
+ Large: rông
+ Custom size: tùy chỉnh dài, rộng.
Bước 5: Copy đoạn code trong ô sau, có dang là thẻ tag <iframe>...</iframe>
Code này dùng để cop vào Static Block của Magento sau:
Chúc bạn thành công !

20 August 2014

Block - Hiển thị danh sách các sản phẩm trong một Category có ID bất kỳ

Trong phần content của một Static Block bất kỳ, copy đoạn code sau đây:

{{block type="catalog/product_list" name="product_list" category_id="3" column_count="6" count="6" limit="4" mode="grid" template="catalog/product/list.phtml"}}

Chú thích:
name="product_list": tên của khối sản phẩm cần hiển thị, thay đổi tùy ý.
category_id="3": ID của category cần lấy các sản phẩm bên trong.
column_count="6": Số cột
count="6": tổng sản phẩm cần hiển thị
limit="4":
mode="grid": chọn grid / list

Mở rộng 
Bạn có thể hiển thị nhiều sản phẩm trong nhiều danh mục sản phẩm Category khác nhau trong một Static Block như sau:

<h2>First Category</h2> 
{{block type="catalog/product_list" name="product_list" category_id="1" column_count="6" count="6" limit="4" mode="grid" template="catalog/product/custom_list.phtml"}}

<h2>Second Category</h2> 
{{block type="catalog/product_list" name="product_list" category_id="2" column_count="6" count="6" limit="4" mode="grid" template="catalog/product/custom_list.phtml"}}

<h2>Third Category</h2> {{block type="catalog/product_list" name="product_list" category_id="2" column_count="6" count="6" limit="4" mode="grid" template="catalog/product/custom_list.phtml"}}

Block - Tạo mới một Static Block trong Magento

- Loggin vào Backend
- CMS => Static Blocks => Add New Block
- Cấu hình các thông số cho Block vừa tạo như sau
  • Block Title: Tiêu đề của Block trong Backend
  • Identifier: phải khác nhau trong cùng thuộc tính Store View
  • Status: Enable / Disable
  • Content: nội dung của Block, có thể là HTML 
Chú ý: Ta có thể tạo hai Block có cùng Identifier nhưng có thuộc tính Store View khác nhau. Điều này rất giúp ích trong việc tạo các Website hỗ trợ Multi Language.

19 August 2014

Block - Cách xác định một Block trong Magento thuộc về Module nào

Để xác định một Block trong Magento thuộc thề Module nào, bạn có thể bật chức năng "Template Path Hint " trong Backend.
Cách làm như sau:
- Vào trang admin sau đó truy cập menu System -> Configuration.
- Bạn sẽ thấy trang configuration hiện ra, chọn Store View mà bạn muốn tính năng "Template Path Hint " được bật ( Box Drop-Down cột menu trái trên cùng ).
- Sau khi trang reload lại hoàn chỉnh, vào Developer tab ở dưới cùng của cột menu trái.
- Chọn 'Yes' trong select box Template Path Hints. Click Save config.
- Trở lại trang chính frontend, refesh trang ( F5 ). Xong

Ứng dụng Template Path Hints, thực hiện bài thực hành nho nhỏ sau đây:
Trong trang Category ngoài frontend, chuyển Block "My Cart" ở cột phải ( right column ) sang cột trái ( left column ).
Bước 1: Bật tính năng "Template Path Hint" theo hướng dẫn bên trên.
Bước 2: Refresh lại trang web trong trang Category, các bạn sẽ thấy đường link màu đỏ hiển thị tại Block "My Cart" như sau:
'frontend/default/default/template/checkout/cart/sidebar.phtml'
Nhìn vào đường dẫn trên bạn sẽ biết được Block "My Cart" thuộc về Module "checkout". Trong đường dẫn trên thì tên thư mục nằm ngay sau /template/ sẽ cũng là tên Module.
Sau khi biết được Block "My Cart" thuộc về Module checkout, chúng ta sẽ tìm đến file layout checkout.xml của module này. File này sẽ nằm trong frontend/default/default/layout/checkout.xml. Mở file checkout.xml, tìm đến đoạn code sau:
<reference name="right">
<block type="checkout/cart_sidebar" name="cart_sidebar" before="-" template="checkout/cart/sidebar.phtml"/">
</reference">
Thay thế bằng đoạn code sau đây:
<reference name="left"><block type="checkout/cart_sidebar" name="cart_sidebar" before="-" template="checkout/cart/sidebar.phtml"/"></reference">
Reload lại trang Category ngoài Frontend, bạn sẽ thấy kết quả như mong muốn.

Block - Liệt kê một số loại Block thường sử dụng trong Magento

Có 2 loại Block cơ bản trong Magento theo chức năng: 
1. Structure Block (Block cấu trúc)
- Hiểu nôm na cho dễ hình, bạn có thể xem block cấu trúc như bộ khung cho hầu hết các trang trong website Magento. Mỗi Block cấu trúc này sẽ chứa nhiều Block con bên trong nó, gọi là Block nội dung.
- Một Block cấu trúc sẽ không là Block con của một Block nào khác, ngoài trừ Block root.
2. Content Block ( Block nội dung )
- Hiểu đơn giản, Block nội dung sẽ là con của một Block cấu trúc nào đó, hay là con của một Block nội dung khác. Đến lược nó có thể là cha của Block nội dung khác nữa, cứ thế cho đến vô tận ( trên lý thuyết ).
- Vậy một trang trong Magento được tạo ra là kết quả của:
+ Số lượng Block cấu trúc được hiển thị hay ẩn đi
+ Vị trí của các Block nội dung bên trong các Block cấu trúc nào mà nó cầu hiển thị
+ Sự sắp xếp vị trí của các Block nội dung trong cùng 1 Block cấu trúc.
+ Sự sắp xếp vị trí các Block nội dung con bên trong một Block nội dung khác.
+ Ẩn hay hiện của một Block nội dung.


Nếu phân cấp Block theo Class ( lớp ) mà Block sử dụng, hay Block Type, thì trong Magento ta có các loại Block sau:

core/template: 
This block renders a template defined by its template attribute. The majority of blocks defined in the layout are of type or subtype of core/template.

page/html: 
This is a subtype of core/template and defines the root block. All other blocks are child blocks of this block.

page/html_head: 
Defines the HTML head section of the page which contains elements for including JavaScript, CSS etc.

page/html_header:
Defines the header part of the page which contains the site logo, top links, etc.

page/template_links: 
This block is used to create a list of links. Links visible in the footer and header area use this block type.

core/text_list: 
Các Block như content, left, right đều là core/text_list. Khi Block này được render, tất cả các block con của nó ( bên trong trực tiếp hay <reference> đến nó ) cũng được render ra tự động mà không cần gọi method  getChildHtml().
Ví dụ: tạo một Block core/text_list tên "postscript" rỗng trong tất cả các trang website
<reference name="root">
<block type="core/text_list" name="postscript" as="postscript" translate="label">
<label>Page Postscript</label>
</block>
</reference>
Tại một trang cms page <cms_index_index> ta tham chiếu đến Block core/text_list "postscript" ở trên, và thêm vào đó 1 Static Block tên "block_home_postscript". Và một Block page/html_wrapper bao ngoài Static Block này dược render ra thành <div class="block_home_postscript std"></div>
<cms_index_index>
  <reference name="postscript">
<block type="page/html_wrapper" name="i_block_home_postscript">
<action method="setElementClass"><value>block_home_postscript std</value></action>
<block type="cms/block" name="block_home_postscript">
<action method="setBlockId"><block_id>block_home_postscript</block_id></action>
</block>
</block>
  </reference>

</cms_index_index>

page/html_wrapper: 
Block này sẽ tạo 1 <div></div> (default) bao lấy các Block con được render bên trong nó. Có thể dùng Tag name khác ngoài <div> tag thông qua <action> setHtmlTagName
Ví dụ: thực hiện code này trong file  layout_name.xml
<block type="page/html_wrapper" name="i_block_cms_page_top" before="-">
<action method="setElementClass"><value>block_cms_page_top std</value></action>
<block type="cms/block" name="block_cms_page_top">
<action method="setBlockId"><block_id>block_cms_page_top</block_id></action>
</block>
</block>
Kết quả sẽ tạo <div class="block_cms_page_top std"> </div> bao lấy Block name="block_cms_page_top" bên trong

page/html_breadcrumbs: 
This block defines breadcrumbs on the page.

page/html_footer: 
Defines footer area of page which contains footer links, copyright message etc.

core/messages: 
This block renders error/success/notice messages.

page/switch:
This block can be used for the language or store switcher.

This is a list of only commonly used block types. There are many other block types which are used in advanced theme implementations.

18 August 2014

Block - Khai báo một Block trong file Layout .xml của Magento

Khai báo 1 Block trong file layout của Magento:
<block type="" name="" as="" template="">
         <action> </action>
</block>

Ví dụ phân tích cú pháp khai báo một Block cụ thể sau:
<block type="page/html" name="root" output="toHtml" template="example/view.phtml"> (1)
Phân tích đoạn code trên, nếu ta xem tổng quát type="A/B" thì:
A: Module Name, (1) => page <=> Mage_Page_Block
- Module được khai báo tại: app/code/core/Mage/Page/etc/config.xml
B: Class name of Module A, (1) => html => Mage_Page_Block_Html Class
- Được khai báo trong:  app/code/core/Mage/Page/Block/Html.php
Chú thích: chi tiết về các thuộc tính khai báo trong Block trên
  • type: loại Block, có thể là Block trong Magento, hay block trong một module nhất định
  • name: Tên tham chiếu đến Block, tên này phải duy nhất trên toàn website, các block khác referrent ( Tham chiếu ) đến nó thông qua tên.
  • as: Tên mật danh của Block hay Block con của nó, tên này được dùng để gọi Block bằng phương thức getChildHTML(ten_mat_danh) trong file Template tương ứng với Block.
  • template: file có phần mở rộng .phtml, quy định nội dung bên trong của block, trong template có thể gọi đến một Block khác ( Block con hay bất kỳ Block nào đã được khai báo với Magento)
Tham khảo:
Những thuộc tính có thể có của một Block Magento
Liệt kê một số Block thường sử dụng trong Magento