Blogosfera

Widget Youtube com vídeo e botão de se inscrever

Oi pessoal,

Muitos de vocês me perguntam como fiz essa caixinha do Youtube com o vídeo e o botão de se inscrever juntos. Parece algo super complicado, mas na verdade é muito, mas muito simples. Pra quem não sabe do que estou falando, a caixinha é essa:

Widget Youtube com vídeo e botão de se inscrever 1

Esse tutorial serve para Blogger e WordPress

 

PARA BLOGGER: Em LAYOUT crie um novo gadget de HTML/Java Script. Dentro dele, cole o seguinte código:

PARA WORDPRESS: Em Aparência > Widgets, crie um novo widget de TEXTO. Dentro dele, cole o seguinte código:

<center>
<iframe width="300" height="169" src="https://www.youtube.com/embed/Z8lVMbC4SBw" frameborder="0" allowfullscreen></iframe>
<div style="margin-top:15px;">
<script src="https://apis.google.com/js/platform.js"></script>

<div class="g-ytsubscribe" data-channelid="UCZ3pui7Hps1KPor7K4_wnrg" data-layout="full" data-count="default"></div>

</div></center>

 

Substitua o trecho em azul pelo ID do seu vídeo. Você pode encontrá-lo no endereço do vídeo, assim:

Widget Youtube com vídeo e botão de se inscrever 2

 

Substitua o trecho em vermelho pelo ID do seu usuário. Você pode encontrá-lo no endereço do seu canal, assim:

Widget Youtube com vídeo e botão de se inscrever 3

Agora é só salvar.

Eu disse que era fácil! :)
Espero que tenham gostado. Sugestões de novos tutoriais são sempre bem vindas nos comentários.

Um beijo! Coracao

About Author

Designer na Inlove Design e artesã na Contém Fofura. Geek, metida a artista e ama coisas fofas.

33 Comments

  • Gleice Sousa
    11 outubro 2015 at 20:37

    Funcionou perfeitamente aqui, muito obrigada!!! *-*

    Reply
  • Gleice Sousa
    11 outubro 2015 at 20:38

    Funcionou perfeitamente aqui, muito obrigada!!

    Reply
  • Thalia
    11 outubro 2015 at 20:57

    Ka, mandei mensagem no seu insta…. Tu poderia me ajudar com uma coisa no blog? Beijinhos

    Reply
  • Dafhyne
    13 outubro 2015 at 12:57

    Oie Karol Adoro seus posts ajudam Bastante. Sugestão para um novo post seria ensinando a gente a colocar os botões de compartilhamento no final de casa post!

    bjos

    Reply
  • Beatriz Andrade
    14 outubro 2015 at 2:01

    Você arrasa, seus posts são sempre os melhores e mais fáceis de acompanhar, tudo muito bem explicadinho, parabéns! obrigada

    Reply
  • Raquel Nitzke
    14 outubro 2015 at 15:38

    Oi Karol! Pra começar gostaria de te dar super parabéns pelo blog e agradecer! Seus tutoriais são incríveis! Gostaria de dar uma idéia para o próximo: bBlogroll com as fotos dos perfis das blogueiras ao invés apenas do nome dos blogs. Não faço idéia de como se faz essa lista! kk Obrigada!

    Beijos,
    RAQUEL

    Reply
  • Gabrielly
    16 outubro 2015 at 1:29

    Menina, sou louca no teu blog….
    Só consigo entender bem com as suas explicações.. <3

    Reply
  • Jacque
    22 outubro 2015 at 12:31

    Oi Karoline, eu baixei um template e amei de muito amado, mas não aparece os comentários você sabe me dizer porque? Gosto muito de todas as dicas que você nos dá pra personalizar nosso blog, você tem muito talento.
    Obrigadãoo…

    Reply
  • Sarah Martins
    22 outubro 2015 at 13:22

    Oi flor, fiz uma tag lá no meu blog e indiquei seu blog como um dos desafiados, vai lá conferir, só acessar o link: http://trocandobatom.com/tag-o-que-voce-acha-que-sabe-sobre-a um beijo e espero que goste!

    Reply
  • Juliana Barros
    22 outubro 2015 at 17:58

    Meeeeeenina do céu! Fazia um tempão que tava procurando por esse widget – pelo visto não procurei tão bem assim né!? hahahaah
    Muiito obrigada por disponibilizar aqui!
    Beiijos

    Reply
  • Bianca
    27 outubro 2015 at 15:52

    Muuuito obrigada ajudou bastante, perfeito!

    Reply
  • Adriane Quaresma
    5 novembro 2015 at 16:38

    Adorei esse tutorial, é ótimo isso

    Bjss

    http://www.adrianequaresma.com.br

    Reply
  • Elfa
    10 novembro 2015 at 14:13

    O meu ficou com uma parte do vídeo fora da caixinha. O que eu faço? :/ tem como diminuir a largura ou aumentar a largura da lateral? Já fui no configurações avançadas e nada :/

    Reply
    • Louise
      29 dezembro 2016 at 22:32

      O eu tbm tá :( você conseguiu ajustar?

      Reply
  • Joice Monteiro
    16 novembro 2015 at 11:45

    Uhuuuul!
    Deu certo, obrigada pelas dicas.

    Beijo <3

    Reply
  • Deise Lima
    23 dezembro 2015 at 14:46

    Eu tava precisando disso! Muito obrigadaaaaa
    Deu super certo e foi muuito simples! ♥
    Abraço!

    Reply
  • Polyana Sousa
    22 janeiro 2016 at 20:34

    Fazia um tempão que eu estava atrás desse widget, muito obrigada mesmo!!!
    Tenho uma dúvida: sempre que eu postar um vídeo novo eu tenho que atualizá-lo no layout do blog ou ele atualiza no blog automaticamente, logo quando entra vídeo novo no youtube???
    bjoo

    Reply
    • Karoline
      12 fevereiro 2016 at 14:44

      Oi Polyana, isso mesmo, precisa sempre atualizar o código.
      Bjs ♥

      Reply
  • Elayne Oliveira
    4 abril 2016 at 18:29

    Funcionou perfeitamente. Amo suas dicas!
    Beijinhos.

    Reply
  • Beatriz Le Mener
    19 maio 2016 at 23:21

    Ahh também amei essa iseia. Só uma dúvida, toda vez que eu add um vídeo novo eu tenho que ir lá e mudar o cód. do vídeo de novo ?

    Reply
  • Iza
    15 outubro 2016 at 20:06

    Parabéns linda amei! se foi vc a criadora vc merecia ganhar milhões kkkkkk

    Reply
  • Michel
    22 outubro 2016 at 10:25

    Brigado boneca!

    Reply
  • Vivianne
    12 janeiro 2017 at 16:43

    Lindona, sempre que preciso fazer qualquer coisa no meu blog, olho o seu primeiro, porque você arrasa nas suas dicas, parabéns!
    O meu ficou longe do vídeo, será que tem como ajustar? Segue o endereço da minha página, se você puder dar uma olhada para me ajudar. http://www.vamossersinceras.com.br/

    Obrigada. Beijos

    Reply
  • Larissa Zorzenone
    26 janeiro 2017 at 13:28

    Amiga… Salvou minha vida <3

    Vidas em Preto e Branco

    Reply
  • LUCIAN SANTOS SOUSA
    3 fevereiro 2017 at 17:34

    Obrigado! Deu muito certo no meu blog: http://luciansousablog.blogspot.com.br/

    Reply
  • Danilo
    16 julho 2017 at 16:32

    Muito Bom..funcionou Perfeitamente…obrigadíssimo.

    Reply
  • KAMILA SILVA
    22 julho 2017 at 10:42

    Obrigada!

    Reply
  • Pascom Tv
    1 janeiro 2018 at 9:42

    Funcionou perfeitamente, muito obrigado

    Reply
  • Ronaldo de Souza
    5 maio 2018 at 0:28

    Engraçado fiz isso no meu blog nos widgets não deu certo

    Reply
  • Jheniffer
    15 maio 2018 at 18:36

    Oi! Deu mais ou menos certo. O vídeo aparece, porém onde deveria estar o botão “Inscrever-se” aparece “Erro” e uma exclamação vermelha :/

    https://euooutono.blogspot.com.br/

    Reply
  • bea
    24 agosto 2019 at 3:56

    Aqui não funcionou, ficou aparecendo erro no botão de inscrever :(

    Reply
  • Reinaldo Natali
    17 agosto 2020 at 21:14

    Obrigado pela dica, fácil, certinho! Tks

    Reply
  • Simone Benvindo
    11 outubro 2020 at 19:31

    Como eu coloco mais de 1 vídeo?
    http://www.charme-se.com

    Reply

Leave a Reply