В этом уроке я вам по подробнее объясню как демонстрировать видео от YOUTUBE на вашем сайте
И так начнем к делу!......
Для начало нам надо думать как мы хотим сделать Видео страничку, и как она отображался на главной странице.!
Главное страницу можно сделать про разному виде.
Пример, с помощью Слайдер, список видео, категории видео , каталог видео,
И важно чтоб подумать какую страницу вы хотите сделать Главной.?
Если останется как и есть Главная страница, тогда будем сделать такую настройку.
Заходим у себя на сайте к админ панелью
Заходим Главная >> Управление дизайном >>Глобальные блоки >> Добавить блок
Называем блок VIDEO сохраняем выходим .
Далее выбираем Главная >> Управление дизайном >> VIDEO.
В дизайне блока VIDEO заливаем вот такой код с плеером
Code
<div id="myplayerBox" style="position: static; ">
<object id="videoplayer1094" type="application/x-shockwave-flash" data="http://studiorr.ucoz.ru/upod/video/uppod.swf" width="645" height="390">
<param name="bgcolor" value="fff" />
<param name="id" value="videoplayer1094">
<param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="always" />
<param name="wmode" value="transparent" />
<param name="movie" value="http://studiorr.ucoz.ru/upod/video/uppod.swf" />
<param name="flashvars" value="comment=<B>StudioRR</B> $ENTRY_TITLE$&uid=videoplayer1094&m=video&st=http://studiorr.ucoz.ru/upod/video/stil/video89-1094.txt&file=http://www.youtube.com/v/$AUTHOR_NAME$?rel=1&color1=0x2b405b&color2=0x6b8ab6&border=1&fs=1&hl=ru_RU&fs=1&debug=1/&poster=http://www.youtube.com/v/$AUTHOR_NAME$" />
</object>
</div>
Далее настраиваемый код плеера
div id="myplayerBox" это ID плеера <<можно настроить под себя >>
object id="videoplayer1094 это основной ID flash плеера <<эту не трогаем>>
http://studiorr.ucoz.ru/upod/video/uppod.swf это ссылка на Flash плеер <<можно скачать у себя на сайт и поменять ссылку >>
width="645" height="390" здесь задаем размер плеера под свой сайт
$ENTRY_TITLE$ это код будет выводить имя ролика в внутри плеера
st=http://studiorr.ucoz.ru/upod/video/stil/video89-1094.txt это стиль плеера <<Можно зайти на сайт www.uppod.ru и сделать стиль плеера под свой вкус >>
file=http://www.youtube.com/v/$AUTHOR_NAME$ это код вызывающе видео от YOUTUBE <<о настройки вызова видео с YOUTUBE мы с вами позже поговорим >>
Остальное нечего не трогаем сохраняем и выходим.
Теперь по подробнее о вызова видео с YOUTUBE
Что значить это строка http://www.youtube.com/v/$AUTHOR_NAME$
Здесь http://www.youtube.com мы указываем в каком видео сайте лежит наше видео
v здесь имя папки в корень сайте YOUTUBE который загружается все видео файлы
А это $AUTHOR_NAME$ наш UCOZ-овскый код который будем выводить туда код видео от YOUTUBE
Это не важно что именно использовать надо это код $AUTHOR_NAME$
Можно использовать примерь $OTHER1...5$
Важно определить что $OTHER1...5$ работает который будет лежать код с плеером!!!
Если все настроили далее идем настроить в главном странице список с видеороликами
2..Настройка главное страницу с видео роликами
Для начало нам надо создать Информер по этому делаем шаг Главная >> Информеры>>Создать информер
Называем Информер ВИДЕО СПИСОК ОТ ГЛАВНЫЙ СТРАНИЦЕ или как вы хотите
сделаем такие настройки ИНФОРМЕРА
Новости сайта · Материалы · В случайном порядке · Материалы: 10 · Колонки: 1 · Определенные категории · Длина заголовка: 25
После создание Информера открываем шаблон оттуда все удаляем и вставляем вот такой код
Code
<li class="feed-item-container">
<div class="feed-item upload">
<div class="feed-item-content">
<h3 class="feed-item-title">
<span class="feed-item-author">
<a href="$CAT_URL$" class="yt-user-photo ">
<span class="video-thumb ux-thumb ux-thumb-profile-24">
<span class="clip"><span class="profile-centering-wrap">
<img src="http://i3.ytimg.com/i/$OTHER1$/1.jpg?v=4ee185c5" alt="$CAT_NAME$" data-thumb="http://i1.ytimg.com/vi/$USER_AVATAR_URL$/1.jpg?v=4ee185c5" data-group-key="thumb-group-0"></span></span></span>
</a>
</span>
<?if($USERNAME$)?>
Пользователь <span class="feed-item-owner"> <a href="$PERSONAL_PAGE_LINK$" class="yt-user-name " dir="ltr">
$USERNAME$
</a><?endif?>
</span>
добавил это видео в
<span class="time-created">$DATE$ </span>
<?if($RATING$)?>| <!--<s3119>-->Рейтинг<!--</s>-->: <span id="entRating$ID$">$RATING$</span>/<span id="entRated$ID$">$RATED$</span><?endif?>
</h3>
<div class="feed-item-visual">
<div class="feed-item-visual-thumb">
<a class="ux-thumb-wrap contains-addto" href="$ENTRY_URL$">
<span class="video-thumb ux-thumb ux-thumb-288 "><span class="clip">
<img src="http://i1.ytimg.com/vi/$OTHER1$/default.jpg" alt="Значок видео
" data-thumb="http://i1.ytimg.com/vi/$OTHER1$/default.jpg" data-group-key="thumb-group-0"></span></span>
<span class="video-time">$TIME$</span>
<button type="button" class="addto-button short video-actions yt-uix-button yt-uix-button-short" onclick=";return false;" data-button-menu-action="yt.www.lists.addto.toggleMenu" data-button-menu-id="shared-addto-menu" data-video-ids="$OTHER1$" data-feature="thumbnail" role="button"><img class="yt-uix-button-icon yt-uix-button-icon-addto" src="http://studiorr.ucoz.ru/images/yt/body/pixel-vfl3z5WfW.gif" alt=""><span class="yt-uix-button-content"><span class="addto-label">Добавить в</span> </span><img class="yt-uix-button-arrow" src="http://studiorr.ucoz.ru/images/yt/body/pixel-vfl3z5WfW.gif" alt=""></button>
</a>
</div>
<div class="feed-item-visual-content">
<div class="feed-item-visual-description">
<h4><a class="title" href="$ENTRY_URL$" dir="ltr">$TITLE$</a></h4>
<div class="description" dir="ltr">
<p>$MESSAGE$</p>
</div>
</div>
<p class="metadata">
<a href="$PERSONAL_PAGE_LINK$" class="yt-user-name " dir="ltr">
$USERNAME$
</a>|
<span class="view-count">
Просмотров: $READS$
</span><?if($COMMENTS_URL$)?>| <a href="$COMMENTS_URL$">Комментарии ($COMMENTS_NUM$)</a><?endif?>
</p>
</div>
</div>
</div>
</div>
</li>
Как мы говорили у нас а Главной странице не работает код $AUTHOR_NAME$ по этому нам будет служить это код $OTHER1$
Стиль к этой информера в общий странице моего сайте , я не буду по отдельности рассказать о стиле по этому со стилем сами разберетесь
или поменяйте на свой. вот ссылка на стиле
Code
<link type="text/css" rel="StyleSheet" href="http://studiorr.ucoz.ru/css/YT/www-refresh-datauri-vflJkAFPr.css" />
Если всю настройки сделали со стилем сохраняем и выходим .
3.. Далее идем Главная>> Управление дизайном >> Главная страница сайта .
Для вас в удобным месте шаблоне Главная страница сайта в визуальным редакторе
Вставляем вот такой код
Code
<div class="feed-container" data-paging="30" data-filter-type="">
<div class="feed-page">
<ul>
<!-- Начало тела информера в случайном порядке от studiorr -->
$MYINF_31$
<!-- Конец тела информера в случайном порядке от studiorr -->
</ul>
</div>
Тоже меняем стиль кода (Если меняли в шаблоне стил информера ) с одни словом настраиваем под себя как вам угодно
и меняем $MYINF_31$ на свой .
Далее идем Главная » Замена стандартных надписей »ФОРМА ДОБАВЛЕНИЯ МОДУЛЯ "НОВОСТИ САЙТА
тут в строке $OTHER1$ нажимаем изменить места $OTHER1$ пишем вот такую строку
Code
<b>Видео код от Youtube</b>
Сохраняем выходим .
Почти все готово только у нас остался демонстрация нашего добавленного видео ролика
Далее идем Главная>> Управление дизайном >> Новости сайта >> страница материалов и комментариев к нему
В этом блоке где хотим видеть видео плеер , туда вставляем эту код
Code
<div id="watch-video-container" class="eMessage eText eTitle">
$GLOBAL_VIDEO$
</div>
У нас настройки плеера и список видео готов , только остался добавить материал с видео
При добавление что делаем в главной странице сайта нажимаем добавить новости
В открывшем окне увидим который переименовали в Замена стандартных надписей $OTHER1$ на ВИДЕО КОД ОТ YOURTUBE
В эту строку вставляем в КОД от Youtube понабравшей нам видео или видео залитой завами
Код можно забирать вот таким способам
заходим сайт www.youtube.com находим видео который вам надо чтоб это видео отображался на вашем сайте
если видео понравился вам то выбираем сразу внизу видео плеера функцию ПОДЕЛИТСЯ
после нажатие ПОДЕЛИТСЯ откроется вот такая строкаhttp://youtu.be/STnaZr0SXek
с этого строке мы копируем примерно вот такой код STnaZr0SXek и вставляем в вашем строке ВИДЕО КОД ОТ YOURTUBE
и далее пишем описание или короткое описание видео
сохраняем проверяем .
ЕСЛИ ЧТО ТО НЕ ПОНЯТНО НАПИШИТЕ МЫ ОТВЕТИМ
Не забываем сказать СПАСИБО