Magento有漂亮整洁的助手能输出你的产品照片。今天，我的一位同事在尝试侧边栏展示调整后的图片时，对图片的留白有些不太顺心。他尝试过的一种解决方式是用CSS。然而，这里有一个更好的办法来去掉调整后图片周围的留白。

这个实用例子中的代码来自默认的media.phtml

app/design/frontend/default/you_theme/template/catalog/product/view/media.phtml

<?php foreach ($this->getGalleryImages() as $_image): ?>
    <li>
        <a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" title="< ?php echo $this->htmlEscape($_image->getLabel()) ?>">
            <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(56); ?>" width="56" height="56" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" />
        </a>
    </li>
<?php endforeach; ?>

将它改变成这样将会产生一个“框架自由”图片

<?php foreach ($this->getGalleryImages() as $_image): ?>
    <li>
        <a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image) ?>', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>">
            <img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->keepFrame(false)->resize(56); ?>" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" />
        </a>
    </li>
<?php endforeach; ?>

如你所见，我们所做的只是在resize()方法前面添加keepFrame(false)方法。

这就是脚本修改前后的结果。