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.

Entradas Recientes con imágenes y efecto deslizante

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!

16 comentarios:

  1. Hola me gusto mucho tu blog te gustaria afiliar?

    ResponderEliminar
    Respuestas
    1. wawa:)llevo buscado esto por todos lados:)gracias por ponerlo:)
      saludos!!!!
      y me alegra mucho que tu pierna este bien!!!!
      saludos!!!!!

      Eliminar
    2. Hola Saku-chan claro me gustaría afiliar (^^)

      Eliminar
  2. De nada Dayi (nwn) y aún tengo más tutoriales por publicar. Debo publicarlos antes de que los olvide xD jejeje

    ResponderEliminar
  3. Hola Kuma!!! Me gustaría que participases en mi concursito. Hasta pronto!!!

    ResponderEliminar
  4. necesita un poco de ayuda, para mi blog ese tamaño es un poco pequeño pero cuando lo agrando sale como entrecortado en una esquina, le puse de tamaño 280 y aún si lo disminuyo se ve cortado, no se que hacer -_-"

    ResponderEliminar
    Respuestas
    1. Hola Valitis, pasame el url de tu blog para checar cual es el problema (^^)

      Eliminar
    2. ya ps, aquí ta!
      http://valerie-historiastipoanime.blogspot.com/

      Eliminar
    3. Valitis. OH! ya me di cuenta cual es el problema (y tbn un error de omisión mía jeje) cambia el 220px que está en #spylist ul{ width por el número que quieras. Por ejemplo si quieres que el ancho sea de 280, coloca 300px en el primer width y 280 el el segundo (^^). Espero haberte ayudado. Lo correjiré en la publicación si gusta lo lees (nwn)

      Eliminar
  5. Kuma-sempai, use este tutorial (espero que no te haya molestado, pondre los creditos^^) Intente cambiar el formato, pero finalmente me lie tanto que lo deje igual T^T

    ResponderEliminar
    Respuestas
    1. No hay problema Yuuki-chan yo publico los tutoriales con el fin de compartirlos (nwn) y también para no olvidar como hacerlos jejeje XD

      Eliminar
  6. ME SIRVIÓ MUCHO!!! ARIGATO, YA ME PREGUNTARON COMO LO HICE Y YA TE RECOMENDÉ, TE PONDRÉ EN MIS CRÉDITOS :)

    ResponderEliminar
    Respuestas
    1. Que bueno que te sirvió Miiriss-chan (^^), cualquier pedido o problema con código házmelo saber :D

      Eliminar

HOME STAFF AFILIATE FOLLOW CONTACT
HOME STAFF AFILIATE FOLLOW CONTACT
Copyright© Nemuri Kuma | Powered by Blogger.
Design n' Blogger template by Kuma.