Bueno muchos de nosotros los bloggeros quisiéramos saber que entradas son más comentadas y son de interés para los visitantes.
Navegando por la red encontré este condigo que es de mucho interés para realizar este truco, bueno yo solo los guiare para su implementación y cualquier consulta, dejen sus comentarios.
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback& _id=e1f5a9b2248904d8b81f794c09353010&url=http%3A%2F%2Fsiguetublog.blogspot.com&num=5" type="text/javascript"></script>
Pasos a seguir:
Copiar el código y pegar en un gadget. “ ir a añadir un gadget, luego añadimos HTML/Javascript”.
Bueno en el código debemos de tener en cuenta esto, cambiar “siguetublog” por el blog de ustedes.
Entonces buscamos en el código esta sección &num=5 que quiere decir el numero 5 las entradas que mostraremos, para ello podemos remplazar por cualquier numero que ustedes deseen mostrar.
sábado, 20 de noviembre de 2010
crear y alojar un Favicon
Aquí otra vez con un truco muy sencillo y que muchos lo usamos para poner un icono que identifique a nuestro blog o web en la barra de direcciones que se encuentra en la parte superior del navegador.
Se llama favicon y se identifica con un pequeño icono al costado de la dirección de nuestro blog, Aquí los muestro.
Para poder implementar este truco debemos de seguir estos pasos.
Encontré una página donde podemos alojar su imagen gratuitamente y para ello recomiendo usar para seguir la implementación del truco. La página es IconJ.
Paso 1: entrar en IconJ.
Paso 2: tenemos que subir la imagen de nuestra PC “clic en Examinar para subir imagen” y luego dar clic en "Upload Now".
Paso 3: bueno aquí nos mostrara dos links que se genera al subir la imagen, nos vamos directo a la opción dos que se muestra y copiamos el link que esta en “Host It at IconJ.com: (Direct Link)”.
Paso 4: bueno en esta parte tenemos que añadir el código que copiamos, para ellos nos vamos directo a edición html, luego buscamos el código <b:skin><
Para poder implementar este truco debemos de seguir estos pasos.
Encontré una página donde podemos alojar su imagen gratuitamente y para ello recomiendo usar para seguir la implementación del truco. La página es IconJ.
Paso 1: entrar en IconJ.
Paso 2: tenemos que subir la imagen de nuestra PC “clic en Examinar para subir imagen” y luego dar clic en "Upload Now".
Paso 3: bueno aquí nos mostrara dos links que se genera al subir la imagen, nos vamos directo a la opción dos que se muestra y copiamos el link que esta en “Host It at IconJ.com: (Direct Link)”.
Paso 4: bueno en esta parte tenemos que añadir el código que copiamos, para ellos nos vamos directo a edición html, luego buscamos el código <b:skin><
Puedes ver la funcionalidad del truco cuando pones el cursor sobre el enlace o la imagen.
ejemplo 1 con un link.
<a href="http://siguetublog.blogspot.com/" target="_blank"title="sigue tu blog " alt="sigue tu blog">ayuda para tu blog</a>
ayuda para tu blog
ejemplo 2 con imagen.
Botón "Subir Arriba"
Para todos mis amigos bloggeros, en esta ocasión quiero presentar un código para subir arriba dentro del blog, quiere decir cuando el navegante se encuentra abajo en la parte inferior, esto hace a que el usuario pueda volver a la parte superior, y en caso que utilicen adsense, se incrementa un poco la probabilidad de los clics.
Aquí dejo el código que es muy bueno y sobre todo es con imagen para que sea un poco atrayente, bueno en este caso la url de la imagen pueden cambiarla al de su agrado y el texto también, espero que sea de gran ayuda.
Aquí dejo el código que es muy bueno y sobre todo es con imagen para que sea un poco atrayente, bueno en este caso la url de la imagen pueden cambiarla al de su agrado y el texto también, espero que sea de gran ayuda.
<a href='#' style='display croll;position:fixed;bottom:0px;right:0px;' title='volver arriba'><img src="http://img177.imageshack.us/img177/3782/topchicas.gif" /></a>
Presten atención como usarlo, aquí detallo los pasos a seguir:
Paso 1: Entrar en diseño
Paso 2: luego Añadir un Gadget
Paso 3: añadir HTML/Javascript
Paso 4: copiar el código.
Paso 5: clic en guardar
martes, 16 de noviembre de 2010
Eliminar o modificar barras de separación
Aquí vamos con otra entrada mas, para todos aquellos bloggeros que nos les gusta mucho la línea de separación que se encuentra en la columna de cada blog.
Bueno esto se puede modificar y en muchos casos ocultarlo.
Para esto se debe seguir los pasos:
Paso 1: ir a edición html
Paso 2: luego buscar estos códigos :
.sidebar .widget, .main .widget {
border-bottom:1px dotted $bordercolor;
Aquí va el detalle para los que quieren ocultarlo o eliminar la línea de separación, Cambia el valor border-bottom:1px por border-bottom:0px.
Para las personas que les gusto esta bien lo dejan ahí, pero si por ahí alguien quiere ver un poco mas resaltante esta línea solo tiene que cambiar border-bottom:0px el 0px por 3px.
Bueno esto se puede modificar y en muchos casos ocultarlo.
Para esto se debe seguir los pasos:
Paso 1: ir a edición html
Paso 2: luego buscar estos códigos :
.sidebar .widget, .main .widget {
border-bottom:1px dotted $bordercolor;
Aquí va el detalle para los que quieren ocultarlo o eliminar la línea de separación, Cambia el valor border-bottom:1px por border-bottom:0px.
Para las personas que les gusto esta bien lo dejan ahí, pero si por ahí alguien quiere ver un poco mas resaltante esta línea solo tiene que cambiar border-bottom:0px el 0px por 3px.
Codigos html para generar texto en movimiento
Aquí los dejo algunos códigos html que pude encontrar en varios blogs, son códigos muy utilizados en nuestra vida diaria en cuanto se refiere a los bloggeros y otras personas que navegan en el internet, espero que sea de mucha utilidad.
Codigo 1
Codigo 2
Codigo 3
Codigo 1
Codigo 2
Codigo 3
Eliminar Navbar (Barra de Blogger)
Muchos de nosotros los que trabajamos con blogger tenemos la barra de blogger en la parte superior y a algunos de nosotros les gusta eso y a otros no, bueno para los que no les gusta la barra de blogger, esta dedicado este truco para eliminar la barra.
Entonces presten atención copiar el código que les doy aquí y luego pegar antes de la etiqueta <head>.
<style type="text/css">
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
</style>
Pasos a seguir:
Paso 1: ir a edición html
Paso 2. Buscar la etiqueta <head>
Paso 3: pegar antes de la etiqueta <head> el código dado.
Paso 4: guardar plantilla.
ver la imagen donde se pega el codigo:
Entonces presten atención copiar el código que les doy aquí y luego pegar antes de la etiqueta <head>.
<style type="text/css">
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
</style>
Pasos a seguir:
Paso 1: ir a edición html
Paso 2. Buscar la etiqueta <head>
Paso 3: pegar antes de la etiqueta <head> el código dado.
Paso 4: guardar plantilla.
ver la imagen donde se pega el codigo:
lunes, 15 de noviembre de 2010
Poner una imagen como cabecera del blog
OPCION 1
Lo primero que debemos de hacer es tener nuestra imagen alojada en algún servidor que aloja archivos y sobre todo gratuito estaría mejor, entre los que uso y recomiendo es imaxenes, bueno cuando tengas la imagen alojada copias la ruta, y luego te diriges a blogger, haces un clic en plantilla y luego en edición html.
Buscas el siguiente código.
Guardas todos los cambios que hiciste y listo ya puedes tener una imagen como cabecera en tu blog, pero claro no olviden el detalle del tamaño tiene que ser de acuerdo a su blog, para ello les paso el significado de esto, ancho-width, alto-height que son manejables de acuerdo al tamaño.
Cualquier comentario hágalo llegar.
OPCION 2
Claro todo esto se puede realizar de otra manera, entrando blogger, clic en diseño, luego en agregar un gadget, encontrar cabecera de pagina y añadirlo, pero por defecto muchas veces esta agregado y solo entras al gadget, clic en editar y agregas la imagen. Pero bueno todo este proceso estaré publicando mas detallado en otra entrada.
Lo primero que debemos de hacer es tener nuestra imagen alojada en algún servidor que aloja archivos y sobre todo gratuito estaría mejor, entre los que uso y recomiendo es imaxenes, bueno cuando tengas la imagen alojada copias la ruta, y luego te diriges a blogger, haces un clic en plantilla y luego en edición html.
Buscas el siguiente código.
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
#header {
margin: 5px;
border: 1px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
Entonces luego añades tu url o la ruta de tu imagen, para que puedas visualizarlo como fondo, te ubicas dentro del bloque header, en mi caso yo elimine los bordes para eso elimine la linea que contenia border: 1px solid $bordercolor y en esa línea puse el código background-image: url para poder agregar la url de mi imagen, bueno el código siguiente debe quedar así.#header-wrapper {
width:660px;
margin:0 auto 10px;
}
#header {
margin: 5px;height:100px;
background-image: url(http://RUTA DE TU IMAGEN);
text-align: center;
color:$pagetitlecolor;
}
Guardas todos los cambios que hiciste y listo ya puedes tener una imagen como cabecera en tu blog, pero claro no olviden el detalle del tamaño tiene que ser de acuerdo a su blog, para ello les paso el significado de esto, ancho-width, alto-height que son manejables de acuerdo al tamaño.
Cualquier comentario hágalo llegar.
OPCION 2
Claro todo esto se puede realizar de otra manera, entrando blogger, clic en diseño, luego en agregar un gadget, encontrar cabecera de pagina y añadirlo, pero por defecto muchas veces esta agregado y solo entras al gadget, clic en editar y agregas la imagen. Pero bueno todo este proceso estaré publicando mas detallado en otra entrada.
Video Tutorial para crear un blog en Blogger
Como nuestra primera entrada en ayuda para blog aquí en siguetublog, presentamos un video tutorial con todos los pasos detallados, para crear un blog optimizado, claro todas las personas que desean seguir este video tutorial, deben de tener en cuenta que primero se debe tener una cuenta de correo electrónico, de preferencia en Gmail.
Suscribirse a:
Comentarios (Atom)
Entradas
