1 1 1 1 1 1 1 1 1 1 Рейтинг: 4.50 - 2 отзывов

Превью-картинка меньше грузит сайт, чем ролик youtube. А если роликов 10 на странице? Итак имеем задачу. Как сделать кликабельную картинку-превью для ролика с Youtube, на Joomla 3.

Картинка превью для ролика с youtube com

Решение.

Кликабельная картинка превью для ролика с Youtube

1. Секрет в том, что на серверах youtube.com, хранятся превью картинки всех роликов. Мы можем использовать их, хотя можно эти картинки скачать и поместить на свой сайт вот так:

http://img.youtube.com/vi/JMJXvsCLu6s/mqdefault.jpg

http://img.youtube.com/vi/JMJXvsCLu6s/0.jpg

Заменяя выделенный код, кодом необходимого для встраивания ролика.

.

2. Оптимальным для данной задачи, будет размещение картинки-превью в вводной части, со ссылкой кликабельной картинки на основную часть. И запрет вывода вводной части при отображении основной.

денежный трактор

 На забываем как сделать правильные настройки канала Youtube, как подтвердить свое авторство на видео, а так же как удалить канал, если он перестанет вас устраивать.

3. Шаблон решения. Достаточно поменять код ролика youtube и написать свой текст статьи (либо просто стереть слова ТЕКСТ СТАТЬИ).


<p>ТЕКСТ ВЫШЕ КАРТИНКИ ПРЕВЬЮ</p>
<p> <a href="/ССЫЛКА НА ОСНОВНУЮ ЧАСТЬ СТАТЬИ"><img style="border-width: 3px;" src="http://i4.ytimg.com/vi/КОДYOUTUBE/hqdefault.jpg" alt="" width="480" height="360" /></a></p>
<p>ТЕКСТ НИЖЕ КАРТИНКИ ПРЕВЬЮ (конец вводной части)</p>
<hr id="system-readmore" />
<p>ТЕКСТ СТАТЬИ (начало основной части)</p>
<p><object width="640" height="360"><param name="movie" value="//www.youtube.com/v/КОДYOUTUBE?version=3&amp;hl=ru_RU&amp;rel=0" /><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><embed src="//www.youtube.com/v/КОДYOUTUBE?version=3&amp;hl=ru_RU&amp;rel=0" type="application/x-shockwave-flash" width="640" height="360" allowscriptaccess="always" allowfullscreen="allowfullscreen" /></object></p>
<p> КОНЕЦ СТАТЬИ</p>

Как найти код youtube? Вот так выглядит ссылка ролика http://www.youtube.com/watch?v=reHaQcms7VY, красным выделен код, который нужно подставить в шаблон решения, приведенный выше.   

 

4. Чтобы узнать ссылку на основную часть, достаточно опубликовать статью прямо как есть с кодом <a href="/ССЫЛКА НА ОСНОВНУЮ ЧАСТЬ СТАТЬИ">. Скопировать на сайте ссылку опубликованной статьи и вставить ее вместо текста ССЫЛКА НА ОСНОВНУЮ ЧАСТЬ СТАТЬИ.

 

Полезная статья "Как раскрутить видео".

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

Защитный код
Обновить