Next Generation CMS :: Форум поддержки

Заинтересовала наша система? Тогда этот форум для Вас!

Вы не зашли.

#1 2009-02-26 02:37:59

SeeD
Участник
Откуда Москва
Зарегистрирован: 2008-10-13
Сообщений: 158
Рейтинг :   
Сайт

[Хак] Highslide JS - модные превьюшки

Информация не нова и при желании все можно по частям собрать их разных постов, но я так не люблю. Все-таки информация должны быть в одном месте, полная и самодостаточная.

Итак, цель данного хака – использовать для превьюшек механизм плавного всплывания, как, например, на этой тестовой странице. Установка не займет у вас много времени и абсолютно не должна конфликтовать с какими-либо плагинами и хаками. Поехали!

1) На своем сайте в папке engine создайте папку hacks.
2) Скачайте архив из аттача и распакуйте его в только что созданную папку hacks.

У вас должен получиться результирующий путь http://site.ru/engine/hacks/highslide/highslide.js, где site.ru – имя вашего сайта.

3) Откройте файл main.tpl используемого вами шаблона (например, /templates/default/main.tpl) и сразу после {extracss} добавьте:

<style type="text/css" media="all">
@import url(http://site.ru/engine/hacks/highslide/highslide.css);
</style> 
<!-- highslide start  -->
<script type="text/javascript" src="http://site.ru/engine/hacks/highslide/highslide.js"></script>
<script type="text/javascript">    
    hs.graphicsDir = 'http://site.ru/engine/hacks/highslide/graphics/';
</script>
<!-- highslide end  -->

заменяя site.ru на имя вашего сайта.

4) Откройте файл engine/lang/russian/admin/images.ini и замените строки:

insert_thumb    =    "[img="{thumb_url}" border="0" align=""]{file_name}[/img]"
insert_file    =    "[img="{file_url}" border="0" width="{image_width}" height="{image_height}" align=""]{file_name} ({fsize})[/img]"

на:

insert_thumb    =    "[url="{file_url}" onclick="return hs.expand (this)"  class="highslide"][img="{thumb_url}" class="nimg" border="0" align=""]{file_name} ({fsize})[/img][/url]"
insert_file    =    "[img="{file_url}" border="0" width="{image_width}" height="{image_height}" align=""]{file_name} ({fsize})[/img]"

5) Откройте файл engine/includes/classes/parse.class.php, найдите в нем строки:

case 'title':
$v = str_replace(array("\"", ord(0), ord(9), ord(10), ord(13), ":", '<', '>', '&'),array("'",''),$kv);
$outkeys [] = $kn.'="'.$v.'"';
break;

и ниже добавьте:

case 'onclick':
$v = str_replace(array(ord(0), ord(9), ord(10), ord(13), "'", "\"", ";", ":", '<', '>', '&'),'',$kv);
$outkeys [] = $kn.'="'.$v.'"';
break;

Вот и вся установка. Теперь, когда вы будете добавлять в ваши новости превью, для их увеличения будет использоваться библиотека Highslide JS.

Авторы данной инструкции: netduke и d7p4x
Проверенно работает на 0.9.0 Release (Fix #04)
Официальный сайт Highslide JS: http://highslide.com

Изменено SeeD (2009-02-26 02:39:06)


Прикрепленные файлы:
highslide_4012.zip, Размер: 56.2 Кб, Скачано: 1,195

делай, что надо и будь, что будет

Не в сети

#2 2009-02-26 02:42:30

vitaly
Администратор
Откуда Россия
Зарегистрирован: 2008-10-08
Сообщений: 2,790
Рейтинг :   115 

Re: [Хак] Highslide JS - модные превьюшки

Тема перенесена в раздел FAQ.

В сети

#3 2009-02-26 02:47:15

SeeD
Участник
Откуда Москва
Зарегистрирован: 2008-10-13
Сообщений: 158
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

аттач только отвалился при переносе :) и приколоть я тут не имею прав, по всей видимости. на всякий случай, вот:
_http://pspfaqs.ru/highslide_4012.zip


делай, что надо и будь, что будет

Не в сети

#4 2009-02-26 02:53:59

vitaly
Администратор
Откуда Россия
Зарегистрирован: 2008-10-08
Сообщений: 2,790
Рейтинг :   115 

Re: [Хак] Highslide JS - модные превьюшки

SeeD, проверь сейчас, plz.
В форуме FAQ не было ни у кого прав на просмотр аттачей, исправил доступы.

В сети

#5 2009-02-26 02:56:54

SeeD
Участник
Откуда Москва
Зарегистрирован: 2008-10-13
Сообщений: 158
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

качается, все в порядке. спасибо что перенес, я долго думал где создавать, но в FAQ`е все же не решился)


делай, что надо и будь, что будет

Не в сети

#6 2009-04-17 04:21:52

insider
Участник
Зарегистрирован: 2009-01-25
Сообщений: 229
Рейтинг :   35 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

есть еще Lightbox2

Не в сети

#7 2009-04-17 11:52:58

SeeD
Участник
Откуда Москва
Зарегистрирован: 2008-10-13
Сообщений: 158
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

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


делай, что надо и будь, что будет

Не в сети

#8 2009-05-23 20:10:05

Сокол
Участник
Откуда Красноярск
Зарегистрирован: 2009-05-23
Сообщений: 227
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

всё сделал точно по инструкции - хайслайд не пашет!
вставлял в запись и превьюшки и "мини-картинки" - при клике открывает само изображение из папки загрузки... :(
движок - последний релиз. что может быть не так?

Не в сети

#9 2009-05-23 21:08:20

SeeD
Участник
Откуда Москва
Зарегистрирован: 2008-10-13
Сообщений: 158
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

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


делай, что надо и будь, что будет

Не в сети

#10 2009-10-10 22:29:34

RMC
Участник
Зарегистрирован: 2009-07-01
Сообщений: 151
Рейтинг :   
Сайт

Re: [Хак] Highslide JS - модные превьюшки

а как сделать, чтобы для одиночных фоток был один стиль Highslide, а для галерей - другой.
так все работает, но вот такая "фишка" не получается.. ;)

Не в сети

#11 2009-12-11 21:37:42

Herm
Участник
Зарегистрирован: 2009-12-11
Сообщений: 20
Рейтинг :   

Re: [Хак] Highslide JS - модные превьюшки

Здравствуйте. Помогите, пожалуйста, разобраться. Адрес нашего сайта: http://kempo-ekb.ru

Хочу сделать такие превьюшки. Но в моем файле main.tpl нету строки {extracss}. Вообще ничего подобного. Использую шаблон st05. Все настроено, Шаблон менять не хочу. Но скрипт не работает. Видимо не туда вставил код. Подскажите точнее, куда нужно его вставлять. Заранее спасибо.

Не в сети

#12 2009-12-11 22:04:37

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

Никогда не понимал людей, которые удаляют копирайты и после этого идут на форум-поддержки за помощью...

Не в сети

#13 2009-12-11 22:29:38

Herm
Участник
Зарегистрирован: 2009-12-11
Сообщений: 20
Рейтинг :   

Re: [Хак] Highslide JS - модные превьюшки

Дизайном собственно и не я занимался. И сразу критика. Без разбору. Извините за беспокойство, в таком случае.

upd: Копирайты расставил. Я новичок, нашару делаю так сказать, и попросту не уделил этому внимания. Буду умней в будущем.

Изменено Herm (2009-12-11 22:43:55)

Не в сети

#14 2009-12-11 22:34:31

Trashcka
Участник
Откуда КиевГрад
Зарегистрирован: 2008-12-04
Сообщений: 1,487
Рейтинг :   73 

Re: [Хак] Highslide JS - модные превьюшки

infinity237, че то ты злой сегодня такой :) всех ругаешь.

Herm, вставлять в любое место :lol: *я пошлячка* между <head>  и </head>

Не в сети

#15 2009-12-11 22:53:51

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

Trashcka пишет:

infinity237, че то ты злой сегодня такой :) всех ругаешь.

Не злой, а справедливый. :) Просто оставить копирайты - это тот минимум, который может сделать любой пользователь, тем самым поддержав проект.

По теме:
{extracss} = {htmlvars}, так что код надо вставлять после {htmlvars}. Остальное должно работать и с 0.9.1, если не заработает пишите будем думать вместе.

Не в сети

#16 2009-12-11 23:05:51

Herm
Участник
Зарегистрирован: 2009-12-11
Сообщений: 20
Рейтинг :   

Re: [Хак] Highslide JS - модные превьюшки

Я попробовал поддержать проект, копирайт поставил!) Дада, я вот только что сам понял, что {htmlvars} таже вещь, что и {extracss"}. Потому что по умолчанию в шаблоне была эта строка, я посмотрел. Но я ее по неопытности удалил, потому что она вылезала сверху шапки сайта. Сейчас заменил ее на {extracss}, она встала на место похоже, но работать все равно не хочет скрипт. Еще так интересно, зашел на страничку Сида, с пспфакс(мой любимый сайт!), посмотрел его пример работы скрипта:

<a href="http://pspfaqs.ru/uploads/images/default/rabochii_stol.jpg" onclick="return hs.expand (this)" class="highslide"><img src="http://pspfaqs.ru/uploads/images/default/thumb/rabochii_stol.jpg" class="nimg" border="0" alt="rabochii_stol.jpg (1.67 Kb)" /></a>

У меня почему то при вставке изображения превью с помощью админки, код такой :

[url=http://kempo-ekb.ru/uploads/images/default/nguenvan_duc.jpg" target="_blank][img="http://kempo-ekb.ru/uploads/images/default/thumb/nguenvan_duc.jpg" border="0" align=""]nguenvan_duc.jpg (56.27 Kb)[/img][/url]

Может быть это как то связано... потому что при вставке кода Сида на мою страницу, для проверки, все работает!

Изменено Herm (2009-12-11 23:06:33)

Не в сети

#17 2009-12-11 23:10:23

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

1. Какую версию NGCMS вы используете?
2. Как давно вы скачивали шаблон st05? (Просто 8.11.2009 он был обновлён под 0.9.1 версию CMS)
3. pspfaqs.ru - это уже не NGCMS, а DLE, так что варианты реализации могут быть разными.
4. Вы точно сделали всё что требуется по инструкции? (В частности пункт 4)

Изменено infinity237 (2009-12-11 23:11:54)

Не в сети

#18 2009-12-11 23:34:52

Herm
Участник
Зарегистрирован: 2009-12-11
Сообщений: 20
Рейтинг :   

Re: [Хак] Highslide JS - модные превьюшки

1) Версия 0.9.0
2) Шаблон давно, но вроде подходит.
4) Перепроверил, да, давайте на ты, мне так гораздо удобней и уютней.

Вот файл parse.class.php, точнее нужный отрывок:

				foreach ($keys as $kn => $kv) {
					switch ($kn) {
						case 'class':
						case 'target':
							$v = str_replace(array(ord(0), ord(9), ord(10), ord(13), ' ', "'", "\"", ";", ":", '<', '>', '&'),'',$kv);
							$outkeys [] = $kn.'="'.$v.'"';
							break;
						case 'title':
							$v = str_replace(array("\"", ord(0), ord(9), ord(10), ord(13), ":", '<', '>', '&'),array("'",''),$kv);
							$outkeys [] = $kn.'="'.$v.'"';
							break;
case 'onclick':
$v = str_replace(array(ord(0), ord(9), ord(10), ord(13), "'", "\"", ";", ":", '<', '>', '&'),'',$kv);
$outkeys [] = $kn.'="'.$v.'"';
break;
					}

Вот отрывок images.ini

insert_thumb    =    "[url="{file_url}" onclick="return hs.expand (this)"  class="highslide"][img="{thumb_url}" class="nimg" border="0" align=""]{file_name} ({fsize})[/img][/url]"
insert_file    =    "[img="{file_url}" border="0" width="{image_width}" height="{image_height}" align=""]{file_name} ({fsize})[/img]"
insert_preview	=	"[url="{file_url}" target="_blank"][img="{thumb_url}" border="0" align=""]{file_name} ({fsize})[/img][/url]"

и Все равно не работает :(

[hr /]
Я уже раздумывал о том, что может быть, скрипт работает только в категориях, то бишь, в новостях, а в статик страницах - нет?

Изменено Herm (2009-12-11 23:39:52)

Не в сети

#19 2009-12-12 00:00:49

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

Каким образом ты вставляешь изображение в новость? Через загрузчик изображений или вручную через тег img?
Просто если вручную через img то нужно обезательно добавлять для уменьшенной копии код onclick="return hs.expand (this)"  class="highslide" или предватительно прописать его в шаблоне engine/skins/default/tpl/quicktags.tpl.

P.S. Если всё сделано по инструкции, то в 0.9.0 должно работать, только что проверил.

Изменено infinity237 (2009-12-12 00:04:11)

Не в сети

#20 2009-12-12 18:36:55

Herm
Участник
Зарегистрирован: 2009-12-11
Сообщений: 20
Рейтинг :   

Re: [Хак] Highslide JS - модные превьюшки

Всем привет!) Немного продвинулся, кажется, скрипт то сам по себе работает, это можно проследить по ссылке:
http://kempo-ekb.ru/?action=static&altname=resistance

Но чтобы этого достичь, я много шаманил с ссылкой Сида...:

<a href="http://kempo-ekb.ru/uploads/images/default/nguenvan_duc.jpg" onclick="return hs.expand (this)" class="highslide"><img src="http://kempo-ekb.ru/uploads/images/default/thumb/nguenvan_duc.jpg" class="nimg" border="0" alt="rabochii_stol.jpg (1.67 Kb)" /></a>

Автоматически же ниче не работает (это вторая превьюшка на странице). Что может быть не так? я хочу чтобы все работало с одной кнопки.

Не в сети

#21 2009-12-12 19:58:32

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

См. сообщение выше, там всё написано.

Не в сети

#22 2009-12-21 20:21:56

vl
VIP любит этого пользователя.
Откуда ua
Зарегистрирован: 2008-10-14
Сообщений: 664
Рейтинг :   14 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

В админке вообще без этого полезнейшего скрипта тяжело просматривать вставляемые картинки.    Да и в новостях он прекрасно смотрится

Не в сети

#23 2009-12-21 22:04:35

Wolverine
Модератор
Откуда Домодедово
Зарегистрирован: 2008-10-13
Сообщений: 3,538
Рейтинг :   160 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

По инструкции в шапке в админке hs не появится.

Для этого идем в  engine/skins/default/index.php и в переменную $skin_header добавляем

<style type="text/css" media="all">
@import url(http://site.ru/engine/hacks/highslide/highslide.css);
</style> 
<!-- highslide start  -->
<script type="text/javascript" src="http://site.ru/engine/hacks/highslide/highslide.js"></script>
<script type="text/javascript">    
    hs.graphicsDir = 'http://site.ru/engine/hacks/highslide/graphics/';
</script>
<!-- highslide end  -->

Затем идем в engine\includes\inc\file_managment.php и заменяем строчку

$tvars['vars']['view_file']      = '<a target="_blank" href="'.$fileurl.'"><img src="'.skins_url.'/images/insert_image.gif" border="0"/></a>';

на:

$tvars['vars']['view_file']      = '<a href="'.$fileurl.'" class="highslide" onclick="return hs.expand (this)"><img src="'.skins_url.'/images/insert_image.gif" border="0"/></a>';

И

$tvars['vars']['view_thumb']     = $row['preview'] ? '<a target="_blank" href="'.$thumburl.'"><img src="'.skins_url.'/images/insert_thumb.gif" border="0"/></a>' : '';

заменяем на:

$tvars['vars']['view_thumb']     = $row['preview'] ? '<a href="'.$thumburl.'" class="highslide" onclick="return hs.expand (this)"><img src="'.skins_url.'/images/insert_thumb.gif" border="0"/></a>' : '';

ИМХО эту фишку можно и в движок вшить.

P.S. И класс и class="nimg надо заменить на class="highslide"

Изменено Wolverine (2009-12-21 22:16:52)

Не в сети

#24 2009-12-21 22:40:54

infinity237
Модератор
Откуда Russia, Moscow
Зарегистрирован: 2008-11-09
Сообщений: 2,674
Рейтинг :   176 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

Wolverine пишет:

По инструкции в шапке в админке hs не появится.

Спасибо кэп... :D
В теме вообще то ничего не говорится о админке...

Wolverine пишет:

ИМХО эту фишку можно и в движок вшить.

50кб - ради чего?

Не в сети

#25 2009-12-21 22:43:48

Wolverine
Модератор
Откуда Домодедово
Зарегистрирован: 2008-10-13
Сообщений: 3,538
Рейтинг :   160 
Сайт

Re: [Хак] Highslide JS - модные превьюшки

infinity237 пишет:
Wolverine пишет:

По инструкции в шапке в админке hs не появится.

Спасибо кэп... :D
В теме вообще то ничего не говорится о админке...

При чем тут тема? Я про:

vl пишет:

В админке вообще без этого полезнейшего скрипта тяжело просматривать вставляемые картинки.

infinity237 пишет:

50кб - ради чего?

удобства ради

Не в сети

Подвал раздела

Работает на FluxBB