Была задача: Растянуть слайдер на всю ширину экрана. И собрать слайдер с шаблона UniVersum Pro

Тестировал на Opencart 1.5.3

Без замены файлов. (так как шаблоны у всех разные). + vqmod

Но придётся дописать малость в своих шаблонах.

Для шаблона default:

Скопировать всё с архива в корень сайта

Дописать:

В файле \catalog\view\theme\default\template\common\home.tpl

Прописать строку: выделено красным цветом

<?php echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>

<?php echo $flexslideshow_slider; ?>

<div id=»content»><?php echo $content_top; ?>

<h1 style=»display: none;»><?php echo $heading_title; ?></h1>

<?php echo $content_bottom; ?></div>

<?php echo $footer; ?>

В файле: stylesheet.css заменить значения min-height: 400px;

catalog\view\theme\default\stylesheet\stylesheet.css

#content {

min-height: 100%;  

margin-bottom: 25px;

Включить слайдер в админке:

Dimension (W x H): 1350 x380

Position: Slider Box

После этого может растянуться вместе со слайдером footer (у меня так на default шаблоне было, а на metro всё нормально )

В  catalog\view\theme\default\stylesheet\stylesheet.css

Находим #footer {

И прописываем позицию (здесь вы можете изменять как хотите ). Для примера: меняем полностью на

clear: both;
overflow: auto;
min-height: 100px;
padding: 30px;
/*background: #F8F8F8;
border-top: 4px solid #FFFFFF;
border-bottom: 4px solid #FFFFFF;*/
-webkit-box-shadow: 0 0 3px 0 #DDDDDD;
-moz-box-shadow: 0 0 3px 0 #DDDDDD;
box-shadow: 0 0 3px 0 #DDDDDD;
margin: 0 auto;
width:920px;
}

Для других шаблонов:  

Необходимо все файлы которые вы скопировались по пути catalog\view\theme\default

Разложить по папочкам в ваш шаблон

catalog\view\theme\Ваш шаблон

ЭТО:  catalog\view\theme\Ваш шаблон\template\common\flexslideshow_slider.tpl

Прописать сроку: выделено красным цветом: В файле \catalog\view\theme\Ваш шаблон\template\common\home.tpl

<?php echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?>

<?php echo $flexslideshow_slider; ?>

<div id=»content»><?php echo $content_top; ?>

<h1 style=»display: none;»><?php echo $heading_title; ?></h1>

<?php echo $content_bottom; ?></div>

<?php echo $footer; ?>

Скопировать файл flexslideshow.tpl :  catalog\view\theme\Ваш шаблон\template\module\flexslideshow.tpl

FAQ: На данный момент всё что после слайдера (если не резиновый шаблон) может растягиваться 50/50.

Как это исправить: в catalog\view\theme\ТЕМА\template\module

Находим тот модуль который растягивается

Открываем файл tpl (к примеру карусель).

и в самом верху прописываем

</div>
<div id=»carousel<?php echo $module; ?>»>

После этого: ищем СSS модуля и указываем ему размер. (см. Пример footer)

 Делаем резиновый слайдер для всех разрешений экрана:

Меняем строчку в:  catalog\view\theme\hyla\template\module\flexslideshow.tpl

<div style=»width: <?php echo $width; ?>px; height: <?php echo $height; ?>px; background:url(<?php echo $banner[‘image’]; ?>) 50% 0 no-repeat;»></div>

на  <div style=»width: 100%; height: <?php echo $height; ?>px; background:url(<?php echo $banner[‘image’]; ?>) 50% 0 no-repeat;»></div>

[button size=»medium» color=»red» style=»none» new_window=»false» link=»http://www.feofan.net/wp-content/uploads/2013/09/slaider.rar»]Скачать[/su_button]