Menú tipo acordeón - Posible Galería de Imágenes


Uno de nuestros lectores nos preguntaba cómo se hacía un menú de estos que tienen un estilo tipo acordeón. Este específicamente fue creado por ByScripts y voy a enseñarles cómo hacerlo. Primero les muestro el menú en su forma vertical y horizontal. Luego ustedes eligen cuál de los dos colocar en sus blogs.
Nota: A cada imágen le pueden poner un enlace si ustedes quieren, sino no. Por eso en el título le puse "posible galería de imágenes", porque pueden usarlo como menú o bien sin enlaces y usarlo como una mini galería de imágenes, esto lo deciden ustedes.


Read On 5 comentarios

Cómo ponerle fondo a las entradas de Blogger

Anteriormente vimos cómo ponerle fondo a una entrada de Blogger, pero en aquel caso era a una entrada particular, no a todas.
En la siguiente entrada, Cristina me preguntaba cómo ponerle fondo a todas las entradas del Blog.


Una forma sencilla de cambiar el color del fondo de las entradas que es dado por defecto, para cualquier plantilla, es la siguiente:
Read On 3 comentarios

Colocarle imágenes a los títulos de los gadgets

A pedido de uno de nuestros lectores es que decidí compartir esta entrada con ustedes.
El primer paso es identificar el ID del gadget al que se le quiere colocar la imágen, para ello entramos en  Plantilla | Edición de HTML y SIN marcar la casilla de expandir artilugios buscamos el gadget al que vamos a modificar, lo puedes identificar por el título, por ejemplo Etiquetas, o Lista de blogs.
Read On 4 comentarios

Cajas deslizantes laterales de Facebook,Twitter y Blogger.

A pedido de un visitante es que decidí elaborar esta entrada. Si se fijan bien a la derecha de este blog vamos a encontrar dos cajas que al hacer hover sobre ellas se abre una caja de Facebook y también de Twitter. En este caso les voy a enseñar a colocarlas en el blog de ustedes y además también la de Blogger para obtener seguidores ahí también.
Read On 14 comentarios

Campaña "LINK ME x LINK ME". ¡Obtené más visitas en tu Blog!

Luego de un tiempo de discutir esta campaña entre los ideadores, llegamos a la conclusión que este era el momento justo para llevarla adelante, teniendo en cuenta el "auge de Bloggers" y la necesidad de los mismos de hacer conocidos sus Blogs.

Lo primero que se deben preguntar ustedes:

¿Qué es la campaña LINK ME x LINK ME?


Sonará complicado pero la realidad es que hacer un "Link me" es nada más y nada menos que hacer un post o entrada para describir y comentar a otro blog. Y con esto nos referimos a recomendarlo, marcar cuáles son sus aciertos y virtudes, por qué vos creés que quién está leyendo ese post tiene que visitar el blog sobre el cual vos estás escribiendo,etc.
Read On 11 comentarios

Menú horizontal con submenúes y un efecto de balanceo.

Este es un menú horizontal con submenúes y un efecto de balanceo para nuestro blog de Blogger. Fácil de colocar, tan solo un código entero y podemos ponerlo en un gadget HTML/Javascript o donde mejor quede en nuestro blog. Como siempre, primero les muestro un ejemplo y luego les doy el código para hacerlo: Entonces acá vamos con la muestra:

Read On 20 comentarios

Colocar "Reportar enlace roto" en Blogger


Vamos a aprender a colocar un botón de "Reportar enlace roto" en nuestro Blog de Blogger. Antes aclaro que hace tiempo que no hago entradas en este blog pero de a poco iré retomando la actividad.

En esta entrada el usuario Pablo Peralta nos preguntó cómo se hacía esto, asique acá vamos.


Read On 0 comentarios

Colocar reproductor de MP3 en nuestro Blog.

Esto es un reproductor de MP3 para nuestro Blog de Blogger me ha sido muy muy útil para otros proyectos mios. Es sencillo de colocar, sencillo de utilizar, tiene un tamaño razonable y es muy fácil de editar. Como siempre primero les muestro un ejemplo de lo que estamos hablando con un audio de una clase de la universidad a modo de ejemplo para que puedan probarlo.

Read On 9 comentarios

Gadget de "Entradas Populares" con imágen y un buen efecto

Hola a todos, hoy vamos a aprender a colocar un gadget de "Entradas Populares" con imágenes incorporadas y un lindo efecto que lo acompaña.

Hace rato que no hacía una entrada, anduve con algunos problemas y contratiempos. Hoy vengo con algo sencillo, fácil de colocar.

Como siempre, primero les muestro un ejemplo y luego les explico cómo se hace. Tengan en cuenta que en mi ejemplo no van a salir imágenes casi porque a mis entradas no les agrego ninguna. Sepan que si pensamos en hacer SEO eso está muy mal(en este caso este es un blog en el que no estoy interesado en posicionarlo, sino simplemente compartir ciertas herramientas y conocimientos con quien lo necesite), hay que agregar imágenes y colocarle una descripción y usar el atributo alt, si no saben de lo que estoy hablando les explico de manera muy breve: agregar este atributo mejora en gran medida el posicionamiento de nuestras imágenes en el resultado de búsqueda en Google Images, y por ende tendríamos más visitas en nuestro blog ya que a Google le gustan las imágenes y más si tienen esta descripción ¿cómo se agrega? muy fácil, con este código:

<img src="URL DE LA IMAGEN" alt="DESCRIPCION"/>


Bien, ahora si les muestro el ejemplo:

-->
Bien, si les gustó entonces abren un gadget HTML/Javascript y colocan lo siguiente dentro:


<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='JavaScript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://TUBLOG.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>


Bien, ahora donde dice TUBLOG lo reemplacen por la url del blog de ustedes y un poquito más arriba donde dice 10 lo reemplazan por el número de entradas que quieren que muestre el gadget.

Terminamos, espero que les haya sido de utilidad, ¡Saludos!.
Read On 0 comentarios

[LINK ME x LINK ME] nuclearwebs.com

Queridos lectores de Hogar Blogger, seguimos con la "campaña Link me x Link me". A la cual los invito a unirse para poder ganar más seguidores y lectores en sus blogs, tarea que se nos hace muy difícil a todos los Bloggers, sobre todo al comienzo.

Read On 0 comentarios