Mostrando entradas con la etiqueta Efectos. Mostrar todas las entradas
Mostrando entradas con la etiqueta Efectos. Mostrar todas las entradas

domingo, 4 de enero de 2015

[Tuto-Recurso] Blockquote (1) Cinta Rosa

Holiii! Kawaii's el dia de hoy traigo un blockquote que eesta asi ; Rosa Normal xDD Bueno el texto que lo coloques aparece normal
http://animeykawaii.blogspot.mx/2014/09/regreso-dina-tutorial-en-photoshop-como.html#more
ahi pueden ver mejor el efecto xD , a lo ultimo del post la firmita pasan  el cursor van a ver el efecto jajajajajjaja
& Al pasar  el cursor se desliza & se muestra esta imagen ; 

Bueno quedense para ver la colocacion xD
 Se van a plantilla -> Editar HTML ; PRESIONAN CTRL + F & EN la cajita que aparece buscan ;
]]></b:skin>


& Antes de el pegan el siguiente codigo ; 
blockquote{background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjli2-IGfkzXgtr-3pedB687abHVHpFUZsUkMcqhVWqY6_lEBUtQPj2rSDRO9m6_wppQngkNEDDIKfonuKKDQYGdaNHtCdC9-yHs6S-inP-YIWldToUWmqL23Rs9BZPIcQiVCfMBZoOH4Hd/s1600/Sin-t%C3%ADtulo-4.png);padding:10px;color:#000;letter-spacing:1px;border-radius:10px;border:2px solid #ccc;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;text-shadow: -1px 0 fff, 0 1px fff,1px 0 fff, 0 -1px fff;}blockquote:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2xnAmuhzjnGdhYVVMmHqRR8KLeTZD5iEz-b0UT_8zIdiigALlfNRQTKzKbyspwzAsCO8-xjcl4C8FUi0QuTPgBp0yQeKr2DjzkrPkQ-S9yQf9aIEHd3liPXIXvyhnk2w9ZImSsATLcS1K/s1600/blockquote.png);background-position:50% 50%;}
& Listo le dan en guardar plantilla & ** Terminamos ;33



domingo, 28 de diciembre de 2014

[TUTORIAL] Efecto Corazones *Yokn* (2)

Hi! Kawaii's ¿Como estan? Yo preparandome para el 31 * *
Anduve buscando en mi agenda*Que tutos poner* & Entre los ultimos estaban los codigos HTML & Vi Efecto Blog ; Corazon YOKN* ... Mi hermana le encanta hacer esos efectos  jajaja de hecho ¿como se pronuncia? Bloggeras & Bloggeros  , Aqui mi hermana escribiendo como se Pronuncia* 
 *aplausos* 
Hola Soy ana xd ...Aqui como se pronuncia *YOKING* besos 

Jajaja muy Dramatico ;F ... Jajajaj bueno ... Siguiendo con el tuto aqui dejo masomenos como es el efecto xD ... Esque mis capturas de pantalla no son muy Buenas xd .
Bueno no se ve BIEN XD .
Oki Solo lo que tienen que hacer es ;
Ir a Diseño->

Añadir gadget -> HTML Javascript & Copian & pegan el Siguiente  codigo ;)


<script src="http://bpmaker.giffy.me/userdata/user/52/52869/11/parts.js" type="text/javascript"></script><p style="margin: 0px; text-align: center;"><span style="font-family: Georgia, serif; font-size: 100%; font-style: normal; font-variant: normal; line-height: normal;color:#cc33cc;"><b>Creditos a ; *<a href="http://club-kawaii.blogspot.com/">Club Kawaii*</a></b></span></p><br />
 Me encantaria que me dejen los creditos ;3 Pero si se ven muy feo pos dejenlo en algun gadget especial & si no pos ' Lloro xC ... Jajajja No se Preocupen Espero que les sirvan estos efectos en su Blog ;) MAÑANA LOS ESPERO ;) 



[TUTORIAL] Como poner una imagen en el Seguir Leyendo *0*

Holaa Kawaii's ¿Cómo están? Yo Bien Bien *Si preguntan* :P Jajaj el dia de hoy les traigo este hermoso tutorial de poner una imagen en el seguir leyendo . Uff Hoy ya no puedo escribir mucho xc
ya tengo clases ... pueden ver que eh estado trabajando en el blog ; -gadgets -Cabecera etc .
 Pero hoy ya tengo clases xcc Bueno , es Domingo ^^ ;
ver una película tarde (se supone pero en realidad pongo la película & estoy en la compu xD) ver animes etc . Bueno hiendo al tema es to es lo que haremos
Aquí tenemos el Ejemplo ;
ahora ¡EMPEZAMOS!
Nos vamos a Plantilla -> Editar HTML--> Clikeamos CTRL+F damos en expandir artilugios y buscamos ;

<data:post.jumpText/>
 Al encontrarlo lo eliminas & lo Remplazas por este código ;
<p align='right'><a expr:href='data:post.url'><img src='Url de la Imagen de seguir leyendo'/></a></p>
EDITA ;
*Pon la Url de la imagen que desees aquí tengo unas De Anime&Kawaii




















¿Cómo saco la URL?
-Solo das en copiar la imagen & Ya! copias la URL
Listo espero que les haya Gustado Nos vemos en el Proximo Tuto! {[Bay]}♥

sábado, 27 de diciembre de 2014

[Tutorial]Como Poner un gadget de Creditos de Plantilla ;3

Konichiwa Kawaii's jajajaj xDD . Hoy ando de Humor x33 Bueno siempre , anduve viendo  que publicar & vi este gadget de creditos de la Plantilla ;
 -Dije hoy que tengo todo mi dia Libre subiré todos los Tutos que pueda x3
-Entoonces me llego a la mente lo de poner en mi plantilla el gadget de créditos de plantilla
pero no lo pude hacer pos Por que ; El HTML Se travo xD.
Entonces dije ; Mientras se compone hare la entrada xD [Mucho xD]
Aquí empezamos ; el gadget de Creditos de Plantilla es este ;
& Al pasar el Cursor Queda Asi ;
Bueno entonces Empezemos el Tutorial :33
1ºPASO; - Nos vamos a la Sección Plantilla & das clik en editar HTML
Pulsas CTRL + F Te saldrá una cajita donde Buscas el Siguiente Codigo ;  ]]></b:skin>



 Asi nos ira quedando detrás de  ]]></b:skin> Pondremos el Siguiente código ;
/*Credits
----------------------------------------------- */
@font-face{font-family:tinytots;src:url('http://static.tumblr.com/rmj06l2/Usellxb4i/tinytots.ttf')}
.view {
cursor: pointer;
height: 124px; /* Alto de la imagen */
margin: 1px;
overflow: hidden;
position: relative;
text-align: center;
width: 230px; /* Ancho de la imagen */
display: inline-block;
}
.view img {
display: inline-block;
position: relative;
-moz-transition: all 0.6s ease-out;
-webkit-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
transition: all 0.6s ease-out;
opacity: 1;
filter: alpha(opacity=100);
}
.view:hover img {
-moz-transform: rotate(620deg) scale(0);
-webkit-transform: rotate(620deg) scale(0);
-o-transform: rotate(620deg) scale(0);
-ms-transform: rotate(620deg) scale(0);
transform: rotate(620deg) scale(0);
opacity: 0;
filter: alpha(opacity=0);
}
.view .mask {
background-color: #9982ad; /* Color de fondo */
height: 124px;
left: 0;
position: absolute;
overflow: hidden;
top: 0;
width: 200px;
-moz-transform: rotate(0deg) scale(1);
-webkit-transform: rotate(0deg) scale(1);
-o-transform: rotate(0deg) scale(1);
-ms-transform: rotate(0deg) scale(1);
transform: rotate(0deg) scale(1);
-moz-transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
opacity: 0;
filter: alpha(opacity=0);
}
.view:hover .mask {
-moz-transform: translateY(0px) rotate(0deg);
-webkit-transform: translateY(0px) rotate(0deg);
-o-transform: translateY(0px) rotate(0deg);
-ms-transform: translateY(0px) rotate(0deg);
transform: translateY(0px) rotate(0deg);
-moz-transition-delay: 0.4s;
-webkit-transition-delay: 0.4s;
-o-transition-delay: 0.4s;
transition-delay: 0.4s;
opacity: 1;
filter: alpha(opacity=100);}
.view h4 {
background-color: #ffffff; /* Color de fondo del título */
opacity: 0.8;
color: #75648b; /* Color del texto del título */
text-align: center;
position: relative;
font-family: handy;
text-transform: uppercase;
font-size: 8px;
margin: 9px 0 0 0;
padding: 5px 0;
-moz-transform: translateY(-200px);
-webkit-transform: translateY(-200px);
-o-transform: translateY(-200px);
-ms-transform: translateY(-200px);
transform: translateY(-200px);
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.view:hover h4 {
-moz-transform: translateY(0px);
-webkit-transform: translateY(0px);
-o-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
-moz-transition-delay: 0.7s;
-webkit-transition-delay: 0.7s;
-o-transition-delay: 0.7s;
transition-delay: 0.7s;
}
.view p {
color: #fff; /* Color del texto/descripción/etc xD */
font-family: tinytots;
text-transform: uppercase;
font-size: 8px;
margin: 0;
padding: 15px;
position: relative;
text-align: center;
-moz-transform: translateY(-200px);
-webkit-transform: translateY(-200px);
-o-transform: translateY(-200px);
-ms-transform: translateY(-200px);
transform: translateY(-200px);
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.view:hover p {
-moz-transform: translateY(0px);
-webkit-transform: translateY(0px);
-o-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
-moz-transition-delay: 0.6s;
-webkit-transition-delay: 0.6s;
-o-transition-delay: 0.6s;
transition-delay: 0.6s;
}
.view a.info {
background-color: #ffffff; /* Color de fondo del menú */
font-family: tinytots;
border-radius: 5px;
box-shadow: 0 0 2px #e4e2e5, 0 0 5px #e4e2e5 inset;
color: #000; /* Color de texto del menú */
display: inline-block;
padding: 2px 10px;
text-decoration: none;
margin-top: 8px;
font-family: handy;
font-size: 8px;
-moz-transform: translateY(-200px);
-webkit-transform: translateY(-200px);
-o-transform: translateY(-200px);
-ms-transform: translateY(-200px);
transform: translateY(-200px);
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.view a.info:hover {
box-shadow: 0 0 5px #968ca3;
}
.view:hover a.info {
font-family: tinytots;
-moz-transform: translateY(0px);
-webkit-transform: translateY(0px);
-o-transform: translateY(0px);
-ms-transform: translateY(0px);
transform: translateY(0px);
-moz-transition-delay: 0.5s;
-webkit-transition-delay: 0.5s;
-o-transition-delay: 0.5s;
transition-delay: 0.5s;
}
Le damos en Guardar
Nos vamos a Diseño ; --> Añadir gadget --> HTML JAVASCRIPT
& COLOCAS EN LA CAJITA QUE APARECE EL SIGUIENTE CODIGO  
 <div class='view img'><img src='Imagen de los creditos' style='border-top: #69efff solid 0px;border-bottom: #ffb1dc solid 0px;border-right: #ffb1dc solid 0px;border-left: #69efff solid 0px; -Moz-border-radius: 10px; border-radius: 10px;'/>
<div class='mask'>
<h4>CREDITOS</h4>
  <p>Designer: <a class='info' href='url del blog del diseñador'>Nombre del Autor</a><br/>Images: <a class='info' href='url del sitio de las imagenes'>Nombre del sitio</a><br/>Others: <a class='info' href='url del blog'>X</a> <a class='info' href='url del blog'>X</a> <a class='info' href='url del blog'>X</a></p>
</div></div></div>
---------------------------------------------------------------------------------------------------
& Listo ya hemos terminado recuerda colocar la imagen de créditos ; Poner
el url del diseñador etc.
Espero que te haya Gustado este tutorial :333 Nos vemos en el Proximo Chaito♥♥
Credditos ;C&L

jueves, 25 de diciembre de 2014

[TUTORIAL] Desactivar el *CLIK* Derecho (Anti-copiones) XD

Holaa Hoy traigo nuevo Tutorial de Efecto en el Blog : Desactivar el clik derecho especial para copiar xD ... Es anti - copiones ... un muy Buen modo de seguridad jajajja se me olvido desearles una feliz navidad & Prospero año Nuevo! XD
 _-------------------------NOTA ---------------------------------------------
Yo tengo este efecto en el blog asi que si desea copiar códigos Pulsa ;
CTRL + C ; & PARA PEGAR CTRL + V
Ok Empezemos con el Tutorial ;
Nos vamos a plantilla editar HTML --> CTRL + F ; & Nos aparecerá  un cajita donde Buscaremos;
 </body>
& Al encontrarlo después de  </body> Pondremos el siguiente código ;


 <script language="Javascript">
document.oncontextmenu = function(){return false}
</script>
& Listo das en Guardar Plantilla & Listo hemos Terminado ;3 [Imagen de Muestra ^^^]
Espero que haya Gustado & Nos vemos en el Proximo Tutorial!♥
Post By ;Dina Minjy

lunes, 22 de diciembre de 2014

[EFECTOS] Tutorial efecto Flores en tu blog (1)

Holaa !! Soy Dina -Minjy Hoy traigo este tutorial de un Lindo efecto en su Blog ; Es de flores
actualmente 1º Efecto.
Poco a Poco ire subiendo mas tutoriales , Por ahora tenemos este lindo efecto
donde yo lo eh creado xDD , caen florecitas de tu blog .
Es muy fácil colocar ; Nos vamos a diseño --> añadir gadget --> HTML JavaScript
& copias este código & lo pegas en tu cajita le das en Guardar & Listo !!
<script src="http://bpmaker.giffy.me/userdata/user/40/40596/105/parts.js" type="text/javascript"></script><p style="margin: 0px; text-align: center;">Efecto ; Rosas by <span style="color:#cc33cc;">Club-Kawaii ♥</span></p>

Bueno espero que les haya Gustado el efecto , Pruebenlo! Esta bonito!  Adios Besos *3*

viernes, 31 de octubre de 2014

Menu Simples ♥ *CLIK*



Hi! Konichiwa Kawaii's ¿Come están Yo super !
El dia les traigo este Tutorial Padrisimo de SECCION ; *Recursos* para su blog xD
que es un menú sencillo con Imagen estaría bueno para una plantilla jajajajajaj x3
Esta genial Por que es una imagen que esta como base & Luego el Menu con Gifs Minis xd
Okiis Empezemos

Nos vamos a Diseño --> Añadir gadget ---> HTML JavaScript & copias con CTRL C & Pegas con CTRL V ... & Damos e n cuargar el siguiente Codigo ;
<center><div style="background:url(URL DE TU BACKGROUND);width:210px;border:2px solid #ccc;padding:5px;"><a href="URL DE TU BLOG">hOME</a> <img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/> <span id="goog_1755542995"></span><a href="URL DE TU ENTRADA">TUTURIAL</a> <span id="goog_1755542996"></span><img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/> <a href="URL DE TU ENTRADA">CREDITOS</a> <img src="http://www.drikoti.net/Dri/CuteChibbi/bolinha-rosa.gif"/></center>

Rosa: Url o direccion de tu fondo
Azul: Lo grueso del borde, el tipo de borde y el color del borde
Naranja: Direcciones de tus entradas
Lila: El titulo de tu entrada
verde: Direccion de tu gif.
 

& Listo! Jajajajaj Utilizenlo es sin Creditos ... Bueno nos vemos en el Proximo Tutorial

Atte ..

                                  Sr. Diniie-Chan