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