Главная > CMS > Обзор SimpleViewer

Обзор SimpleViewer

grab

Предлагаю вашему вниманию бесплатную Flash галерею. Не буду много писать о том что это и зачем, перейду сразу к делу.

Итак, заходим на офф сайт и скачиваем архив с галереей.

Перейти к странице с simpleviewer . Архив весит примерно 400кб, что не так уж и много.

В архиве нас ждем 2 папки: web и examples , а также readme файлик.

Что представляет из себя SimpleViewer галерея?

— 2 папки images( для хранения полноразмерных фото) и thumbs( для хранения привью фото)

— simpleviewer.swf – непосредственно сама Flash элемент галереи.

— gallery.xml ( xml файлик, связывающий изображения и simpleviewer.swf )

— index.html – Html файлик, через который все и выводится.

Зайдя в index.html можем увидеть, что используется swfobject.js ( полезная js библиотека для вывода swf файлов).

Внешний вид. 

15.02

Внешний вид довольно простой, слева блок с привью фото, навигацией и описанием к каждой фотографии. Справа – выбранная фотография. В правом верхнем углу 2 кнопки:

открыть в новом окне и полноэкранный режим просмотра. В правом нижнем углу – ссылка на сайт авторов SimpleViewer .

gallery.xml или работа с фото.

Как писалось выше, gallery.xml – файлик, связывающий изображения и саму галерея. Помимо это в нем можно настроит некотрые элементы. Давайте откроем его любым текстовым редактором, например Notepad++.

<?xml version="1.0" encoding="UTF-8"?> – стандартное обозначение xml документа, информирует браузер о том что используется xml версию 1.0 и кодировка UTF-8.

<simpleviewergallery
    galleryStyle="MODERN"
    title="SimpleViewer Gallery"
    textColor="FFFFFF"
    frameColor="FFFFFF"
    frameWidth="20"
    thumbPosition="LEFT"
    thumbColumns="3"
    thumbRows="4"
    showOpenButton="TRUE"
    showFullscreenButton="TRUE"   
    maxImageWidth="640"
    maxImageHeight="640"
    useFlickr="false"
    flickrUserName=""
    flickrTags=""
    languageCode="AUTO"
    languageList=""       
    imagePath="images/"
    thumbPath="thumbs/"
>

galleryStyle="MODERN" – стиль галереи.

title="SimpleViewer Gallery" – название галереи ( находится над блоком с привью).

textColor="FFFFFF" – цвет текста.

frameColor="FFFFFF" – цвет фрейма( окна с полноразмерным изображением).

frameWidth="20" – ширина границы фрейма .

thumbPosition="LEFT" – позиция блока с привью.

thumbColumns="3" – число колонок.

thumbRows="4" – число строк.

showOpenButton="TRUE" – показывать ли кнопку “Открыть в новом окне”.

showFullscreenButton="TRUE"  – показывать ли кнопку “Полноэкранный режим”.

maxImageWidth="640" – максимальная ширина изображения во фрейме.

maxImageHeight="640" – максимальная высота изображения во фрейме.

useFlickr="false" – использовать ли сервис Flickr.

flickrUserName="" – имя юзера в сервисе Flickr*.

* актуально, если useFlickr="true"

flickrTags="" – метки в сервисе Flickr*.

* актуально, если useFlickr="true"

languageCode="AUTO" – язык ( выбирается автоматически).

imagePath="images/" – путь к папке с изображениями.

thumbPath="thumbs/" – путь к папке с привью.

Подгрузка изображений в gallery.xml

<image imageURL="images/wide.jpg" thumbURL="thumbs/wide.jpg" linkURL="" linkTarget="" >
    <caption><![CDATA[Welcome to <u><a href="http://www.simpleviewer.net" target="_blank">SimpleViewer</a></u>.]]></caption>   
</image>

<caption><![CDATA[**********]]></caption> – описание к изображению содержится между тэгом <caption>

imageURL="images/wide.jpg" – ссылка на полноразмерное фото

thumbURL="thumbs/wide.jpg" – ссылка на привью к фото

linkURL="" – ссылка на сайт по клику на изображение

linkTarget="" – вид открытия ссылки по клику.

Кроме описанных выше настрое у simpleviewer есть дополнительные, о которых можно узнать на офф сайте поддержки — http://www.simpleviewer.net/simpleviewer/support/

Реклама
Рубрики:CMS
  1. Комментариев нет.
  1. No trackbacks yet.

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

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s

%d такие блоггеры, как: