30 julio 2011

0 comentarios

Eliminar la numeración en las Etiquetas

Alguna vez nos topamos con este problema, desmarcamos la opción Mostrar cantidad de entradas por etiqueta y aun así nos sigue apareciendo la numeración, me tome el tiempo de buscar una solución y esta fue la siguiente:


Nos ubicamos en Diseño>Edición de HTML y activamos la opción Expandir plantillas de artilugios, tecleamos Ctrl+F y buscamos la siguiente linea:

(<data:label.count/>)

Una vez encontrado esta linea la eliminamos, guardamos plantilla y veremos que ya no tendremos ese problema.

29 julio 2011

0 comentarios

Buscador Interno estilo Google

En esta oportunidad comparto con ustedes un buscador interno para el blog al estilo de Google, jugando un poco con los estilos css, el resultado es el de la imagen, espero que les guste.


Si te gusto este Buscador, lo puedes usar en tu blog de la siguiente manera.

1.- Vamos a Diseño>Edición de HTML tecleamos Ctrl+F y buscamos ]]></b:skin> y sobre ella pegamos lo siguiente:

/* Boton y borde del buscador */
#search-btn {
width:70px;
height: 31px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHJyy8cj4e66ZI1KCbjcytfV3pUR9hIQWzVndEl1cwVuoe2cQZXx1K07V23m7bpmbjzV3blpZgJ8I9ixO0nZmwlwPzGpCz0J6bMsBMXNg1sOD60Par-AAgPifueqVbo7TvfKiGewI6ZHQ/s1600/ico-search.png) no-repeat #4d90fe center;
font-size:0;
padding: 1px;
margin: 0px 0px 0px 12px;
border: 1px solid #3079ED;
}

#search-box {
float:left;
width:300px;
height:27px;
line-height:27px;
text-indent:10px;
font-family:arial, sans-serif;
font-size:1em;
color:#333;
background: #fff;
border:solid 1px #d9d9d9;
}
/* Fin del codigo */

2.- Guardamos plantilla, nos vamos a Diseño>Añadir un Gadget>HTML/Javascript y allí pegamos el siguiente código:

<form action='/search' id='searchthis' method='get' style='display:inline;'><input id='search-box' name='q' type='text'/><input id='search-btn' type='submit' value=''/></form>

Con width:300px; puedes ajustar el ancho del buscador de acuerdo a tu blog, si seguiste bien los pasos el resultado sera como la imagen, Suerte!

28 julio 2011

0 comentarios

El trio Margin-Padding-Border

En la imagen de abajo puedes ver mejor a qué zona corresponde cada una de estas propiedades.


Puedes ver el borde, que le he puesto color azul para distinguirlo. Entre el borde y el contenido está la separación creada por el padding y entre el borde y el exterior el espaciado dejado por el margin.

Así, si ponemos dos imágenes una junto a la otra y queremos separarlas, usaremos por ejemplo el margin. Lo mismo para los párrafos etc. Si quisieramos separar un elemento A de los que tiene alrededor, le pondriamos a A un margin.

Si tenemos un elemento encerrado en una capa y queremos que su contenido se separe un poco de su extremo (de su borde) le hariamos un padding.

Con esta simple definicion, esperemos no tener mas confuciones.