Сегодня мне удалось сделать интересное решение для одного из своих сайтов, а именно создать Каталог Youtube-видео с скриншотами, где слева от каждого материала скриншот к видео.
Вот результат:
Идея: В одной из категорий Каталога статей материалы будут иметь чуть другой вид, а именно слева будет картинка с самого видео.
Настройка
В модуле “Каталог статей” создаем новую категорию (название выбирайте какое Вам нравится) и запоминаем ID этой категории.
Редактирование шаблона
ВНИМАНИЕ!!!
Перед любым редактированием шаблона сделайте его резервную копию, для того, чтобы вернуться к исходному шаблону, если что.
Для этого: в правом верхнем углу находите “Backup шаблона” нажимаете и в появившемся окне там же нажимаете “Создать резервную копию”.
Теперь Ваш шаблон сохранен таким, каким он был на момент сохранения.
Если что-то пойдет не так, Вы всегда сможете его восстановить (нажав одноименную кнопку)
Редактировать ЛЮБЫЕ шаблоны нужно очень аккуратно и так, когда Вы точно понимаете ЧТО вы делаете, так как неправильная редакция шаблонов может привести к неисправностям в работе сайта.
Переходим: “Дизайн” – “Управление дизайном” – Каталог статей – Вид материалов
Вставляем следующий код
1 | <?if($CID$='5')?> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="eBlock"> <tr> <td style="padding:3px;" width="20%"> <img src="http://i1.ytimg.com/vi/<?if(strpos($SOURCE$, 'youtu.be')!='-1')?><?if(strpos($SOURCE$, 'www.youtu')='-1')?><?substr($SOURCE$,16,11)?><?else?><?substr($SOURCE$,20,11)?><?endif?><?else?><?if(strpos($SOURCE$, 'www.youtube')='-1')?><?substr($SOURCE$,27,11)?><?else?><?substr($SOURCE$,31,11)?><?endif?><?endif?>/default.jpg" border="0" /> </td> <td style="padding:3px;" width="80%"><?if($MODER_PANEL$)?><div style="float:right">$MODER_PANEL$</div><?endif?> <div class="eTitle" style="text-align:left;"><a href="$ENTRY_URL$">$TITLE$</a></div> <?if($MESSAGE$)?><div class="eMessage" style="text-align:left;clear:both;padding-top:2px;padding-bottom:2px;"> $MESSAGE$</div><?endif?><div class="eDetails" style="clear:both;"> <?if($RATING$)?><div style="float:right"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?> Просмотров: $READS$ | <?if($COMMENTS_URL$)?>| <a href="$COMMENTS_URL$">Комментарии ($COMMENTS_NUM$)</a><?endif?> </div></td> </tr> </table><br /> <?else?> <table border="0" cellpadding="0" cellspacing="0" width="100%" class="eBlock"><tr><td style="padding:3px;"> <?if($MODER_PANEL$)?><div style="float:right">$MODER_PANEL$</div><?endif?> <div class="eTitle" style="text-align:left;"><a href="$ENTRY_URL$">$TITLE$</a></div> <?if($MESSAGE$)?><div class="eMessage" style="text-align:left;clear:both;padding-top:2px;padding-bottom:2px;"> $MESSAGE$</div><?endif?><div class="eDetails" style="clear:both;"> <?if($RATING$)?><div style="float:right"><?$RSTARS$('12','/.s/img/stars/3/12.png','0','float')?></div><?endif?> Просмотров: $READS$ | <?if($COMMENTS_URL$)?>| <a href="$COMMENTS_URL$">Комментарии ($COMMENTS_NUM$)</a><?endif?> </div></td></tr></table><br /> <?endif?> |
Обратите внимание на первую строчку – $CID$=’5′
вместо цифры ‘5’, Вам нужно вставить свою цифру, а именно ID Вашей категории.
Из настроек это все. (Скрипт применяемый в этом коде написан естественно не мной. Источник указан внизу этой статьи.)
Особенности добавления материала для категории Youtube
(Подробное описание принципов добавления и редактирования материалов читайте тут)
Открываете свое видео на сайте Youtube
Ниже любого видео есть кнопка “Поделиться” (1)
При нажатии на нее появится ссылка – эо и есть прямая ссылка на это видео. ее нужно вставить в строку: Ссылка на источник материала (обязательно!!! – иначе картинки-скриншота не будет)
Полный текст материала.
Нужно вставить HTML код самого видео. Для этого нажимаеие кнопку “Сгенирировать HTML код” (2) и вставляете его в любое место.
Как правильно вставить?
Если необходим текст до или после видео – пишите что и сколько хотите.
Но, как только нужно добавить видео с Youtube (или любой другой HTML код) выше на панели нажимаете кнопочку HTML
и в появившемся окне вставляете код для Вашего youtube видео. Применить, ок.
Далее работаете дальше, или/и сохраняете материал.
Если Вы не хотите чтобы на Вашем сайте был только каталог, и не было самих видео предлагаю Вашему вниманию Второй вариант Каталога youtube-видео.