Bienvenido a mi blog. Aquí encontrarás todas las cosas que he creado e ido aprendiendo con el tiempo, útiles para ti y tu sitio web.

¿Qué día es hoy? (Widget Kawaii)

26.10.12

Hoy no traigo tutorial, ya que no quiero estresarles con tanta info (*≧▽≦)ノシ)) pero mañana prometo que si publico un tutorial. Mientras dejo estos lindos calendarios / agenda(?).

Pues ahí muestran la fecha actual y si pones el mouse sobre cada día aparecerá un mini-mensaje, mensaje que podrás modificar con tan sólo cambiar TEXTO 1 ó TEXTO 2 ó TEXTO 3 (hasta el 7), estos están dentro del código ubicado abajo de su respectivo widget.





Regreso a publicar otra entrada aquí más tarde (^v^), hasta luego

Menu kawaii "Kuma Menu"

23.10.12

Hace poco aprendí la combinación de varios códigos, así que me puse a jugar y como resultado... UN MENU SUPER KAWAII AL ESTILO KUMA CON EFECTOS ZOOM!!!

ESTA ES UNA CAPTURA, A QUE ESTÁ MONÍSIMO!!
En la captura se ve las opciones que yo personalizé para mi blog. El código que les dejo contiene las opciones de "BLOG PERSONAL, AFILIAME, AFILIADOS Y MIS PREMIOS". Bueno iniciemos con el paso a paso para su instalación. GOOOOOO!

 PARA EL EFECTO 
(SI YA TIENES INSTALADO ESTE EFECTO OMITE ESTE PASO)

PASO 1: Lo de siempre clic a 'Diseño → Edición de HTML → Continuar'

PASO 2: Usa Control + F (para una búsqueda más rápida) y busca  ]]></b:skin> 

PASO 3: Pega el sgte. código arriba de  ]]></b:skin> 

/*Efecto Zoom
----------------------------------------------- */
.hovergallery img{
-webkit-transform:scale(1);
-moz-transform:scale(1);
-o-transform:scale(1);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 1;
margin: 0 0 0 0;
}
.hovergallery img:hover{
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
box-shadow:0px 0px 35px white;
-webkit-box-shadow:0px 0px 35px white;
-moz-box-shadow:0px 0px 35px white;
opacity: 1;
}
PASO 4: Clic en 'Vista previa', si todo sigue normal clic en 'Guardar plantilla'


 PARA EL MENU 

PASO 1: Igual clic a 'Diseño → Diseño → Añadir un gadget → HTML/Javascript'

PASO 2: Pegamos el sgte. código...

<!--KUMA MENU-->
<img src="http://img204.imageshack.us/img204/4458/menutitler.png" style="border: #e55252 1pt dashed; -moz-border-radius: 24px 24px 0 0; border-radius: 24px 24px 0 0;"/><table background="http://img825.imageshack.us/img825/1373/other1j.png" border="0" style="background-color: none; border: #e55252 1pt dashed; width: 210px; -moz-border-radius: 0 0 24px 24px;border-radius: 0 0 24px 24px;">
<tbody><tr><td>
<center><div class="hovergallery">
<a href="URL DE BLOG"><img src="http://img405.imageshack.us/img405/3756/blogpersonal.png" /></a>
<a href="URL DE AFILIAME"><img src="http://img443.imageshack.us/img443/9304/afiliame.png" /></a>
<a href="URL DE AFILIADOS"><img src="http://img577.imageshack.us/img577/5249/afiliadosv.png" /></a>
<a href="URL DE PREMIOS"><img src="http://img525.imageshack.us/img525/1908/mispremios.png" /></a>
</div></center>
<div style="text-align:right;"><span style="color:#e55252; font-size: 100%; "><b>Consigue este widget en:</b></span><a href="http://nemuri-kuma.blogspot.com/2012/10/menu-kawaii-kuma-menu.html"><img src="http://img339.imageshack.us/img339/2318/75047749.png" /></a></div>
</td></tr></tbody></table>
<!--END KUMA MENU-->
PASO 3: Clic en 'Guardar'


*NOTA: Sólo debes cambiar lo que está resaltado de anaranjado por el URL que indica. Pasa el mouse sobre el menú al lado derecho de mi blog para ver el efecto (*-*)

YEY!! otro recurso más hecho por mi (✪㉨✪) -se vuelve loca de felicidad- Si gustas ver el otro recurso que creé para Blogger pasa por nemuri-kuma.blogspot.com/recursos. Bien es todo me hasta más tarde.

Pon Comentarios Recientes

21.10.12

Código HTML de los Colores

Bien esta entrada es para hablar y recomendar una página. Ya que siempre me la paso hablando en los tutoriales de CÓDIGOS DE COLORES, bueno aquí dejaré una buena página en donde encontrarás una variedad de colores 😍

La página es html-color-codes.info


Es muy buena y fácil de usar, podrás buscar colores y seleccionar sus respectivos códigos o también averiguar que color pertenece a un determinado código. Esto último sirve en el caso que quieras saber que color pertenece a ese código que tienes por ahí guardado o que acabas de pegar.

HTML Color Chart o Carta de Colores HTML. Con esta carta de colores HTML dinámico, podrás obtener los códigos HTML para los colores básicos. Sólo debes hacer clic en cualquier cuadro de color y abajo de la paleta de colores aparecerá un/os recuadro/s con el color y bajo el/ellos su código de color HTML.


HTML Color Picker. Esta opción permite que colocar tu código de color en el campo de entrada superior y abajo de él te mostrará el color que le pertenece. También puedes mover el control deslizante vertical para elegir el color y podrás obtener el código de color HTML en el recuadro inferior.

Diccionario B ¿Qué es Header?


Concurso de nita60

20.10.12

Antes que nada decir, si quieres participar en el concurso visita el blog de nita60 (AQUÍ).

Ahora mis respuestas!

Preguntas/Respuestas
  1. ¿Cuál es tu anime y/o manga favorito? Mi anime favorito es GRAVITATION (*///*) marco mi vida!!! y también todos sus mangas y OVAs OMG!
  2. ¿Cuál es tu estilo de música preferido? Muchas en realidad pero el que más sobre sale es el j-Rock (*O*)
  3. ¿Tienes mascota? ¿Cómo se llama? Si! 2 perros, Balín y Duke. Y un caracol, Jerry jajajaja (*≧▽≦)ノシ))
  4. ¿Cómo se llama el juego que más te gusta? Juego? de consola? o cualquiera? En fin como sea de consola me gusta Donkey Kong, en cuanto a juegos de mesa me gusta monopolio (*0*) y jugar al poker y mano nerviosa (*≧▽≦)ノシ)) wuuuuuuuuuu!
Bueno es todo (*^3^)/~☆


Entradas Recientes con imágenes y efecto deslizante

19.10.12

Este tutorial me lo pidió Candela de clasicylove.blogspot.com. Primero que nada aclaro que este tutorial no es mio sólo modifiqué un par de códigos jejeje y les enseñaré como hacerlo (OwO). Al final dejaré los créditos correspondientes. Let's GOOOOOO!!

PASO 1: Click en 'Diseño → Diseño → Añadir un gadget → HTML/JavaScript'

PASO 2: Pega el sgte. código...

PASO 3: Guardar y te quedará igual a esto (↓↓↓)
ES ASÍ COMO SE VE EN MI BLOG (*-*)
AHORA A MODIFICAR!!! (esta parte es opcional ^^)

Iniciemos por lo esencial y más fácil. Ves los códigos resaltado de  ROSADO  ok ahí comenzaremos. Todos esos códigos son para cambiar la forma de los recuadros, tanto interno (el que muestra las imágenes) como externo (el de color negro jeje ^^). Aquí abajo dejo los códigos de cada forma (OwO).






Ahora la parte algo "complicadita", modificar color, tamaño de letras, forma, fondos, bordes, etc. MUCHA ATENCIÓN!! Aquí van los códigos...

width:220px;/** ANCHO DE WIDGET **/ Este es el ancho de todo (TODO) es decir que si el ancho de este es menor que el de abajo(↓↓↓) se verá cortado de un lado (no se verá completo). Por ejemplo: si quieres que el recuadro exterior tenga un ancho de 280 pues, el ancho de widget deberá ser de 300.

width:180px;/** ANCHO DEL RECUADRO EXTERIOR **/ Modifica el 180 por el ancho que desees darle a este widget de tal forma que no se vea muy grande o muy pequeño para la columna donde lo pondrás.

 background: #000 repeat;/** COLOR DE FONDO DEL RECUADRO EXTERIOR **/ Aquí puedes cambiar el color o también puedes colocar una imagen como fondo. Para color cambia #000 por otro código de color. Para imagen sólo reemplaza #000 por url(URL DEL FONDO O IMAGEN) y coloca el url de tu imagen.

color:#FA5882;/** COLOR DEL TITULO **/ Coloca otro código de color para definir el color que gustes, cambia el #FA5882 (^^)

font-size:11px;/** TAMAÑO DE LETRA DEL TITULO **/ Sólo cambia el 11 por otro número para aumentar o disminuir el tamaño de la letra.

background:#fff;/** COLOR DE FONDO DEL RECUADRO INTERIOR **/ Es lo mismo que los anteriores, sólo cambia el #fff por otro código de color.

border:2px solid;/** FORMA DEL RECUADRO Y BORDE 
INTERIOR **/ Este es para el grosor y tipo de borde que se mostrará. Si cambias el 2 por otro número aumentará o disminuirá el grosor de los bordes. Y si cambias solid por dotted se verá un borde de puntitos o por dashed se verá un borde de rayitas.

home_page = "http://nemuri-kuma.blogspot.com/";/** URL DE TU BLOG **/ Por último y el más fácil. Sólo cambia http://nemuri-kuma.blogspot.com/ por el url de tu blog.

BUENOOOOOOOOOOOOOOO!!! ESTO FUE TODO. Algo largo y tedioso pero comprensible (eso espero ° - °). Cualquier duda con respecto a este tutorial déjenla en comentarios. Muchas gracias por pasar por aquí m(_ _)m

Creditos de tutorial a Annyz de annyz-kawaii.blogspot.com

Este tutorial fue modificado por mi, por favor respeta mi trabajo porque me tomó su debido tiempo crearlo y dar la explicación paso a paso (^w^). Gracias!

Cómo personalizar las viñetas de Blogger

16.10.12

¿Que son las viñetas? Son esas cosas circulares que están al lado izquierdo de las listas que creamos en el blog. Estas curiosas y nada atractivas viñetitas están por defecto en las platillas de Blogger, y es muy fácil personalizarlas.

Ejemplo de Lista con viñetas personalizadas:
  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Aptent placerat laoreet orci, cubilia proin pellentesque cursus, nisl at.
  • Vitae risus euismod nostra ullamcorper id, nec volutpat natoque.
  • Neque mauris taciti auctor dignissim montes, pellentesque porta aliquet.
  • Augue himenaeos dui consequat imperdiet natoque, class bibendum neque.

Pues bien comencemos con el PASO a PASO

Viñetas sin imagen (cambiar una viñeta por otra)

  1. Desde la opción Tema de Blogger, clic en el botón  Personalizar 
  2. Clic en Opciones avanzadas y buscamos Agregar CSS.
  3. Copia y pega el siguiente código. Clic en  Aplicar al blog 

Código: Circle


Código: Square


Viñetas con imagen

  1. Desde la opción Tema de Blogger, clic en el botón  Personalizar 
  2. Clic en Opciones avanzadas y buscamos Agregar CSS.
  3. Copia y pega el siguiente código. Clic en  Aplicar al blog 


Nota:

  • También se puede cambiar las viñetas la columna latera,  sólo cambia  .post ul {   .post ul li {  por .sidebar ul {.sidebar ul li {
  • Si vez que la viñeta no está bien ubicada (muy lejos o muy cerca al texto) es porque cada plantilla es diferente, así que sólo debes modificar los valores de padding y margin.

Concurso: Yo Diseño (Finalizado)

15.10.12

Hola! Esta es una entrada programada, estoy haciéndola así porque hoy será lunes y me dará flojera publicar por la mañana, eso o sino estaré en el hospital (para más info sobre eso click AQUÍ).

Bueno ¿DE QUE VA ESTO? A la vista que ya pude crear la plantilla que tanto deseaba (* - *), me decidí por hacer mi primer concurso el cual nombré "Yo Diseño".

¿EN QUE CONSISTE EL CONCURSO?
Pues en reconocer con un premio especial a las/los blogger@s con mucha creatividad en diseño gráfico o diseño web, dicho en otras palabras; a los que aman crear sus propias plantillas o crear sus gifs, banners (ect *o*) serán premiados!!!!!!!!! WUUUUUUUUW!!

BASES DEL CONCURSO
Para ser parte del concurso llena los sgtes. datos y publicarlos en comentarios (abajo ↓↓↓)
  • Nombre de usuario o seudónimo:  ___________
  • URL de tu blog: _________________________
  • URL de tu entrada con el banner: (*leer reglas y puntos del concurso)
  • ¿Quién te invitó a participar en el concurso?
  • ¿Qué tema te gustaría para una Plantilla? Ej. candy, neko, panda, primavera, ángel, etc.
REGLAS Y PUNTOS DEL CONCURSO
  1. Seguir este blog. (50 ptos.)
  2. Tener un mínimo de 10 comentarios en otra/s entrada/s (publicación/es). (15 ptos.)
  3. Publicar el banner del concurso en una entrada y en un sidebar (columna lateral). (35 ptos.)
Puntos específicamente del concurso: Diseñar un banner (gif animado) para este blog, 50 y 40 ptos. para el 1er y 2do lugar respectivamente. Deberás publicar el banner que diseñaste en la misma entrada del banner del concurso. 
Puntos extra:
  • Si yo te invité a participar en el concurso tendrás 5 ptos. a favor.
  • Seguir mi otro blog + 1 comentario en cualquiera de las entradas te da 5 ptos. extras.
  • Invitar a más blogger@s a participar.
  • Números de comentarios hechos en el blog equivalen a ptos. extras, es decir, mientras más hayas comentado en este blog más puntos a favor tienes. 
PREMIOS
  • 1er Lugar: Plantilla Original y Personalizada + Pack de renders + Banner del Premio + Bloc de Notas + Publicidad en mi blog
  • 2do Lugar: Plantilla Original y Personalizada + Banner del Premio + Publicidad en mi blog 
Nota:
  • Por cierto no olvides pasarme el URL de la entrada (publicación) que escribiste.
  • No elimines el link de enlace de los banners.
  • Los puntos extras son los que harán la diferencia entre el 1er y 2do lugar ya que, básicamente quienes hayan cumplido con tas las reglas del concurso tendrán un acumulado de 100 ptos. Cada comentario se multiplicará por 10 puntos (comment x 10 ptos). Y por cada participante que se inscriba al concurso gracias a ti se multiplicará por 5 puntos (nuevo participante x 5 ptos.)
  • Los banners diseñados por l@s participantes serán sometidos a votación, así se decidirán el 1er y 2do lugar. Pero esto no decide el 1er y 2do lugar para el CONCURSO EN GENERAL, sólo es para decidir a quienes se les dará los 50 y 40 ptos. Al final se sumará los puntos acumulados para decidir a los GANADORES. 
  • Cada Plantilla (template) estará basa en la template que diseñé, pero será modificada al gusto del ganador. Para una vista de la Plantilla visita mi otro blog (http://labyrinthinmyheart.blogspot.com/)
  • El blog de notas incluye consejos míos para modificar la nueva plantilla.
  • La publicidad será por dos meses.
  • El concurso finaliza a fines de noviembre. Y se publicará el nombre de usuario (o seudónimo) y blog de los ganadores una semana después de cerrado el concurso (aprox. el 07/12/2012). 
Bueno es todo por hoy, a partir de la fecha estaré publicando con entradas programadas (SIEMPRE A LAS 10 AM) una entrada por día. Bien aquí abajo (↓↓↓) dejaré el banner del concurso con su respectivo código.

ELIGE EL TAMAÑO QUE GUSTES.



Labyrinth in my Heart - Template

12.10.12

HOLAAAAAAAAAAA!!!!!!!!!!!!!!!!!! Estoy mega-hiper-happy! ¿POR QUÉ? Porque hoy en la madrugada (si en la madrugada jejeje) cree una nueva Plantilla para Blogger (template). Abajo dejaré una captura de como se quedó.

A QUE ESTÁ HERMOSA (*0*)!
Si gustas verla en persona(?) date una pasadita por mi otro blog (labyrinthinmyheart.blogspot.com) y de paso me sigues. En ese blog publico de vez en cuando una que otra cosa rara de mi día a día, o sea mi vida (porque igual es rara jajaja). Hasta más rato, mientras iré a pulir unos detalles en la nueva plantilla (*///*).

Mi Primer Premio

10.10.12

OMG! OMG!! OMG!!! (; 0;) soy feliiiiiiiiiiiiiiiiiiiiiiiz!!!!!!!!! En serio no es broma ni dramatización.
。:゚(。ノω\。)゚・。 Lo digo de veras!

Muchas gracias Daniela (blog → http://dramas-asiatico.blogspot.com) por el lindo premio! m(__ __)m

WUUUUUUUUUUUUUUUUWW!!! -se va feliz-

Personaliza tu USB + Pack (fondos, iconos)

7.10.12

Hace tiempo que vi esta aplicación en las memorias usb de mis compañeras. Ese día me dije "Debo conseguir el programa pero ya!", y pasaron como dos años y lo olvidé. LOL. Pero hace poco lo volví a recordar gracias a que volví a ver la misma aplicación en la memoria usb de otra compañera.


¿Qué es esta aplicación? y ¿Para qué sirve?
Bueno esta aplicación se llama USB Personalizer, está diseñada para modificar la apariencia del USB e inclusive de windows. Es decir, en palabras más comprensibles, modifica el diseño de como se ve en pantalla, cambiando el fondo y los iconos de las carpetas del USB e incluso modificar el color de las letras de las carpetas, el icono y el nombre de su USB y además (sí hay más) los iconos y fondos de las carpetas de Windows.

Se caracteriza por ser...
  • Pequeño y portable lo puede llevar a donde sea.
  • Seguro y libre al 100% de adware (publicidad).
  • Interfaz sencilla.
  • Personaliza el icono de tu dispositivo.
  • Personaliza el fondo y el color de las letras de las carpetas de tu dispositivo y de windows.
  • Personaliza el icono de las carpetas de tu dispositivo y de windows.
  • Permite quitar los iconos y fondos de tu dispositivo y de windows.
  • Permite usar como icono archivos .exe e imágenes (.png, .jpeg, .gif, .icon).
  • Vista previa de los cambios a hacer.
  • Carga las personalizaciones ya echas en la interfaz.
  • Compatible con windows 7.
  • Cierra las ventanas abiertas, para tratar de hacerlos cambios al momento. Así que si tienes algo importante abierto, será mejor que lo guardes.
  • Modifica los discos duros.
  • Permite manejar los archivos ocultos en la memoria.
Descarga (↓↓↓)
Ahí arriba dejo la descarga (↑↑↑) dale click al osito, dentro de la descarga esta la aplicación, un pack de 26 fonditos y otro de 46 iconos, con los cuales podrás personalizar tu USB. Si gustas puedes usar los tuyos.

Instalación
  1. Descomprime este archivo. 
  2. Mueve el archivo "USB Personalizer.exe" a una carpeta en tu computador.
  3. Abre el archivo "USB Personalizer.exe". Para tu USB, ve a la pestaña raíz y empieza a personalizar su dispositivo USB. Para Windows (para personalizar tu ordenador), ve a la pestaña carpetas, seleccione la carpeta a modificar e inicia a personalizar Windows.
Estas son unas capturas que hice de mi memoria USB en windows XP y windows 7, como verán en W7 no se puede apreciar el fondo. Por desgracia la aplicación no es compatible con ninguna portatil ya que estas poseen el W7, pero esto no impide que se pueda ver el kawaiioso diseño en un ordenador con otro tipo de windows.

CLICK EN LAS IMG. PARA VER EN SU TAMAÑO NATURAL
AMO COMO SE VE EN XP (*0*)
TAMPOCO SE VE MAL EN W7 (*///*)
ESTA Y.... (↓↓↓)
...Y ESTA DEMUESTRAN QUE EL ICONO APLICADO SE VE INCLUSO CAMBIANDO DE VENTANA.
ESTA ES LA APLICACIÓN, MUY FÁCIL DE USAR!
En mi opinión es una aplicación muy práctica y lo mejor no pesa, ni hace lento el sistema 《/( ̄(エ) ̄)ゞ》 Ah! una cosa más, en los ordenadores con otro sistema operativo distinto a Windows 7 (como por ejemplo XP), podrán observar al abrir su memoria USB que hay unos cuantos archivos con sello de agua (semi-traslucidos), NO SON VIRUS! TRANQUILIDAD!!!!! LOL. Estos son el ícono y el fondo que has aplicado, NO LOS ELIMINES! Porque se borrarían la aplicación (o - o). Si no ves estos archivos no hay problema, siempre y cuando se vea la personalización que le hayas hecho a tu USB.

Bueno es todo por ahora, me retiro a estudiar algo para el examen de marketing o administración (lo que sea!). Créditos de esta aplicación a AlvarSoft ( alvarsoft.com ), desarrollado y dirijido por Christian010 (contacto@ayuda-virus.com). Dudas sugerencias en - alvarsoft.com/foro. Sitio oficial - alvarsoft.com

Con respecto a los iconos y fondos del pack, fueron recolectados y editados por mí. Por favor si vas a resubir esto a tu web o blog dame los créditos respectivos, ya que me tomé el trabajo de hacerlo.
\(・`(ェ)・)/ MUCHAS GRACIAS POR TU VISITA! Y DISFRUTA DE TU DESCARGA(?).

Emoticones super Kawaiis!

3.10.12

Bueno continuando con mi adicción a Blogger(?), hoy traigo unos hermosos emoticones. O más bien mi sister les trae. SI! Otra vez mi sister trae nuevas cositas kawaiis para tu blog (y el de ella claro. LOL).

Para descargar todos esos hermosos emoticones, visita su blog. Dejo el banner de su blog ahí abajo (↓↓↓)
maker gif
CLICK EN EL BANNER (↑↑↑) PARA IR A BLOG.

Simplemente no puedo(?)


Home About Design My designs Contact