Question

我正在处理magento应用程序。我正在导航菜单中显示类别图像。

我已经使用css为它们分配了高度和宽度。当我检查网站的getmetrix中的性能时，我得到指定图像尺寸消息以提高性能。

我怎样才能克服这个？

Answer 1

您必须以html <img src="/img.jpg" width="500" height="500" />

提供图片尺寸

Answer 2

您应该管理图像尺寸的三个地方

1）您输出产品图片的任何地方（list.phtml，media.phtml，可能是view.phtml，具体取决于您的模板）。

<img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail', $_image->getFile())->resize(66); ?>" width="66" height="66" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>

2）如果在layout.xml文件中使用标注图像。您需要在xml文件中设置图像尺寸，如下所示：

<reference name="left">
        <block type="core/template" name="left.permanent.callout" template="callouts/left_col.phtml">
            <action method="setImgSrc">
                <src>images/media/col_left_callout.jpg</src>
            </action>
            <action method="setImgAlt" translate="alt" module="catalog">
                <alt>Flooring Supplies Brands</alt>
            </action>
            <action method="setImgHeight">
                <width>225</width>
            </action>
            <action method="setImgWidth">
                <width>195</width>
            </action>
            <action method="setLinkUrl">
                <url>brands.html</url>
            </action>
        </block>
    </reference>

然后在callout phtml中渲染它们，如下所示：

<img src="<?php echo $this->getSkinUrl('images/media/col_right_callout.jpg') ?>" width="<?php echo $this->__($this->getImgWidth()) ?>" height="<?php echo $this->__($this->getImgHeight()) ?>" alt="<?php echo $this->__($this->getImgAlt()) ?>" style="display:block;" />

3）在cms静态块内

我在How to add image dimensions in Magento layout files

写了一篇关于如何做＃2的文章

如何克服“指定图像尺寸”gtmetrix性能摘要消息？

2 个答案: