Cómo eliminar la sombra y el cuadro de las imágenes en Blogger

1.-  Ingresamos al menú principal de nuestro Blog y hacemos clic en la opción Plantilla. Dentro de esta, hacemos click en Editar HTML. 

 

 2.- La nueva pantalla tendrá cuadro lleno de códigos, si es así, vamos bien.

Damos un clic dentro del cuadro y luego apretamos Control+F. Nos aparecerá un pequeño rectángulo en la esquina superior derecha que dirá “Search”.

*Es importante que el rectangulo de “Search” aparezca dentro del cuadro de códigos y NO dentro de nuestro navegador.

 

 3.- Dentro del cuadro Search escribiremos lo siguiente: .post-body img y luego presionamos la tecla Enter.

Una vez hecho esto, dentro de nuestro cuadro de texto aparecerán 2 líneas destacadas con lo mismo que acabamos de escribir en el buscador.

 

 Lo que nos importará es el texto que encontramos bajo el primer texto destacado, el cual corresponderá a la sombra de nuestra imagen. Puede variar un poco pero el código será algo así:

texto planocopiar codigoimprimir?

1. .post-body .tr-caption-container, .Profile img, .Image img,  
2. .BlogList .item-thumbnail img {  
3.     padding: 5px;  
4.   
5.     background: #fff;  
6.   
7.     -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);  
8.     -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);  
9.     -goog-ms-box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);  
10.     box-shadow: 1px 1px 5px rgba(0, 0, 0, .5);  
11. }  

4.- Nos ocupamos únicamente del texto destacado en negrita. Dentro de este texto debemos cambiar todos los números que se encuentran delante de las letras “px” por un 0.

*Debe quedar así:

texto planocopiar codigoimprimir?

1. -moz-box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);  
2. -webkit-box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);  
3. -goog-ms-box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);  
4. box-shadow: 0px 0px 0px rgba(0, 0, 0, .5);  
5. }  

Si hicimos todo bien, la sombra de nuestras imágenes habrá desaparecido.

 

 5.- Ahora eliminaremos el borde blanco. Para eso nos ocuparemos del texto bajo el segundo texto destacado. Que será algo así:

texto planocopiar codigoimprimir?

1. .post-body .tr-caption-container {  
2.     padding: 10px;  
3. }  

Y nuevamente cambiamos el número que está delante de las letras “px” por un 0.

texto planocopiar codigoimprimir?

1. .post-body .tr-caption-container {  
2.     padding: 0px;  
3. }  

 

 6.- Hacemos click en Guardar Plantilla y… ¡Listo!

 Todas las imágenes que insertemos de ahora en adelante y las que tengamos dentro del blog con anterioridad, habrán perdido su sombra y borde blanco.

*Si queremos en algún momento volver a tener el borde blanco o la sombra en las imágenes de nuestro blog, sólo debemos repetir el proceso recién realizado y devolver los valores a los originales.

Cualquier comentario, consulta o aplauso, por favor no olvides dejarlo más abajo.

Les recordamos que este tutorial ha sido desarrollado y documentado por el equipo de Cómo Lo Hago, por lo que cuenta con nuestro sello de garantía:

Fuente: http://www.comolohago.cl/como-eliminar-la-sombra-y-el-cuadro-de-las-imagenes-en-blogger/
por Hina Palitah

Read more...

Iconos gratis para tus programas y diseños

Los iconos nos ayudan a reconocer de un vistazo una idea, un programa o un mensaje. Los hay de distintos tamaños y se utilizan a diario en infinidad de contextos. Aunque puedes crear tus propios iconos, en ocasiones, por falta de tiempo o de recursos, necesitas cierto icono ya creado para añadir a un diseño lo antes posible. En Bitelia te hemos ofrecido varios recursos gratuitos para diseñadores y programadores web, como plantillas PSD. Ahora les toca el turno a los iconos gratis, que te servirán para páginas web, aplicaciones y toda clase de diseños al mejor precio.

Las páginas que verás a continuación ofrecen iconos gratuitos en varios formatos, en especial PNG e ICO. Los hay de muchos tamaños, aunque cada vez son más populares los de gran tamaño, que te servirán para cualquier diseño o página web. Decantarte por una u otra es difícil, por lo que te recomiendo echarles un vistazo.

• FindIcons: Disponible en varios idiomas, entre ellos el español, este buscador de iconos ofrece más de 400.000 iconos y más de 2.500 paquetes de iconos para uso personal. La calidad de los iconos es muy variada y de varios tamaños. Además de ser iconos gratis, están disponibles en varios formatos: PNG, ICO, ICNS, BMP, GIF, JPEG, PSD, TGA, TIFF, EPS y SVG. Puedes registrarte para subir tus propios iconos o descargarlos y marcar los que más te gustan. Por otro lado, ofrece un conversor de archivos en distintos formatos.
• IconArchive: Más de 450.000 iconos y 2.000 paquetes organizados por categorías. Este otro buscador ofrece también un buen surtido de iconos para todos los gustos, con distintas calidades y tamaños. Los iconos están disponibles en varios formatos, como PNG, ICO e ICNS, hay disponibles distintas licenicas y puedes compartir un icono que te guste a través de redes sociales (Facebook, Twitter y Google+).
• IconFinder: Uno de los buscadores de iconos gratis más populares y que ha cambiado con los años. Actualmente ofrece más de 350.000 iconos y 1.700 paquetes. Encontrarás iconos gratuitos y otros de pago, de calidad variable y en formato PNG, ICO e ICNS. Su buscador destaca por la posibilidad de filtrar el precio, el tipo de licencia y el tamaño en píxeles.
• iconlet: Algo más modesto, este buscador te permite buscar entre su colección de iconos, con calidades bastante dispares. La mayoría están en formato PNG y apenas ofrece opciones avanzadas de búsqueda.
• iconPot: Aunque algo caótico, iconPot te permite buscar y navegar por miles de iconos de gran calidad. A la derecha encontrarás una lista de categorías para filtrar los resultados y así encontrar el que más se ajuste a tus gustos.
• IconsPedia: Mejor organizado está IconsPedia, la enciclopedia de los iconos con categorías, buena calidad de los iconos, descarga en formato PNG e ICO y con una comunidad de usuarios con la que compartir tus iconos. En la columna de la izquierda encontrarás un práctico buscador con opciones avanzadas y así filtrar el resultado según la licencia, la cetegoría y el tamaño del icono.
• Icon Wanted: Su colección es más limitada que la de las páginas anteriores, con casi 40.000 iconos y 1.100 paquetes. Aún así, la calidad es aceptable, con posibilidad de escoger entre varios tamaños, guardar los iconos en PNG, ICO, GIF, ICNS o JPEG y compartirlo a través de Twitter, Facebook o Google+.
• InterfaceLIFT: Además de fondos de escritorio, temas y otras sorpresas artísticas, InterfaceLIFT tiene una sección de iconos con filtrado por fecha, descargas, puntuación, comentarios y tamaño (de 16×16 a 512×512. Puedes descargar los iconos en formato ICNS, ICO o PNG.
• Six Revisions: Esta práctica página para diseñadores y desarrolladores web cuenta con artículos y tutoriales, así como una sección de descargas de iconos, en su mayoría en PNG y PSD. La calidad de los mismos es muy buena, si bien no hay muchos disponibles.
• We Love Icons: Aunque es la página con menos iconos de los diez que te recomiendo, es la que ofrece mayor calidad, con iconos de gran tamaño disponibles para Mac (ICNS), Windows (ICO) y en PNG. Muy recomendables. Además, la página cuenta con su propio conversor de formato.

Fuente: https://hipertextual.com/archivo/2013/10/10-paginas-con-iconos-gratis/

Read more...