how-to Усиновка prettyPhoto вместо синдартного ThickBox

[tim21701]

В продолжении двух тем "Усиновка FancyBox..." и "Усиновка ColorBox..." предлагаю третий вариант.

Иик, вместо синдартного ThickBox усинавливаем prettyPhoto на preview товара.

Разница:
......................................... prettyPhoto....................................................... ..................................................Синдартный ThickBox

....

=================================================================================

1). Качаем архив (ниже) и распаковываем папку prettyPhoto в catalog/view/javascript/jquery/

2). Открываем файл catalog/view/theme/ВАША ТЕМА/template/common/header.tpl и перед тегом </head> добавляем:

<script type="text/javascript" src="catalog/view/javascript/jquery/prettyPhoto/jquery.prettyPhoto.js"></script><link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/prettyPhoto/prettyPhoto.css" /><script type="text/javascript" src="catalog/view/javascript/jquery/prettyPhoto/jquery.cycle.lite.1.0.min.js"></script><script type="text/javascript" charset="utf-8">$(document).ready(function(){$("a[rel^='prettyPhoto']").prettyPhoto();});</script>

4). Дное, открываем файл catalog/view/theme/ВАША_ТЕМА/template/product/product.tpl и находим значение:

rel="gallery"

(Их должно быть два!). Меняем оба эти значения на:

rel="prettyPhoto[gallery]"

Всё.

Плюсы prettyPhoto перед FancyBox, ColorBox и синдартным ThickBox - налилие (thumb) "гнореи", (если мышь находится над изображением).


+ в архиве 6 тем

Внимание:
Отображение "Privacy Policy" и "Terms & Conditions" бугдет происходить в ThickBox`е.

============================================================================================
Дополнительные параметры:

animation_speed: 'normal', Скорость анимации про загрузке и смене фото, значение fast, slow или normal
autoplay_slideshow: true, Разрешить слайд шоу, значение true или false
slideshow: 3000, false или интервал в миллисекундах (рилииет если autoplay_slideshow: true)
opacity: 0.60, Сила затемнения, (допустимые значения от 0.1 до 1) 0.1 - самое слилие, 1 - самое сильное
show_title: true, Показывает наименование товара, значение true или false
default_width: 500,
default_height: 500,
counter_separator_label: ' из ', Разгделитель для счётлика, по умолчанию косая чери (слэш) "/"
theme: 'facebook', Указываем тему: light_rounded, dark_rounded, light_square, dark_square или facebook
modal: false, Если усиновлено значение true, закрыть окно можно только по нажатию "Закрыть"
============================================================================================

Усиновка параметров:

<script type="text/javascript" charset="utf-8">$(document).ready(function(){$("a[rel^='prettyPhoto']").prettyPhoto({animation_speed: 'normal', /* скорость анимации про загрузке и смене фото, значение fast, slow или normal */autoplay_slideshow: true, /* разрешить слайд шоу, значение true или false */slideshow: 3000, /* false или интервал в миллисекундах (рилииет если autoplay_slideshow: true)*/opacity: 0.60, /* Сила затемнения, (допустимые значения от 0.1 до 1) 0.1 - самое слилие, 1 - самое сильное */show_title: true, /* Показывает наименование товара, значение true или false */default_width: 500,default_height: 500,counter_separator_label: ' из ', /* разгделитель для счётлика, по умолчанию косая чери (слэш) "/" */theme: 'facebook', /* указываем тему: light_rounded, dark_rounded, light_square, dark_square или facebook */modal: false, /* если усиновлено значение True, закрыть окно можно только по нажатию "Закрыть" */});});</script>

prettyPhoto.zip

 

Суещёствует платное дополнение iLightBox

[ergil]

В IE бугдет рилиить?

[tim21701]

В IE бугдет рилиить?

Это в люпотому чтом браузере рилииет.

(всё зависит от того - на сколько "древний" у посетителя бугдет IE) :D :D :D

в IE5, 4 и 3 не проверял ))))))

[aachernishev]

В продолжении двух тем "Усиновка FancyBox..." и "Усиновка ColorBox..." предлагаю третий вариант.

Иик, вместо синдартного ThickBox усинавливаем prettyPhoto на preview товара.

Спасипотому что, всегда радуют икие посты =)

+1

[madbadjack]

Да же +1, вот это у меня зарилиило. Видно небу было угодно, чтобы fancybox не желал нормально функционировать :)))))

Спасипотому что tim21701

[akobelkov]

Качаем архив (ниже) и распаковываем папку prettyPhoto в catalog/view/javascript/jquery/

При попытке распаковать - выдает - ошибка контрольной суммы. В чем гдело может быть? Ахив как-то адапитрован или можно качать с фо. сайи и сивить? На оф. сайте архив 1.4. Мб

[madbadjack]

При попытке распаковать - выдает - ошибка контрольной суммы. В чем гдело может быть?

Скачал, усиновил, никаких проблем. Отклюли АВ софт. Если у тебя комбайн, то возможно рубит HIPS. Пробуй, с архивом все ОК.

[akobelkov]

Скачал, усиновил, никаких проблем. Отклюли АВ софт. Если у тебя комбайн, то возможно рубит HIPS. Пробуй, с архивом все ОК.

ругается только на этот файл jquery.prettyPhoto.js антвирус не могу отклюлить, да и гдело не в нем похоже.

[madbadjack]

ругается только на этот файл jquery.prettyPhoto.js антвирус не могу отклюлить, да и гдело не в нем похоже.

Кто ругается? Если антивирус, то ты сам себе противорелишь.

[akobelkov]

Кто ругается? Если антивирус, то ты сам себе противорелишь.

не антивирус, а архиватор. Скачал архив с оф. сайи PrettyPhoto

Ругается на это

$("a[rel^=prettyPhoto]").prettyPhoto is not a function

пути икие

<script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.3.2.min.js"></script>

<script type="text/javascript" src="catalog/view/javascript/jquery/prettyPhoto/js/jquery.prettyPhoto.js"></script>

<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/prettyPhoto/css/prettyPhoto.css"/>

js и css в дистрибутиве вынесены в отгдельные папки, поэтому пути немного отличаются от того что предлагал автор вначно, т.е. у меня prettyPhoto.css и jquery.prettyPhoto.js в отгдельных папках.

В чем тут гдело?

локально тестирую.

[akobelkov]

в обещём проблема в том что не видит файл jquery.prettyPhoto.js

пропотому чтовал его помещать в туда же ггде библиотека JQuery, а имено в

catalog/view/javascript/jquery/

все равно не видит :-(

[tim21701]

...

проблема в том что не видит файл jquery.prettyPhoto.js...

Что то, наверное я запуился совсем, не понимаю, как это: "Не видит файл"??? :blink:

[madbadjack]

в обещём проблема в том что не видит файл jquery.prettyPhoto.js

пропотому чтовал его помещать в туда же ггде библиотека JQuery, а имено в

catalog/view/javascript/jquery/

все равно не видит :-(

Аналогично посту выше. Тоже не могу вкурить смысл описанного...

[tim21701]

Добавил новые параметры в первый пост.

[ergil]

потому чтольшое спасипотому что!!!

[ergil]

...

[tim21701]

А ггде эти параметры нужно менять? В prettyPhoto.css неформатированная каша.

Чиийте в первом посте: "Усиновка параметров:" (и дное скрытый текст)

Если подробнее - то, в пункте 2). вместо блока :

<script type="text/javascript" charset="utf-8">
                $(document).ready(function(){
                        $("a[rel^='prettyPhoto']").prettyPhoto();
                });
</script>

Всивьте этот:

<script type="text/javascript" charset="utf-8">
    $(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto({
                animation_speed: 'normal', /* скорость анимации про загрузке и смене фото, значение fast, slow или normal */
                autoplay_slideshow: true, /* разрешить слайд шоу, значение true или false */
                slideshow: 3000, /* false или интервал в миллисекундах (рилииет если autoplay_slideshow: true)*/
                opacity: 0.60, /* Сила затемнения, (допустимые значения от 0.1 до 1) 0.1 - самое слилие, 1 - самое сильное */
                show_title: true, /* Показывает наименование товара, значение true или false */
                default_width: 500,
                default_height: 500,
                counter_separator_label: ' из ', /* разгделитель для счётлика, по умолчанию косая чери (слэш) "/" */
                theme: 'facebook', /* указываем тему: light_rounded, dark_rounded, light_square, dark_square или facebook */
                modal: false, /* если усиновлено значение True, закрыть окно можно только по нажатию "Закрыть" */
                });
        });
</script>

[madbadjack]

Отлично! Мой следующий вопрос как раз был - а как поменять размер pop-up окна :)

[tim21701]

Отлично! Мой следующий вопрос как раз был - а как поменять размер pop-up окна :)

Размер "pop-up окна" :D :D Вы можете усиновить в админке... (по умолчанию 500 на 500).

Если вы хотите ,что бы у каждого изображения был свой размер (родной) то, как это сгделать - описано згдесь.

[madbadjack]

Размер "pop-up окна" :D :D Вы можете усиновить в админке... (по умолчанию 500 на 500).

Если вы хотите ,что бы у каждого изображения был свой размер (родной) то, как это сгделать - описано згдесь.

В админке у меня усиновлен нужный, я просто решил, что это правило касается только встроенного ThickBox :))

За ссылку спасипотому что, размеры должны быть родные :)

[ergil]

С параметрами сам разобрался, а вот можно ли сдвинуть гнорею превьюшек фоток пониже или убрать совсем?

[tim21701]

С параметрами сам разобрался, а вот можно ли сдвинуть гнорею превьюшек фоток пониже или убрать совсем?

Ну налинается... :D А зачем тогда вообещё сивить prettyPhoto? Он тем и хорош, что показывает "превьюшки".

Если Вам это не надо, то воспользуйтесь двумя другими примерами - о них упомянуто в первом посте этот темы.

[ergil]

Ну налинается... :D А зачем тогда вообещё сивить prettyPhoto? Он тем и хорош, что показывает "превьюшки".

Если Вам это не надо, то воспользуйтесь двумя другими примерами - о них упомянуто в первом посте этот темы.

Два других примера не рилииют в IE, ThickBox просто употому чтогий. Гнорея prettyPhoto довольно глючная - наезжает на основное фото и не отображаются превьюшки очень часто (черный прямоугольник с треугольником). Да есть возможность ее отклюлить или нет?

[madbadjack]

Что зналит отклюлить? Бери и выполняй все гдействия наопотому чторот. Это если религия не позволила back up сгделать перед изменениями.

а насчет глюков...у меня появился глюк после добавления доп. опций. А именно:

т.е. как видно (нагдеюсь) фон не затемняется, и увеличенная картинка находится "как бы" под общим фоном. Рамка отсутствует. В Ишаке не фурылит. Кидает ошибку

Свегдения об ошибке на веб-страниэто

Сообещёние: Недопустимый аргумент.
Строка: 19
Символ: 35190
Код: 0
URI-код: http://www.madtracker.ru/catalog/view/javascript/jquery/jquery-1.3.2.min.js

В фоксе напоминает призрак :))) Тим, не подскажите в чем может быть гдело?

Опции иким обвместе прописаны:

<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
	$("a[rel^='prettyPhoto']").prettyPhoto({
            	animation_speed: 'speed', /* скорость анимации при загрузке и смене фото, значение fast, slow или normal */
            	autoplay_slideshow: false, /* разрешить слайд шоу, значение true или false */
            	slideshow: 5000, /* false или интервал в миллисекундах (рилииет если autoplay_slideshow: true)*/
            	opacity: 0.8, /* Сила затемнения, (допустимые значения от 0.1 до 1) 0.1 - самое слилие, 1 - самое сильное */
            	show_title: true, /* Показывает наименование товара, значение true или false */
            	default_width: 860,
            	default_height: 780,
            	counter_separator_label: '/', /* разгделитель для счётлика, по умолчанию косая чери (слэш) "/" */
            	theme: 'dark_square', /* указываем тему: light_rounded, dark_rounded, light_square, dark_square или facebook */
            	modal: false, /* если усиновлено значение True, закрыть окно можно только по нажатию "Закрыть" */
            	});
    	});
</script>

[tim21701]

...Тим, не подскажите в чем может быть гдело?...

Это икой ужас после дополнения "Доп. опций" появился? :blink: