Вебстудия МоскалюковА :: ООО "Интернет-информация-бизнес"

Информационный центр

Заказать услугу

1. Выбрать и подготовить фотографии.

1.1. Скопировать фотографии в одну папку на компьютере, если нужно обработать в графическом редакторе (подтянуть цвета, яркость и прочее).

1.2. Обязательно привести все фотографии к единому размеру, например 800х600 точек. Это можно сделать в графическом редакторе или в специальной программе для обработки файлов (например в этой: http://www.faststonesoft.net/DN/FSResizerSetup41.zip)

1.3. Изменить имена файлов, чтобы они состояли только из английских букв, цифр и тире, не содержали пробелов и желательно были не длиннее 20 символов. Это можно сделать в ресайзере (ссылка выше).

2. Разместить подготовленные фотографии на хостинге

2.1. В папке /images создать папку с именем "папка" (имя задаете свое английскими буквами). Это можно сделать с помощью встроенное медиа-менеджера или фтп-клиентом (например WinSCP)

2.2. Поместить подготовленные файлы фотографий в созданную папку с помощью встроенного медиа-менеджера или фтп-клиента.

3. В материале вставить код фотогаллереи

3.1. Подготовить код в текстовом редакторе:

<div style="height: auto; overflow: hidden;">
<a href="/images/папка/имя1.jpg" data-lightbox="имя_группы"><img class="img-left30" src="/images/папка/имя1.jpg" alt="" /></a>
<a href="/images/папка/имя2.jpg" data-lightbox="имя_группы"><img class="img-left30" src="/images/папка/имя2.jpg" alt="" /></a>
...
<a href="/images/папка/имяN.jpg" data-lightbox="имя_группы"><img class="img-left30" src="/images/папка/имяN.jpg" alt="" /></a>
</div>

Здесь "имя_группы" в пределах кода должно быть одинаковое, но если на одной странице присутствует две и более галереи, то имя группы в каждой должно быть свое.
Количество строк начинающихся "<a href="/images" будет столько, сколько фотографий нужно включить в фотогаллерею.

3.2. В менеджере материалов открыть материал для редактирования и нажать кнопку "Выключить редактор" (находится ниже окна редактирования справа). В этом режиме (без визуального редактора) вставить подготовленный код после имеющегося в окне кода.

4. Сохранить результат работы нажав кнопку "Сохранить" или "Сохранить и закрыть" в верхней части окна.

Замечание. Поддержка Лайтбокс уже должна быть реализована на вашем сайте, а стиль img-left30 - определен и описан.

Добавить комментарий


Защитный код
Обновить

Рейтинг и отзывы

 

Новые комментарии