Перейти к содержимому


Фото
* * * * * 11 голосов

Модуль Слайдер

слайдер slider

  • Чтобы отвечать, сперва войдите на форум
152 ответов в теме

#1 chocolate_moles

chocolate_moles
  • Фрилансер
  • 328 сообщений
  • Верстка
  • Версия CMS:2.x

Опубликовано 29.09.2013 - 12:36

Модуль управления слайдером через панель администратора
  • Добавление, удаление, изменение очередности слайдов через админку
  • Добавление ссылок и описания
  • Адаптивыный слайдер Nivo Slider
  • Подробная инструкция по установке

Прикрепленный файл  front_view.jpg   78,69К   2845 раз скачано Прикрепленный файл  slides.jpg   50,68К   3629 раз скачано Прикрепленный файл  add_slide.jpg   60,46К   2797 раз скачано

Прикрепленные файлы:


Изменено: chocolate_moles, 10.10.2015 - 18:47


#2 Danya

Danya
  • Фрилансер
  • 899 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:1.x, 2.x

Опубликовано 29.09.2013 - 18:04

chocolate_moles

 

Спасибо большое. Молодец!

 

Можно ещё добавить включение и выключение картинки, чтобы не удалять, а когда нужно включать!



#3 Danya

Danya
  • Фрилансер
  • 899 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:1.x, 2.x

Опубликовано 29.09.2013 - 19:38

ДОПОЛНЕНИЕ

 

1. в базе в s_slides добавляем поле visible:

ALTER TABLE `s_slides` ADD `visible` TINYINT( 1 ) NOT NULL DEFAULT '1' AFTER `name`

2. в api/Slides.php добавляем в get_slide:

visible,

в этом же файле, ниже в get_slides добавляем:

visible,

3. в файле simpla/design/html/sliders.tpl заменить:

{foreach $slides as $slide}            
<div class="row">

на

{foreach $slides as $slide}            
<div class="{if !$slide->visible}invisible{/if} row">

далее, после:

<a class="delete"  title="Удалить" href="#"></a>

добавляем:

<a class="enable" title="Активна" href="#"></a>

далее, перед:

<option value="delete">Удалить</option>

добавляем:

<option value="enable">Сделать видимыми</option>
<option value="disable">Сделать невидимыми</option> 

ниже в скриптах добавляем:

// Включение и выключение изображения    
$("a.enable").click(function() {
        var icon        = $(this);
        var line        = icon.closest(".row");
        var id          = line.find('input[type="checkbox"][name*="check"]').val();
        var state       = line.hasClass('invisible')?1:0;
        icon.addClass('loading_icon');
        $.ajax({
            type: 'POST',
            url: 'ajax/update_object.php',
            data: {'object': 'slide', 'id': id, 'values': {'visible': state}, 'session_id': '{/literal}{$smarty.session.id}{literal}'},
            success: function(data){
                icon.removeClass('loading_icon');
                if(state)
                    line.removeClass('invisible');
                else
                    line.addClass('invisible');
            },
            dataType: 'json'
        });
        return false;
    });

4. в файле simpla/SlidesAdmin.php в if($this->request->method('post')) после:

switch($this->request->post('action'))            
{

добавляем

case 'disable':                
{
                    foreach($ids as $id)
                        $this->slides->update_slide($id, array('visible'=>0));
                    break;
}
case 'enable':
{
                    foreach($ids as $id)
                        $this->slides->update_slide($id, array('visible'=>1));
                    break;
}

5. в шаблоне сайта в файле slider/slider.tpl вывод картинки обернуть:

{if $s->visible}вывод картинки{/if}

6. в файле simpla\ajax\update_object.php добавляем:

case 'slide':
        if($simpla->managers->access('slides'))
        $result = $simpla->slides->update_slide($id, $values);        
break;

7. в файле slides.css добавляем:

.slide .title .enable{    float:right;
    background-image: url(../images/lightbulb.png);
    padding: 8px;
    margin: 2px;
    zoom: 1;
    background-position: center center;
    background-repeat: no-repeat;
}
.invisible .slide .title .enable{
    float:right;
    background-image: url(../images/lightbulb_off.png);
    padding: 8px;
    margin: 2px;
    zoom: 1;
    background-position: center center;
    background-repeat: no-repeat;
}

Теперь есть возможность выключать/включать картинку



#4 bjiaguk

bjiaguk
  • Пользователь
  • 19 сообщений
  • Дизайн, Верстка
  • Версия CMS:1.x, 2.x

Опубликовано 07.11.2013 - 15:04

возникло несколько вопросов по Дополнению:
2. в api/Slides.php добавляем в get_slide: visible, - нельзя ли для новичков чуть подробнее? куда тут добавлять-то
 

	/*
	*
	* Функция возвращает слайд по его id или url
	*
	*/
	public function get_slide($id)
	{
		if(is_int($id))			
			$filter = $this->db->placehold('id = ?', $id);
		else
			$filter = $this->db->placehold('url = ?', $id);
		$query = "SELECT id, name, url, description, image, position
								 FROM __slides WHERE $filter ORDER BY position LIMIT 1";
		$this->db->query($query);
		return $this->db->result();
	}

5. в шаблоне сайта в файле slider.tpl вывод картинки обернуть:

 

{if $s->visible}вывод картинки{/if}
 

тоже не ясно куда это записывать.

Лампочки на слайдах появились - имитируют работу, выпадающий список предлагает сделать слайды видимым/невидимым, но они не отключаются. Подозреваю не туда визибл с выводом картинок вставил.



#5 Sulla

Sulla
  • Пользователь
  • 2 сообщений
  • Программирование, Заказчик
  • Версия CMS:2.x
  • Откуда:Москва

Опубликовано 14.11.2013 - 00:48

Тут 2. в api/Slides.php добавляем в get_slide: visible, - в запрос , выделено: 
 

	
	public function get_slide($id)
	{
...
		$query = "SELECT id, name, visible, url, description, image, position
								 FROM __slides WHERE $filter ORDER BY position LIMIT 1";
...
	}

5. в шаблоне сайта в файле slider.tpl вывод картинки обернуть:

{if $s->visible}
<div class="slider-wrapper theme-default">
....        
</div>
...
{/if}
<script type="text/javascript">
$(window).load(function() {
Так понятнее ?   


#6 Danya

Danya
  • Фрилансер
  • 899 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:1.x, 2.x

Опубликовано 14.11.2013 - 15:00

Второй пункт правильно!

 

В пятом пункте нужно обернуть в файле /slider/slider.tpl вот так:

{foreach $slide as $s}

{if $s->visible}               
{if $s->image}                 
{if $s->url}<a href="{$s->url}">{/if}                  
<img src="{$s->image}" alt="" {if $s->description}title="#slide_{$s->id}"{/if} />                   
{if $s->url}</a>{/if}                
{/if}  
{/if}          
{/foreach}


#7 Vasiliy-lv

Vasiliy-lv
  • Пользователь
  • 17 сообщений
  • Версия CMS:2.x

Опубликовано 30.11.2013 - 07:27

chocolate_moles, Спасибо всё работает отлично  :) 

#8 Noxter

Noxter

    Simpla Developer

  • Фрилансер
  • 4 488 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:2.x
  • Откуда:Киев

Опубликовано 30.11.2013 - 14:54

А зачем делать проверку в шаблоне условием {if $s->visible} если можно сразу в функции выбора слайдов это сделать, т.е. в api?

#9 Виталий Анатольевич

Виталий Анатольевич
  • Фрилансер
  • 308 сообщений
  • Программирование, Верстка
  • Версия CMS:1.x, 2.x
  • Откуда:Москва

Опубликовано 03.12.2013 - 17:42

А зачем делать проверку в шаблоне условием {if $s->visible} если можно сразу в функции выбора слайдов это сделать, т.е. в api?

 

В админке ведь нужно отображать и выключенные слайды

 

PS Было бы хорошо поставить ресайзер... ну или могу сам накатать "дополнение"



#10 Noxter

Noxter

    Simpla Developer

  • Фрилансер
  • 4 488 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:2.x
  • Откуда:Киев

Опубликовано 03.12.2013 - 18:13

В админке ведь нужно отображать и выключенные слайды

 

PS Было бы хорошо поставить ресайзер... ну или могу сам накатать "дополнение"

Ну а в чем проблема использовать фильтр т.е. $filter['visible']?



#11 Виталий Анатольевич

Виталий Анатольевич
  • Фрилансер
  • 308 сообщений
  • Программирование, Верстка
  • Версия CMS:1.x, 2.x
  • Откуда:Москва

Опубликовано 03.12.2013 - 18:32

эту причину  никто кроме разработчика не знает :)



#12 antin

antin
  • Пользователь
  • 32 сообщений

Опубликовано 19.12.2013 - 15:36

Если в друг кто то неумеет самостоятельно устанавливать, обращайтесь к автору chocolate_moles

Я сам несмог поставить, мучался день (безрукий)

chocolate_moles установил все за 15 мин, понятное дело за вознаграждение, за это ему спасибо!



#13 partizzzzzan

partizzzzzan
  • Пользователь
  • 49 сообщений

Опубликовано 20.12.2013 - 00:27

Думаю данное решение нужно бы включить в дистрибутив SImpla



#14 Reni

Reni
  • Пользователь
  • 67 сообщений
  • Версия CMS:2.x
  • Откуда:Санкт-Петербург

Опубликовано 13.01.2014 - 10:11

Данный модуль работает на 2.2.4? Все сделал в точности как в описании, но даже в админке ничего не появилось.

 

 

 

Все, разобрался...

 

Если у вас версия 2.1.5 и ниже, пропустите этот шаг, и переходите к настройке базы данных

Откройте файл api/Managers.php и добавьте

Хоть у меня и 2.2.4 но я решил не пропускать этот шаг и все заработало)

 

 

Почему то сначала загружается сайт, и спустя некоторое время подгружается слайдер. Это его особенность или я что-то не так сделал?


Изменено: Reni, 13.01.2014 - 10:35


#15 Mike

Mike
  • Пользователь
  • 7 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:2.x

Опубликовано 13.01.2014 - 18:59

Спасибо за слайдер, очень круто сделано! Поставил сразу, с первого раза удачно.



#16 venDETTa

venDETTa
  • Пользователь
  • 61 сообщений
  • Программирование, Верстка
  • Версия CMS:2.x

Опубликовано 24.01.2014 - 09:58

Почему то сначала загружается сайт, и спустя некоторое время подгружается слайдер. Это его особенность или я что-то не так сделал?

 

Таже фигня и это не комильфо, надо как-то пофиксить это



#17 chocolate_moles

chocolate_moles
  • Фрилансер
  • 328 сообщений
  • Верстка
  • Версия CMS:2.x

Опубликовано 24.01.2014 - 18:14

Таже фигня и это не комильфо, надо как-то пофиксить это

 
Нужно выставить высоту контейнера в файле slider/css/nivo-slider.css

 

.nivoSlider {
    position:relative;
    width:100%;
    height:auto;
    overflow: hidden;
   
height: 350px; // Высота равна высоте ваших изображений
}



#18 nitrol

nitrol
  • Пользователь
  • 73 сообщений

Опубликовано 25.01.2014 - 11:09

у меня после внесения изменения из апдейта перестали на сайте отображаться. в коде страницы 

<div id="content">
			<h1>Главная</h1>

	<script src="slider/js/jquery.nivo.slider.pack.js" type="text/javascript"></script>
	<link rel="stylesheet" href="slider/css/nivo-slider.css" type="text/css" media="screen">
	<link rel="stylesheet" href="slider/css/themes/default/default.css" type="text/css" media="screen">
						<div id="slide_1" class="nivo-html-caption">
				123123
			</div>
								<div id="slide_2" class="nivo-html-caption">
				kfrf[jcn
			</div>
			
	<script type="text/javascript">
	$(window).load(function() {
		$('#slider').nivoSlider({
			pauseTime: 5000
		});
	});
	</script>


подскажите что не так? буд-то они постоянно стали скрытыми

 

разобрался, не там обернул проверку в тпл шаблоне



#19 venDETTa

venDETTa
  • Пользователь
  • 61 сообщений
  • Программирование, Верстка
  • Версия CMS:2.x

Опубликовано 26.01.2014 - 20:59

 
Нужно выставить высоту контейнера в файле slider/css/nivo-slider.css

 

это конечно понятно, фишка в том что происходит инициализация слайдера и это занимает время. В это время должна отображаться первая картинка, а сейчас только после инициализации скрипта появляется первая картинка.



#20 Noxter

Noxter

    Simpla Developer

  • Фрилансер
  • 4 488 сообщений
  • Дизайн, Программирование, Верстка
  • Версия CMS:2.x
  • Откуда:Киев

Опубликовано 26.01.2014 - 21:52

это конечно понятно, фишка в том что происходит инициализация слайдера и это занимает время. В это время должна отображаться первая картинка, а сейчас только после инициализации скрипта появляется первая картинка.

Картинка появляется после инициализации слайдера.





Также с меткой «слайдер, slider»

0 пользователей читают эту тему

0 пользователей, 0 гостей, 0 скрытых