Como colocar o vídeo mais recente do seu canal dentro de um notebook ou televisão - * Blog Elaine Gaspareto *

Como colocar o vídeo mais recente do seu canal dentro de um notebook ou televisão

em 25/01/2017

vídeo mais recente de seu canal dentro de uma imagem de fundo

Você tem canal no Youtube?
Eu tenho, mas não é bem um canal, é mais um instrumento de apoio e suporte aos tutoriais do blog.
Não sabia?
Olha:



Aproveita que estamos falando nisso e se inscreva! Use o método cococu para ajudar essa blogueira que vos fala :)
*Método cococu:
co= comenta
co= compartilha
cu= curte

Jabá feito, vamos ao tutorial?
O resultado vai colocar o seu vídeo mais recente dentro de um background. Pode ser um notebook, um computador, uma televisão...
Veja o exemplo:



Você, com base nesse código, pode usar qualquer imagem que desejar.
Veja as opções que personalizei:


Ver os exemplos e copiar os códigos


Fica bonitinho e charmoso, né?
Pode ser usado na sidebar do blog ou nos posts.
Vamos aprender?

Você pode escolher a imagem de fundo que desejar, mas sugiro que, para começar, use uma das imagens que disponibilizei. Até você pegar as manhas do paranauê, depois pode trocar a imagem que está no código pela imagem que desejar.

Vamos usar essa, de exemplo:



Vá até a página com o código e copie-o.
A seguir vá ao seu blog e clique na aba Layout.
Clique em Adicionar um gadget e dentre as opções que aparecerem escolha HTML/JAVASCRIPT.
Dentro da caixinha que abrir cole o código copiado anteriormente.

Agora preste atenção!
No código você verá essa parte:
https://www.youtube.com/embed/iroiR3tMLY4
O trecho que marquei em vermelho se refere ao ID do meu vídeo.
Todo vídeo do Youtube possui um ID único.
Vá ao seu canal e clique para ver seu vídeo mais recente, ou o vídeo que deseja colocar em seu blog agora.
Observe que na barra de endereço do navegador aparece o endereço do vídeo. Olhe o final dele. É uma sequência alfa-numérica, não é? Copie essa sequência e a coloque no lugar do trecho que marquei em vermelho no código.
Salve.
Está pronto.

Sempre que quiser trocar o vídeo basta trocar o endereço dele, que é essa sequência alfa-numérica única, o ID do vídeo.
Não é legal?

Dica extra:
Caso queira usar uma imagem de sua escolha fique atento aos seguintes comandos:


CÓDIGO ORIGINAL:

<center>
<div style="background: url(https://2.bp.blogspot.com/-h5TKzkJ9UHs/WHp9gsFd_gI/AAAAAAABUAI/1EJhS9GgjpMrF2VUmoNQZL2S54sbUYN5wCLcB/s1600/televis%25C3%25A3o%2Bvintage.png) left no-repeat; height: 325px; width: 300px;">
<div style="float: left; padding-left: 15px; padding-top: 130px;">
<iframe allowfullscreen="" frameborder="0" height="168" src="//www.youtube.com/embed/iroiR3tMLY4" width="212"></iframe></div>
</div>
</center>

PERSONALIZANDO O CÓDIGO ORIGINAL:

Onde marquei em roxo é o endereço da imagem, substitua pelo endereço da que desejar usar.
Onde marquei em azul é a largura da imagem.
Onde marquei em verde é a altura da imagem.
Onde está marcado em pink é a largura do vídeo; ajuste para caber em sua imagem.
Onde marquei em marrom é a altura do vídeo.
Os valores expressos em padding-top se referem à distância do vídeo em relação ao topo da imagem; altere para ajustar.
Os valores expressos em padding-left se referem à posição do vídeo em relação à esquerda da imagem; altere para ajustar.



Não é nada complicado, mas se não quiser ter trabalho nenhum use um dos códigos já personalizados e ajustados que desenvolvi.
E não deixe de ajudar essa humilde blogueira com o método cococu...
co= comenta
co= compartilha
cu= curte

Enjoy!!!



Alguém que escreve. Especialista em si mesma. Leitora que lê muito menos do que gostaria. Blogueira por paixão e profissão. Propriedade da Princesa e da Menininha, e de um cachorrinho muito levado chamado Bloguinho. Tentando viver. Sempre.

7 comentários , comente também!

  1. Queria que você fizesse um post ensinando a fazer esse contador de dias ,´postagens e etc que tem aqui no seu blog .
    www.cacheandocommirellydarlen.com

    ResponderExcluir
  2. Oi Elaine,
    Acabei de fazer, ficou lindoooooo!
    Beijocas!
    Ana
    www.viagensebeleza.com

    ResponderExcluir
  3. Boa tarde Elaine, aproveitei que entrei na tua casinha e dei uma passeada pelos post, lembrei que esqueci de comentar que testei este tutorial em minha casinha azul e amei. Claro fiquei com os cabelos mais branquinho :-) tentando "enfiar o vídeo na telinha azul que arrumei no photoshop :-) deu certo "acho" kkkkkkk... Grande abraço e passando pelo meu Simplesmente Lindalva dê uma olhadinha nos créditos :-)

    ResponderExcluir
  4. minha linda me ajuda o video n ficou certo :(

    ResponderExcluir
    Respostas
    1. Bruna, é preciso ajustar os valores em padding e margin até o vídeo encaixar na imagem que você deseja usar.
      Qual está usando?

      Excluir

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…



Contando...

Dias online
Postagens
comentários

Visualizações