Использование изображения каталога в качестве фонового изображения в Magento

Question

Я имею дело с коротким сроком здесь, поэтому я задам этот вопрос, еще не изучив его подробно.Хотя я думаю, это хороший вопрос, который может заинтересовать многих людей, имеющих дело с Magento.

Меня попросили внести некоторые изменения в интернет-магазин Magento.Среди прочего мне нужно использовать изображение категории каждой категории в качестве фонового изображения с полным изменяемым размером, используя этот (или аналогичный) плагин - http://johnpatrickgiven.com/jquery/background-resize/

Любая помощь будет принята с благодарностью.

Answer 1

К макету вашей темы добавьте следующее: local.xml

<layout>
    <catalog_category_default>
        <reference name="before_body_end">
            <block type="catalog/category_view" name="back.image" template="page/html/back.image.phtml" />
        </reference>
    </catalog_category_default>
    <catalog_category_layered>
        <reference name="before_body_end">
            <block type="catalog/category_view" name="back.image" template="page/html/back.image.phtml" />
        </reference>
    </catalog_category_layered>
<layout>

Далее, в шаблоне темы создайте файл page/html/back.image.phtml

<?php if ($this->getCurrentCategory()->getImage()): ?>
<div id="back_frame">
    <img class="back_image" src="<?php echo $this->getCurrentCategory()->getImageUrl() ?>" alt="<?php echo $this->getCurrentCategory()->getName() ?>" />
</div>
<?php endif ?>

Наконец добавьте что-то подобноеCSS вашей темы.

.page {
    position: relative;
}
#back_frame {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1;
}
#back_image {
    width: 100%;
}

На самом деле я не проверял ничего из этого, но это кажется достаточно простым для работы.Конечно, это слишком просто, чтобы нуждаться в javascript!