archivo del blog

Personalizar el widget de Archivo del blog

blog

Cómo hacer una imagen con fondo transparente

about me

Cómo hacer foto de perfil "sobre mi" redondo

blog

Cómo hacer un gif para el blog

blog

Cómo hacer un menú vertical con imágenes para blogger?

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

17.2.15

Personalizar el widget de Archivo del blog

Hola, hola! Bonita semana, un gusto estar por acá de nuevo con todos ustedes :D, muchas gracias por visitar el blog, comentarlo y suscribirse ¡Que emoción ya casi somo 300! Gracias a todos ♥
Y para celebrarlo les traigo un pedazo de tutorial muy bonito, eso sii es un poco largo ! No tanto en pasos si no que en código pero van a ver que esta fácil y el resultado esta divino. 
Se trata de cambiar el widget de archivo del blog a un calendario, este nos muestra los meses y nos marca los dias que hemos publicado. Si ven mi calendario se pueden dar cuenta que casi no tengo día fijo para publicar (que verguenza jaja) 
* Un plus de este calendario es que si le dan clic a cualquier dia que aparece en rojo  este nos lleva al post publicado en esa fecha ♥

Share to Facebook Share to Pinterest

30.10.14

Cómo hacer una imagen con fondo transparente

Hola, hola! Buenos dias a todos!
Hoy les traigo un tutorial muy fácil y útil que nos ayuda mucho cuando andamos haciendo imágenes para blogs con fondos de color.  Hoy vamos aprender a quitar el fondo blanco a una imagen y dejarla con fondo transparente.



1. Vamos a esta página: Pirlx
Damos clic en Open Imagen From Computer


imagen con fondo transparente


Cargamos nuestra imagen desde nuestros archivos y ya cargada quedará así


imagen con fondo transparente

2. Elegimos la herramienta de Wand tool que es como una varita , damos clc en el fondo blanco


imagen con fondo transparente

3. vemos que toda la foto la rodea una linea punteada , luego clic derecho sobre la imagen y damos cli en Invert Selection


imagen con fondo transparente

4. Nos damos cuenta que ahora solo nos marca  el contorno de la foto, vamos al menú de arriba y damos clic en Edit → luego  clic en Copy




 5. Vamos nuevamente al menú de arriba y damos clic en File → luego clid en New Image



6. Este paso es importante elegimos el tamaño de la nueva imagen, colocar los medidas que queramos que tenga la imagen sin fondo, damos clic en OK



7. Vamos al menú de arriba → Clic en Edit → Clic en Paste


imagen con fondo transparente

8. Nos quedara nuestra imagen así, ya casi vamos terminando



imagen con fondo transparente

9. Del lado derecho aparece este menú vertical de Layers, nos damos cuenta que  abajo de donde dice Layer 1 se encuentra → Background con un candadito, lo que vamos hacer es dar doble clic sobre Background y se quitara el candadito y damos clic para activar la casilla, tiene que quedar igual que la imagen, con las dos casillas activadas.


imagen con fondo transparente


imagen con fondo transparente


10. Luego damos ahi mismo sobre Backgroung clic derecho y damos clic en donde dice → Delete Layer
imagen con fondo transparente


11. Y listo! Nos damos cuenta que ahora el fondo de la imagen esta transparente, solo nos falta guardarla en nuestra pc


imagen con fondo transparente


12. Vamos al menú de arriba, damos clic en File → Clic en Save...


imagen con fondo transparente

13. Nos aparecerá esta ventanita → escribimos el nombre de nuestra imagen → en format: elegimos PNG (este es el formato que permite guardar imágenes con fondo transparente) y damos ok.


imagen con fondo transparente

imagen con fondo transparente


Y listo, hemos terminado.. Que les pareció el tutorial ? Lo comparten en las redes sociales!! Me encantaría leer sus comentarios ♥

Un abrazo!!


Share to Facebook Share to Pinterest

9.10.14

Cómo hacer foto de perfil "sobre mi" redondo


Para hacer este tutorial debes de tener en tu blog el gadget de perfil

Paso 1:  vamos a nuestro panel de blogger→ plantilla → editar HTML
Paso 2: Clic en los puntos suspensivos donde dice  <b:skin>… </b:skin>
Paso 3: buscar:  .post-body img  (presionar la tecla Ctrl y F al mismo tiempo, se abrira del lado derecho una cajita de búsqueda)
Paso 4: Aparecerá marcado dos veces con amarillo, borrar todo, como se ve en la siguiente imagen.











Paso 5: Luego de borrar el código anterior pegar este código

/* Perfil  redondo
----------------------------------------------- */
.widget.Profile .widget-content>a img.profile-img {
float: center;
min-width: 100px!important;
min-height: 100px!important;
max-width: 100px;
border-radius: 100px;
float: center;
}
.widget.Profile {
text-align: center;
float: center;
margin: auto;
}
/* perfil redondo
----------------------------------------------- */

Paso 6: guardar plantilla
 Hacer mas grande la imagen: solo se deben de cambiar los valores  que coloque de color rojo. En todos tiene que tener el mismo valor.
*Este código esta en http://www.everylittlepolish.com/

  • Hemos finalizado! El resultado es muy bonito ♥ 

  • Y ustedes lo van a usar en su blog? yo no me resisti y lo estoy usando! Me ha gustado el resultado!!




Share to Facebook Share to Pinterest

29.9.14

Cómo hacer un gif para el blog


Hola, hola! Muy buen día amigas! Hoy les traigo un tutotiral muy fácil y rápido, espero les sea de utilidad. Vamos aprender hacer un gif!
Que es un gif?
Un gif es el formato que tienen las imágenes con movimiento. Son  muy útiles cuando estamos anunciando algo y queremos llamar la atención del visitante de nuestro blog o web.
A continuación les voy a enseñar cómo hacer un gif y colocarlo en el blog.
  • Buscamos las imágenes que vamos  a necesitar , estas pueden ser diseñadas por nostras o buscadas por internet, fotografías, carteles.. Bueno lo que queramos mostrar
  • Deben de procurar que las imágenes tengan el mismo tamaño para que todo valla muy sutil. 



Luego de las explicaciones anteriores vamos al tutorial super fácil y rápido.



Formas de utilizar el gif en el blog
  • En los post: solo debemos de subir la imagen como siempre lo hacemos con las imágenes.
  •  En el lateral de nuestro blog:  agregar un  gadget de imagen, subimos la imagen y clic en guardar, luego colocamos el gadget donde queramos.




Les dejo unos ejemplo y si alguno le gusta puede llevárselo











Share to Facebook Share to Pinterest

17.9.14

Cómo hacer un menú vertical con imágenes para blogger?

He descubierto que me encanta hacer tutoriales aunque creo que me cuesta un poquito explicar bien, bien espero agarrarle maña pronto  jeje…
En esta ocasión les traigo este tutorial fácil de hacer con un resultado muy bonito y estético para  nuestro blog! Ya lo he dicho muchísimas veces ¡Me encantan las cosas personalizadas! Y hacer nuestro menú a juego con el blog es la ocasión perfecta para poner a volar nuestra imaginación y creatividad, son una de las cosas que más amo, bueno… siempre y cuando tenga tiempo jeje! Tengo una hija de dos años y absorbe mi tiempo como esponja por eso me acuesto tarde y me levanto bien tempranito, con decirles que solo duermo 5 o 6 horas!!!  Pero hay días que todo se junta y a las 9 de la noche ya ando babeando la almohada!!!

Bueno después de escribir hablar un ratito pasamos al tutorial! Les explico paso a paso como lograrlo y les dejo dos ejemplos para que se den una idea de cómo queda el resultado final 


Share to Facebook Share to Pinterest