Секретные записки веб-программиста

ПОРТФОЛИО СТАТЬИ ПОЛЕЗНОСТИ ФОТО ГОСТЕВАЯ КОНТАКТЫ



Метки статей:
100mbru, CentOS, cms, drupal, joomla, LAMP, linux, mysql, nicru, Open-Source, Red Hat, seo, Typo3, ubuntu, авто, администрирование, алгоритмы, алкоголь, бизнес, битрикс, видео, военмех, выборы, германия, джино, домены, интересности, исследования, картинки, кино, кодинг, компьютеры, ливия, магазин, маразм, мастерхост, обработка-изображений, пейнтбол, политика, политэкономия, прикольное-видео, путешествия, работа, религия, рунет, сайтостроение, сео, сми, технологии, украина, форум, хиханьки, холивары, хостинг

Компонент для Битрикс: "Фотогалерея"

- 15-03-12

Теги статьи: битрикс, сайтостроение

Административная часть - стандартный модуль "медиабиблиотека".

Что делает компонент:

  • - отображает превью всех фотографий из заданной коллекции медиабиблиотеки сайта
  • - при наведении курсора на фотографию - всплывает подпись к фото,
  • - при отображении фотографий автоматически наносит на них полупрозрачный логотип и маску (если заданы), масштабирует их и, если задано - подрезает их до заданных габаритов
  • - отображает подписи к фотографиям (если они заданы в медиабиблиотеке и включены в настройках)
  • - отображает нумерацию фото (если она включена в настройках)
  • - при клике по превью раскрывается полноразмерная фотография, вписанная в габариты экрана (fancybox)

Добавление фотографий в галерею и создание галерей - производится стандартными средствами Битрикс в административной панели сайта - в разделе "Контент -> Структура сайта -> Медиабиблиотека".

В настройках вызова компонента задаётся:

  • - ID коллекции медиабиблиотеки (*см.примечания), из которой отбираются все фотографии - задаётся числом (удобно, если коллекций очень много)
  • - ИЛИ коллекцию можно выбрать из списка коллекций (select) - работает, если не указан ID коллекции
  • - размер превью-фотографий
  • - включение/отключение подрезки фотографий до заданных пропорций
  • - файл маски для превью-фотографий (габариты маски должны быть не менее габаритов превьюшек, точная подгонка осуществляется автоматически),
  • - файл логотипа, наносимого на фотографии (на превью и увеличенные фото)
  • - отображаемый размер логотипа (в % от размера картинки)
  • - прозрачность логотипа
  • - месторасположение логотипа на фото (центр или любой из углов, расстояние логотипа от края фото)
  • - включение/отключение подписей или нумерации фотографий в фотогалерее
  • - максимальная длина подписи фотографмм

Для работы компонента требуется подключение jquery (в состав компонента не включены), fancybox - подключается автоматически из папки компонента

Картинки генерятся "на лету" из закачанных, поэтому для смены лого или маски нет необходимости перезаливать фото.

* Для отображения в админке Битрикса ID коллекции требуется доработка файла ядра Битрикса:

// файл /bitrix/js/fileman/medialib/core_admin.js (строка 153),
// строку_____: span = titleDiv.appendChild(BX.create("SPAN", {props: {title: bxspcharsback(oCol.desc || oCol.name)}, text: oCol.name})),
// заменить на: span = titleDiv.appendChild(BX.create("SPAN", {props: {title: bxspcharsback(oCol.desc || oCol.name)}, text: "["+oCol.id+"] "+oCol.name})),


Версия для печати