вРазные полезности

Разделы фотоальбома с картинками на главной странице фотоальбома

При разработке одного проекта я столкнулся с одной незадачей: нужно было вывести на главную страницу фотоальбома все его категории и в качестве «превью» для каждой категории установить последнюю добавленную в нее фотографию. Стандартными средствами uCoz это сделать нельзя, поэтому пришлось прибегнуть к ухищрениям. Я решил выводить категории через информер, а фотографии подгружать при помощи javascript. Сейчас расскажу как я всё реализовал:

1. Создаем информер в панели управления сайтом: http://адрес_сайта.ру/panel/?a=informers

2. Заходим в Управление дизайном информера и вставляем туда следующий код:
Вариант 1:

Code

<a class=»galery_one» href=»$CATEGORY_URL$»><span id=»c$NUMBER$» class=»galery_index»> </span>$CATEGORY_NAME$</a>
<script type=»text/javascript»>$(‘#c$NUMBER$’).load(‘$CATEGORY_URL$ .phtTdMain:first > div > a > img’);</script>

Вариант 2:

Code

<a class=»galery_one» href=»$CATEGORY_URL$»><span id=»c$NUMBER$» class=»galery_index»> </span>$CATEGORY_NAME$</a>
<script type=»text/javascript»>
$.get(«$CATEGORY_URL$», function(data)
var img = $(data).find(‘.phtTdMain:first’).find(‘img’);
$(‘#c$NUMBER$’).html(img);
);
</script>

Вы можете изменить html-разметку под свои нужды, главное чтобы в коде остался вызов скрипта и элемент с id=»c$NUMBER$»

3. В шаблон главной фотоальбома http://адрес_сайта.ру/panel/?a=tmpl;m=9;t=1 вставляем Код вызова информера для шаблонов системы (например $MYINF_1$)

Сохраняем, проверяем результат.

В конце немного пояснений, что же делает скрипт в шаблоне информера: при его вызове скрипт переходит по ссылке $CATEGORY_URL$ в категорию, на странице категории копирует код первой фотографии в этой категории и вставляет это код внутрь блока с id=»c$NUMBER$». Вот почему элемент с таким атрибутом должен обязательно быть в коде информера.

Посмотреть пример работы можно на сайте divakovdance.ru

фотоальбом, информеры, jquery

источник: manual.ucoz.net

Похожие посты