Hola Chicos,
Muchos me estáis preguntando como añadir la caja de suscripción que tengo en los vídeos que comparto de YouTube.
Aquí tenéis el tutorial en vídeo:
Suscríbete a mi canal:
Me refiero a lo siguiente:

Lo bueno que tiene es que cuando alguien ve un vídeo tuyo tiene la opción de suscribirse a tu canal de forma directa y sencilla.
Aquí puedes ver como se hace:
<div class="contenedor-youtube">
<iframe src="https://www.youtube.com/embed/UcfGYnbdhPk" width="658" height="370" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
</div>
<div class="contenedor-subs">
<div class="titulo-contenedor"> <h4>Suscríbete a mi canal: </h4> </div>
<div class="boton-contenedor">
<script src="https://apis.google.com/js/platform.js"></script>
<div class="g-ytsubscribe" data-channelid="UC67-7lXx3s8iFFC6JdY1-XQ" data-layout="default" data-count="default"></div>
</div>
</div>
Y el css aquí lo tienes:
.contenedor-youtube {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.contenedor-youtube iframe {
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
}
.contenedor-subs .titulo-contenedor{
width: 50%;
display: inline-block;
vertical-align: -webkit-baseline-middle;
}
.contenedor-subs .titulo-contenedor h4 {
margin:0px;
font-weight: bolder;
color: #c4302b;
text-align:right;
font-size:20px;
}
.contenedor-subs .boton-contenedor {
display: inline-block;
}
.contenedor-subs {
padding:5px;
background-color:#f6f0e0;
margin-bottom: 20px;
}
Recordar, añadir el código en html, no en visual ya que el código puede romperse y que la caja se vea descuadrada.
Es una forma muy buena de hacer crecer tus suscriptores de YouTube con poco más esfuerzo.
Espero que os guste ;)
Un saludo
Óscar

Deja una respuesta