Иногда возникает необходимость показать в блоге фотографии так, чтобы можно было просмотреть сразу их большое количество. Я как-то уже показывала, как можно разместить в блоге галерею, составленную из набора фотографий (здесь — в виде таблицы, а здесь — с помощьювнешней программы InLinkz). А сегодня я расскажу, как можно организовать просмотр нескольких фотографий в виде слайдшоу: так, чтобы одна картинка автоматически сменялась другой.
Делается это очень просто, особенно если использовать готовые сервисы от «столпов» современных фотохостингов: Пикасы и/или Яндекса. Но можно пойти более сложным путем и поставить в блог свой скрипт. Как лучше, зависит от конкретной задачи. Я просто расскажу о каждом из этих трех способов подробнее.
1. Итак, самый простой способ вставить в блог слайдшоу — это воспользоваться встроенной функцией Пикасса.
Почему этот способ самый простой? Потому что для блогов на платформе Блоггер редактор Пикасса является «родным». Вставляя фотографии в блог, мы по умолчанию используем его. У каждого из пользователей Блоггер есть в Пикасса бесплатный аккунт, 15360 МБ для хранения фотографий и возможность пользоваться всеми услугами этого сервиса, включая и создание слайдшоу.
Допустим, вы хотите показать в блоге все фото ваших с детьми новогодних поделок (как это понадобилось мне для поста в моем основном блоге «Это интересно!«). Для этого вам необходимо создать новый вебальбом Пикаса и за грузить в него все нужные фотографии. Не забудьте поставить опцию доступа «Видимый для всех в интернете», чтобы изображения были доступны для просмотра. А после останется всего лишь в правом сайдбаре (колонке) нажать «Ссылка на этот альбом».
Под ней появится строчка «Встроить слайд-шоу».
После того, как на нее нажмешь, откроется окошко, в котором можно настроить параметры слайд-шоу — время задержки кадра, его размер и т.д. А внизу будет код для вставки в блог, который надо будет просто скопировать, а потом в ставить в свой блог. Если вы хотите, чтобы слайдшоу отображалось в сообщении, то вставьте код в режиме HTML в окошке редактора. Если же вы хотите, чтобы слайдшоу показывалось у вас на боковой панельке блога, то полученный код надо вставить в гаджет «HTML/Java script».
Все, слайдшоу сразу же появится в вашем блоге.
P.S. В режиме редактирования сообщения у меня вместо экрана появляется надпись от Оперы (моего браузера) «Нет плагина. Ознакомиться». Но это ничего страшного — после публикации сообщения все появится в нужном месте.
2. Встраивание слайдшоу от Яндекса.
Если у вы храните свои фото не в Пикасса, а во втором по распространенности бесплатном фотохостинге — Яндекс. Фотки, то вам будет удобнее воспользоваться его сервисом. Процедура практически такая же. Вы создаете новый альбом и добавляете в него нужные фото.
После этого заходите в альбом, нажимаете «Слайд-шоу».
И под окошком с примером слайд-шоу выбираете «Код для вставки на сайт или в блог».
Копируете предложенный код так же как и в предыдущем способе: если надо вставить в сообщение, то в режиме HTML, если надо на сайдбар, то с помощью гаджета «HTML/Java script».
Все параметры можно будет настроить уже в самом слайд-шоу. Вот как это будет выглядеть:
3. Встраивание слайдшоу с помощью скрипта.
Этот способ пригодится вам, если вы не только хотите показать фотографии, но и сделать так, чтобы каждое фото было ссылкой на соответствующее сообщение в блоге. В этом случае вам придется вставлять адреса изображений и связанные с ними ссылки вручную. Но, зато, так гораздо удобнее вашим читателям: кого-то заинтересовала фотография, он щелкнет по ней — и окажется в нужной статье.
Минус этого способа: когда у вас фотографий под сотню (как у нас в случае с поделками), то вручную их вставлять не очень-то интересно.
Самих скриптов можно найти по поиску множество. Например, такой (взято отсюда). Он очень простенький, но те, кто понимают HTML, могут без труда модифцировать его. А для каких-то простых целей и этого будет достаточно.
Его HTML-код выглядит так:
где
border — толщина рамки
solid silver – цвет рамки silver
padding – расстояние между объеками внутри рамки и рамкой по вертикали
background:white – цвет фона white
width – ширина окошка, высота выравнится автоматически благодаря padding
text-align: center – выравнивание объекта внутри рамки
scrollamount – скорость движения картинок
width height – размер картинок
onmouseover=this.stop() onmouseout=this.start() – останавливает картинку при наведении на нее курсора мыши
Кроме того, существует множество профессиональных программ, в которых можно создать слайд-шоу. Вы их без труда найдете через поисковик. Минус в том, что большинство из них сильно увеличивает время загрузки блога. Да и разобраться с их настройкой и установкой за 5 минут не получится ((( А мне бы хотелось найти что-нибудь простое, но функциональное… Может, кто-нибудь из читателей подскажет, чем пользуется он? Буду рада обсудить эти вопросы в комментариях.
Автор: Guest Rooms «Varnaflats.eu»