1. Для начала качаем архив и заливаем в корень сайта.
2. CSS
Между head и /head вставляем:
<link rel="stylesheet" href="/mmb/style.css" type="text/css">
3. JS
Подключаем скрипты. Библиотеку fancybox, cycle и superfish. Для этого в самом конце страницы, перед /body вставляем:
<link media="screen" type="text/css" href="/mmb/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" />
<script type='text/javascript' src='/mmb/js/jquery.cycle.all.min.js?ver=1.0'></script>
<script src="/mmb/js/superfish.js" type="text/javascript"></script>
<script src="/mmb/js/custom.js" type="text/javascript"></script>
<script type='text/javascript' src='/mmb/fancybox/jquery.easing-1.3.pack.js?ver=1.3.4'></script>
<script type='text/javascript' src='/mmb/fancybox/jquery.fancybox-1.3.4.pack.js?ver=1.3.4'></script>
<script type='text/javascript' src='/mmb/js/et-ptemplates-frontend.js?ver=1.1'></script>
Внимание! В uCoz теперь стандартно подключается jQuery (чем лично я сильно недоволен, т.к. версий библиотек предусмотрено всего две 1.3.2 и 1.6.1). Нам же нужна версия выше 1.4.4. Можете, конечно поставить в настройках подключение версии 1.6.1, но с некоторыми моими скриптами на этом сайте она конфликтует. Так что попробуйте, если конфликтов не будет, изменяйте в настройках библиотеку на 1.6.1.
4. HTML
Код оболочки:
<div id="multi-media-bar">
<h3 class="title">Multi Media Bar</h3>
<div id="et-multi-media" class="clearfix">
<a id="left-multi-media" href="#">Previous</a>
<a id="right-multi-media" href="#">Next</a>
<div id="media-slides">
<div class="media-slide">
<div class="thumb">
СУДА КОДЫ ЯЧЕЕК, те что ниже
</div> <!-- end .media-slide -->
</div> <!-- end #media-slides -->
</div> <!-- end #et-multi-media -->
</div> <!-- end #multi-media-bar -->
Код 1 ячейки. Создавать Вы их можете сколько угодно. И так это для ичейки с изображением:
<a href="ссылка на полноразмерное изображение" rel="media" class="fancybox" title="ПОДПИСЬ">
<img src="ссылка на изображение" class='multi-media-image' alt=Название' width='48' height='48' /> <span class="more"></span>
</a>
<div class="media-description">
<p>Текст к изображению</p>
<span class="media-arrow"></span>
</div>
</div> <!-- end .thumb -->
А это для ячейки с видео:
<div class="thumb">
<a href="ссылка на видео" class="et-video et_video_lightbox" title="Название">
<img src="ссылка на изображение" class='multi-media-image' alt='Название' width='48' height='48' /> <span class="more"></span>
</a>
<div class="media-description">
<p>Текст к изображению</p>
<span class="media-arrow"></span>
</div>
</div> <!-- end .thumb -->
по материалам http://udf.su/forum
