UniVersum Slideshow
Была задача: Растянуть слайдер на всю ширину экрана. И собрать слайдер с шаблона 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.club/wp-content/uploads/2013/09/slaider.rar»]Скачать[/su_button]
Leave a reply
You must login or register to add a new comment .