Как создать виджет для канала YouTube

Виджет YouTube для сайта. Как это сделать.


28.06.2015 | ПлагиныРубрика: СкриптыРубрика: Создание блога | Теги: , , комментариев 9 | 42116 просмотров | Автор статьи: Александр Рус


Всем привет!

Сегодняшняя статья посвящается тем, кто ищет способ установки виджета канала Youtube  на своем сайте или блоге. Не давно меня тоже интересовал данный вопрос. В интернете я нашел целых 3 способа, как это сделать. Правда два из них некорректно работали, походу вся проблема была в шаблоне моего блоге. Но слава богам, третий способ оказался рабочим. Но если бы и третий способ не заработал, я наверняка придумал бы что-нибудь ещё, ну допустим четвертый способ 🙂

Все варианты описанные в статье — рабочие, проверенно лично мною!

Начну перечислять по порядку.

Способ №1. Как добавить виджет для подписки на канал Youtube при помощи кода.

Примечание. После установки кода, незабудьте сменить ID_канала.

Код виджета выглядит так:

<iframe id="»fr»" hidden="" src="»http://www.youtube.com/subscribe_widget?p=ID_канала″" width="300" height="150" frameborder="»0″" scrolling="»no»"></iframe>

В самом коде, вы можете в ручную отрегулировать высоту виджета (height) и ширину (width). Можно для пущей наглядности, сделать рамку потолще поменяв значение параметра border.

В данном коде, вместо ID_канала, укажите ваше имя канала. Как узнать ID своего канала, я описал чуть ниже -> вот тут.

Скажу честно, не на всех блогах, данный код будет работать корректно. Лично на моем блоге, он непонятно с чем конфликтовал, из-за чего я никак не мог поменять ширину виджета, который вылазил за границы сайдбара. В связи с этим я решил использовать плагин.

Способ №2. Добавляем виджет через плагин.

На плагин я наткнулся на офф. сайте wordpress. Его можете скачать здесь.
Использование плагина чрезвычайно простое. После установки и активации, он полностью рабочий, настраивать ничего не надо.
Для того, что бы появился виджет на Ваш канал Youtube, необходимо зайти в админ панель -> Виджеты. Там перетаскиваем виджет, он так и называется Youtube в ваш сайдбар. Останется его только настроить по ширине вашего сайдбара и все готово.

Youtube виджет для сайта

Youtube виджет для сайта

В строке Имя пользователя обязательно введите ID вашего канала на Ютубе.

ID можно узнать следующим образом. Щелкаете по своему имени, смотрите скриншот ниже:

Как узнать ID канала Youtube?

Как узнать ID канала Youtube?

Далее в открывшимся окне, в ссылке, будет прописан Ваш ID канала:

Как узнать ID канала на Youtube

Как узнать ID канала на Youtube

Так, разбираемся дальше с виджетом. Вторая строчка «Заголовок«. Здесь пишем все что угодно, так будет называться ваш виджет. Хочу заметить, если вы поставите галочку в настройках «Link Title«, то Ваш загаловок, станет кликабельным, т.е. при клике на него, откроется окно в новой вкладке с вашим каналом Youtube. Рекомендую ставить галочку 🙂

Ну а параметры width и height я думаю все знают, они соответственно отвечают за ширину и высоту виджета.

Способ №3. Устанавливаем виджет с официального  сайта Youtube.

На сайте YOUTUBE прокручиваем страницу в самый низ. Там будем ссылка -> Разработчикам, переходите по ней:

Виджет с офф. сайта.

Виджет с офф. сайта.

В новом окне кликаете по вкладке «Документация и материала«, а там нажимаете «Кнопка подписаться«:

Виджет Youtube с оффициального сайта

Виджет Youtube с оффициального сайта

Перед вами откроется окно с настройками виджета. Выбираете настройки под Ваш сайт, в основном все параметры связаны с визуальным оформлением. Когда все будет готово купируем код ниже и вставляем его в нужном месте на своем сайте. Код из себя представляет скрипт. На некоторых блогах скрипты в сайдбарах не работают. Поэтому 3 способ не всем подойдет.

Создаем виджет на офф. сайте Youtube

Создаем кнопку на офф. сайте Youtube

Из всех перечисленных выше способов, рекомендую вариант №2. Лично меня он полностью устроил и заморочек с ним меньше всего 🙂

Материалы по теме:

Хотите создать блог? Но не знаете с чего начать? Я помогу Вам в этом!
Всем привет! Предлагаю свои услуги по созданию блога. А именно, что я буду делать, что бы у Вас появился функциональный блог: Зарегистрирую отдельный email под блог. ...
Как сделать рабочим PHP код в постах и статических страницах на WordPress. Плагин Exec-PHP.
Всем добрый день! Давно я уже не писал про плагины. Поэтому сегодняшнюю статью мы с mr. Кликом посвятим такому незаменимому плагину, как Exec-PHP. Для чего нужен Exec-PHP? С ...
Плагин WP Realtime Sitemap.
Добрый день! Ну и  перерыв чик  я себе устроил, не писал  аж  целых два дня. Отдохнул, набрался сил и готов к работе. Точнее это будет ...
Скрипт для вывода количества просмотров страницы.
Всем привет. Давным давно, когда на этом блоге еще был другой шаблон, у меня в конце каждого поста, отображалось количество просмотров. В результате чего, можно ...
Плагины которые я использую для этого блога
Добрый день! Подумал все таки создать на своем блоге страничку, на которой буду публиковать плагины, которые мною используются. Пример их работы вы как раз и ...

1
Максад Исаев http://www.zarabotokvseti.net/

Этот коммент можно удалить! Дружеский совет: Уменьшите ваши кнопки соцсетей или вставьте их горизонтально после поста, они закрывают часть контента и поэтому очень не удобно читать!

Автор2
Александр Рус http://myworkpro.ru/

А с чего вы читаете? НА мобильном устройстве они не должны отображаться, а с компьютера должно быть нормально. В общем что нибудь с ними сделаю, спасибо за совет.

3
Максад Исаев http://www.zarabotokvseti.net/

Давно хотел что то подобное сделать у себя, да как то руки не доходили. Тоже надо заняться своим каналом, а то уже и забыл когда заходил. Вот и информация дельная, как раз по теме! Вот только самого примера, для наглядности, почему то у вас на блоге не нашел.

Автор4
Александр Рус http://myworkpro.ru/

Канала как такового у меня нет, но есть на форуме БКС)

5
Хребтов Александр http://my-big-family.com/

Канал зарегистрирован, но не ведется. Надо начинать потихоньку заниматься им. Все говорят, что это и трафик дополнительный и благотворно связь блога с Youtube сказывается.

Как дойдут руки, буду знать где искать!

Автор6
Александр Рус (участник БКС) http://myworkpro.ru

Здравствуйте Роман! У меня такая же беда была. Я там повозился, плагины попробовал устанавливал для корректной работы кодов в сайдбаре, потом пробовал другие способы из перечисленных в статье. Так вот не помню точно, что я сделал, но стоило просто немного покопаться, по настраивать, как всё стало работать. А вот на другом сайт зашел, там такая же беда, работал только 1 способ из перечисленных, но там уже возиться не стал.

Автор7
Александр Рус http://myworkpro.ru/

У всех по разному, попробуйте Роман.

8
Роман Рей http://tryomera.ru

Надо кстати будет способ 3 попробовать, ютубовское то родное должно хорошо работать)

9
Роман Рей http://tryomera.ru

У меня шаблон не первый не второй способ не поддерживает. Выводится какая-то абракадабра вместо окна Ютуб

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

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.
Последние комментарии