Al fin tengo el nuevo diseño
Hoy os traigo un nuevo tutorial a petición, os explicaré cómo poner gadgets ocultos con imágenes en la cabecera (como mis botoncitos de gatitos de ask y cbox). Es muy sencillo
Antes que nada quiero aclarar que los códigos no los cree yo (abajo están los créditos), lo que yo hice fue ir probando y dar con la solución uniendo códigos y modificándolos a mi gusto.
para el cbox
- Vas a Diseño / Añadir gadget / JavacriptHtml
- Copias el siguiente código
<div style="position: absolute; margin-top: -150px; right: 10px;">150: Si lo aumentas, subirá la imágen del botoncito.
<div class="divspoiler">
<img src="URL DE LA IMAGEN CLICK AQUÍ" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none';}" />
</div><div><div class="spoiler" style="display: none;">
EL CÓDIGO DEL SKIN DE TU CBOX
EL CÓDIGO DE TU CBOX
</div></div></div>
10: Si lo aumentas se irá más a la izquierda y si disminuyes se irá más a la derecha.
right: Puedes cambiarlo por "left", entonces estaría a la izquierda y en ese caso el 10 será lo contrario de lo que dije antes.
- Código del skin de tu cbox:
<div id="shoutmix" style="padding-top: 131px; width: 388px; height: 500px; background: url(URL DEL SKIN) no-repeat scroll left top transparent; position: relative;">Se tiene que poner justo antes del código de tu cbox.
para ponerlo como mi ask
- Vas a Diseño / Añadir gadget / JavacriptHtml
- Copias el siguiente código
<div style="position: absolute; margin-top: -150px; right: 10px;"><div class="separator" style="clear: both; text-align: center;">150: Si lo aumentas, subirá la imágen del botoncito.
<div class="divspoiler">
<img src="URL DE LA IMAGEN CLICK AQUÍ" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none';}" />
</div><div><div class="spoiler" style="display: none;">
<div class="separator" style="clear: both; background: #FFFFFF; border: 2px solid #E3007B; border-radius: 5px; text-align: left;">
LO QUE QUIERAS QUE SALGA EN EL GADGET</div></div>
10: Si lo aumentas se irá más a la izquierda y si disminuyes se irá más a la derecha.
right: Puedes cambiarlo por "left", entonces estaría a la izquierda y en ese caso el 10 será lo contrario de lo que dije antes.
#FFFFFF: Color del fondo del gadget.
#E3007B: Color del borde del gadget.
solid: Lo puedes cambiar por "dashed" o "dotted". Todos los tipos de bordes AQUÍ.
Bueno, eso es todo, espero que me hayan entendido, si tienes alguna duda, coméntala
#FFFFFF: Color del fondo del gadget.
#E3007B: Color del borde del gadget.
solid: Lo puedes cambiar por "dashed" o "dotted". Todos los tipos de bordes AQUÍ.
Bueno, eso es todo, espero que me hayan entendido, si tienes alguna duda, coméntala
Muchas gracias por el tuto! aunque no encuentro el cbox ni nada D: estuve viendo y no lo encuentrooo ayudaa >.<
ResponderEliminarEsta en la cabecera, es el gatito de la derecha, pulsa en él y te saldrá la cbox :3
EliminarRecuerda verlo con Google Chrome, igual si lo ves desde otro no te sale bien ;)
omg gracias desu!!!~~ ♥ es demasiado kawaii el tuto *0* y esta super genial *^*
ResponderEliminarlo usaré en mi próxima edición del blog ♥
saluditos! ^^
Holi te venía a avisar que ya tengo la imagen del premio ;)
ResponderEliminarhttp://otaku-town2.blogspot.com/2014/03/premio.html
buen tutorial, gracias :DDD
ResponderEliminarMe alegro de que os guste ^^
ResponderEliminarGracias por avisar, Monibirit :3
Ahora haré un tutorial que me pidieron, de como puse la "lista de numeros y de puntos" y también publicaré el premio a la noche ^^
Beijinhos❤