在Magento网格列表中展示产品缩略图

redmaomail 2024-07-24 18:12 阅读数 147 #Magento

编辑产品和改变产品在类别中的位置是一项不小的任务。特别是有一大堆产品需要编辑和排列，而且其中有些又很相似。

当然，你可以通过SKU，ID，价格或者其它的一些东西来区别它们。但是都不会比在网格列表中展示缩略图好。

在产品网格列表里展示缩略图并不复杂。有几种方法可以实现这个功能，但是几乎所有的方法都用到了渲染器去展示产品图片，就和我们即将做的一样。

在这个例子中，我们将注册我们的模块，重写一个Magento后太网格的块——特别是“Manage Categories”，还要添加我们的代码来显示缩略图这个附加列。

让我们开始吧！

首先，注册我们的模块

app/etc/modules/Alwayly_Thumbnail.xml

<?xml version="1.0"?>
<config>
    <modules>
        <Alwayly_Thumbnail>
            <active>true</active>
            <codePool>local</codePool>
        </Alwayly_Thumbnail>
    </modules>
</config>

现在，配置你的模块，用你自己的版本来重写 ‘catalog_category_tab_product‘ 块。

app/code/local/Alwayly/Thumbnail/etc/config.xml

<?xml version="1.0"?>
<config>
    <modules>
        <Alwayly_Thumbnail>
            <version>1.0.0</version>
        </Alwayly_Thumbnail>
    </modules>
    <global>
        <blocks>
            <adminhtml>
                <rewrite>                    <catalog_category_tab_product>Alwayly_Thumbnail_Block_Adminhtml_Catalog_Category_Tab_Product</catalog_category_tab_product>
                </rewrite>
            </adminhtml>
        </blocks>
    </global>
</config>

将app/code/core/Mage/Adminhtml/Block/Catalog/Category/Tab/Product.php中的代码粘贴到app/code/local/Alwayly/Thumbnail/Block/Adminhtml/Catalog/Category/Tab/Product.php

<?php
class Alwayly_Thumbnail_Block_Adminhtml_Catalog_Category_Tab_Product extends Mage_Adminhtml_Block_Widget_Grid
{
    public function __construct()
    {
        parent::__construct();
        $this->setId('catalog_category_products');
        $this->setDefaultSort('entity_id');
        $this->setUseAjax(true);
    }
 
    public function getCategory()
    {
        return Mage::registry('category');
    }
 
    protected function _addColumnFilterToCollection($column)
    {
        // Set custom filter for in category flag
        if ($column->getId() == 'in_category') {
            $productIds = $this->_getSelectedProducts();
            if (empty($productIds)) {
                $productIds = 0;
            }
            if ($column->getFilter()->getValue()) {
                $this->getCollection()->addFieldToFilter('entity_id', array('in'=>$productIds));
            }
            elseif(!empty($productIds)) {
                $this->getCollection()->addFieldToFilter('entity_id', array('nin'=>$productIds));
            }
        }
        else {
            parent::_addColumnFilterToCollection($column);
        }
        return $this;
    }
 
    protected function _prepareCollection()
    {
        if ($this->getCategory()->getId()) {
            $this->setDefaultFilter(array('in_category'=>1));
        }
        $collection = Mage::getModel('catalog/product')->getCollection()
                          ->addAttributeToSelect('name')
                          ->addAttributeToSelect('sku')
                          ->addAttributeToSelect('price')
                          ->addAttributeToSelect('thumbnail')
                          ->addStoreFilter($this->getRequest()->getParam('store'))
                          ->joinField('position',
                                      'catalog/category_product',
                                      'position',
                                      'product_id=entity_id',
                                      'category_id='.(int) $this->getRequest()->getParam('id', 0),
                                      'left');
        $this->setCollection($collection);
 
        if ($this->getCategory()->getProductsReadonly()) {
            $productIds = $this->_getSelectedProducts();
            if (empty($productIds)) {
                $productIds = 0;
            }
            $this->getCollection()->addFieldToFilter('entity_id', array('in'=>$productIds));
        }
 
        return parent::_prepareCollection();
    }
 
    protected function _prepareColumns()
    {
        if (!$this->getCategory()->getProductsReadonly()) {
            $this->addColumn('in_category', array(
                'header_css_class' => 'a-center',
                'type'      => 'checkbox',
                'name'      => 'in_category',
                'values'    => $this->_getSelectedProducts(),
                'align'     => 'center',
                'index'     => 'entity_id'
            ));
        }
        $this->addColumn('entity_id', array(
            'header'    => Mage::helper('catalog')->__('ID'),
            'sortable'  => true,
            'width'     => '60',
            'index'     => 'entity_id'
        ));
        $this->addColumn('name', array(
            'header'    => Mage::helper('catalog')->__('Name'),
            'index'     => 'name'
        ));
        $this->addColumn('image', array(
            'header' => Mage::helper('catalog')->__('Image'),
            'align' => 'left',
            'index' => 'image',
            'width'     => '97',
            'renderer' => 'Alwayly_Thumbnail_Block_Adminhtml_Template_Grid_Renderer_Image'
        ));
        $this->addColumn('sku', array(
            'header'    => Mage::helper('catalog')->__('SKU'),
            'width'     => '80',
            'index'     => 'sku'
        ));
        $this->addColumn('price', array(
            'header'    => Mage::helper('catalog')->__('Price'),
            'type'  => 'currency',
            'width'     => '1',
            'currency_code' => (string) Mage::getStoreConfig(Mage_Directory_Model_Currency::XML_PATH_CURRENCY_BASE),
            'index'     => 'price'
        ));
        $this->addColumn('position', array(
            'header'    => Mage::helper('catalog')->__('Position'),
            'width'     => '1',
            'type'      => 'number',
            'index'     => 'position',
            'editable'  => !$this->getCategory()->getProductsReadonly()
            //'renderer'  => 'adminhtml/widget_grid_column_renderer_input'
        ));
 
        return parent::_prepareColumns();
    }
 
    public function getGridUrl()
    {
        return $this->getUrl('*/*/grid', array('_current'=>true));
    }
 
    protected function _getSelectedProducts()
    {
        $products = $this->getRequest()->getPost('selected_products');
        if (is_null($products)) {
            $products = $this->getCategory()->getProductsPosition();
            return array_keys($products);
        }
        return $products;
    }
}

现在，插入上面的代码，这将选择一个产品的附加属性——“thumbnail”，创建一个名为“Image”的列。注意到，你可以在任何包含产品的网格里做这些，只需要重写一个不同的块。

最后，我们将创建一个在89行被调用的自己的渲染器。


'renderer' => 'Alwayly_Thumbnail_Block_Adminhtml_Template_Grid_Renderer_Image'

app/code/local/Alwayly/Thumbnail/Block/Adminhtml/Template/Grid/Renderer/Image.php
<?php
class Alwayly_Thumbnail_Block_Adminhtml_Template_Grid_Renderer_Image extends Mage_Adminhtml_Block_Widget_Grid_Column_Renderer_Abstract
{
    public function render(Varien_Object $row)
    {
        $val = Mage::helper('catalog/image')->init($row, 'thumbnail')->resize(97);
        $out = "<img src=". $val ." width='97px'/>";
        return $out;
    }
}

这个渲染器获取了一行对象作为一个参数。它调用的图像助手初始化缩略图大小并重新调整为97像素（你可以改成你需要或喜欢的大小）。之后，它返回出现在你网格里的图像标签。我们还需要考虑到产品没有图片的情况。

最快捷的方式是复制产品占位符（placeholder）图像。我将Magento默认的占位符图像（skin\adminhtml\default\default\images\placeholder\thumbnail.jpg）拷贝到skin\adminhtml\default\default\images\catalog\product\placeholder\thumbnail.jpg

电商网站开发服务。

上一篇：用编程的方式创建一个可配置产品下一篇：Magento中以编程的方式创建捆绑产品