blogsmadeinspain: widgets

Mostrando entradas con la etiqueta widgets. Mostrar todas las entradas

Personalizar y aumentar el tamaño del gadget "Presentación" de Blogger

Seguro que la mayoría de vosotros conoce el gadget estándar de Blogger titulado “Presentación”. Con él conseguimos fácilmente una bonita presentación, slide o slideshow de fotografías alojadas en Picasa, Flickr, PhotoBucket y otros servicios similares.

Para ello, solo tenéis que acceder a “Diseño” del administrador del blog, y “Añadir un gadget” en el lugar que queráis colocar esta presentación fotográfica. Pinchar sobre el elemento con el título “Presentación” y configurar unos parámetros muy fáciles.

Pero este gadget tiene un enorme defecto que Blogger aún no ha resuelto, y es que es demasiado pequeño. Así que si queréis transformar este gadget a un tamaño mayor y personalizar algunos de sus aspectos, seguid leyendo…

Leer completo...[+/-]

Es muy fácil de hacer. Una vez colocado el gadget en vuestro blog, simplemente tenéis que colocar este pequeño código en vuestra plantilla, justo antes de ]]></b:skin>

.slideshow-container {
width: 297px;
height: 221px;
background: #bb0000;
border: 2px solid #bb0000;
}

En ese código podéis colocar todas las propiedades CSS que queráis asignar al gadget. Yo, por ejemplo, he colocado las siguientes propiedades:

width: Ancho en píxeles.
height: Alto en píxeles.
(El tamaño del gadget debería tener las misma proporción que las imágenes alojadas. Además, no hagas un tamaño excesivamente grande, ya que perderán mucha calidad las imágenes)

background: Color de fondo en el gadget, visible mientras se cargan las imágenes.

border: Con esta propiedad podemos añadir un borde a todo el gadget, como podéis ver en el ejemplo que os he colocado yo en esta entrada, donde aparece un borde rojo oscuro.

Espero que os haya resultado interesante este sencillo truco que os va a ayudar a embellecer vuestro blog.

Gadget para mostrar la fecha del día

Os he diseñado un sencillo gadget para los que estáis interesado en colocar la fecha diaria en un sitio visible de vuestro blog. Aunque yo os dejo aquí cuatro modelos diferentes, los que seáis un poco “manitas” con el lenguaje html podéis fácilmente cambiar la imagen de fondo, tipo, tamaño y color de letra, etc…

Para colocarlo en vuestros blogs, solo tenéis que elegir el modelo que más os guste y añadir sus códigos como gadget "HTML/Javascript".

Gadget by Blogsmadeinspain	Gadget by Blogsmadeinspain
Gadget by Blogsmadeinspain	Gadget by Blogsmadeinspain

Ver código del modelo superior izquierdo...[+/-]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(diasSemana[f.getDay()]);

</script></div>

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getDate() + " de " + meses[f.getMonth()]);

</script></div>

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getFullYear());

</script></div></div></strong></center>

<div style="position:relative;top: -7px; #top: -14px"><p><div style="text-align: center; line-height: 0.1em; font-size: 10px"><font face="century gothic">Gadget by <a href="http://www.blogsmadeinspain.blogspot.com/" target="_blank">Blogsmadeinspain</a></font></div></p></div>

Ver código del modelo superior derecho...[+/-]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getDate() + " de " + meses[f.getMonth()]);

</script></div>

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getFullYear());

</script></div></div></center>

Ver código del modelo inferior izquierdo...[+/-]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getDate() + " de " + meses[f.getMonth()]);

</script></div>

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getFullYear());

</script></div></div></center>

Ver código del modelo inferior derecho...[+/-]

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(diasSemana[f.getDay()]);

</script></div><strong>

var meses = new Array ("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre");

var diasSemana = new Array("Domingo","Lunes","Martes","Miércoles","Jueves","Viernes","Sábado");

var f=new Date();

document.write(f.getDate() + " de " + meses[f.getMonth()] + " de " + f.getFullYear());

</script></div></strong></div></center>

Como siempre, espero que os guste y sea de utilidad para muchos.

ESPECIAL EMPRESAS: Tu espacio web más económico

¿Necesitas que tu negocio sea visible en internet pero quieres emplear poco dinero?

La plataforma gratuita Blogger ofrece unas enormes posibilidades para crear espacios web para empresas o particulares, como puedes ver en nuestros últimos trabajos realizados.

Blogsmadeinspain te ofrece la opción más económica que podrás encontrar:

* Diseño exclusivo de la plantilla Blogger.
* Instalación completa.
* Desarrollo del contenido completo hasta 6 páginas interiores.
* Colocación de todos los gadgets y elementos necesarios…

¡Por solo 90 euros, sin ningún gasto mensual o anual!

No pierdas esta oportunidad de hacer visible tu negocio en internet por muy poco dinero. Plano de situación, formulario de contacto, galería fotográfica, todo el contenido que necesite tu negocio.

Además:

* Subdominio gratuito del tipo http://www.miempresa.blogspot.com , con posibilidad de dominio propio por 10 euros al año.

* Facilidad de modificación de datos por usted mismo, ó posibilidad de mantenimiento a precios muy bajos.

* Trato personal y directo. Siempre hablará con la misma persona.

* Personalización absoluta y diseños completamente exclusivos para su sitio.

* Damos de alta su sitio web en los principales buscadores.

* Sitemap para Google.

* Posibilidad de integración en comunidades y redes sociales.

* También todo el diseño gráfico que necesites, logotipos, banners, folletos, carteles, etc… a precios sin competencia.

En estos tiempos, todos los negocios necesitan tener presencia en internet para incrementar su volumen de beneficios.
Infórmate Aquí y contactando con nosotros en blogsmadeinspain@gmail.com

Colocar la Navbar o barra de navegación de Blogger en la parte inferior

A menudo se colocan en la parte superior de los blogs menús de pestañas o barras de navegación propias, pero no se quiere eliminar la barra de navegación que Blogger tiene por defecto.
Una buena solución para esos casos es colocar la navbar estándar de Blogger en la parte inferior de la pantalla, de forma fija.

De esa forma conseguimos que la atención de nuestras visitas se centre en nuestra navbar o menú de la parte superior, pero seguimos manteniendo la navbar estándar. Esto es muy fácil de hacer. Simplemente hay que colocar este pequeño código justo antes de ]]></b:skin>

#navbar-iframe { right: 0px; bottom: 0px; left: 0px; position: fixed; }

También os comento que casi en la totalidad de las plantillas Blogger diseñadas por mí, elimino la navbar estándar de Blogger. Si queréis hacer el truco anterior, primero tenéis que eliminar esta línea de código que podréis encontrar antes de ]]></b:skin>

#navbar-iframe { height:0px; visibility:hidden; display:none }

Gadget Contador de entradas, comentarios y días online de tu blog

Blogsmadeinspain os ha diseñado este útil gadget. Se trata de un contador de entradas, comentarios y días online para vuestro blog.
Con él podéis informar a vuestras visitas del contenido y antigüedad de vuestro blog de una forma atractiva y llamativa.
Solo tenéis que elegir el modelo que más os guste, añadir sus códigos como gadget "HTML/Javascript" y colocar la dirección URL y la fecha de creación de vuestro blog donde os indico más abajo.
Los datos se actualizarán solos a diario. Por cierto, los datos que veís en estos tres modelos son los reales de Blogsmadeinspain.

entradas
comentarios

días online

Gadget by Blogsmadeinspain

entradas
comentarios

días online

Gadget by Blogsmadeinspain

entradas
comentarios

días online

Gadget by Blogsmadeinspain

Ver código del modelo de la izquierda...[+/-]

<center> <table border="0" cellspacing="17" cellpadding="0" width="170" background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPFrD-Latcv29EQtSh7sbJSMXfkw8AzodKWfvoJSyqyg_CQxGJyy_whC2f7rSYPfresjxiopfDep-fONG6WXWoqz5R7nHrmUHgKY0lLaxlT-NCy1_Hg-0gQk-XlnghKIn7CPXF8w7lpsrO/" height="118"><tbody> <tr>
<td valign="top" width="170"><font color="#000000" face="Arial Black"> <div style="text-align: left; line-height: 1.9em; font-size: 11px"><script style="text/javascript"> function showpostcount(json) { document.write(parseInt(json.feed.openSearch$totalResults.$t,10)); }</script>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">  entradas</font>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">  comentarios</font>
<br /> <div style="text-align: left; line-height: 1.8em; font-size: 13px"><script> function DiasOnline(Dia, Mes, Year, Texto) { Meses = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"); Hoy = new Date(); Inicio = Date.parse(Meses[Mes - 1] + " " + Dia + " " + Year); Resultado = Math.round((Hoy.getTime() - Inicio) / 86400000); document.write(Resultado + " " + Texto); } DiasOnline(12, 2, 2008, "" );</script><font face="century gothic"> días online</font></div> </div> </font></td> </tr> </tbody></table> </center>
<div style="position:relative;top: -20px"><p><div style="text-align: center; line-height: 0.1em; font-size: 10px"><font face="century gothic">Gadget by <a href="http://www.blogsmadeinspain.blogspot.com/" target="_blank">Blogsmadeinspain</a></font></div></p></div>

Ver código del modelo del centro...[+/-]

<center> <table border="0" cellspacing="17" cellpadding="0" width="170" background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhctAPiQWh9sX3IpCP0jum2hvmjK2tMHswmUN569pv28q04Ht1A49xdn4JRuXroIrPGB1NnPYLtYNvdQEk-dIqzPUeVQKXeLkjByR-fKRLfeHyeRoJUEXzNlmINmxz1qfLknhk-KkvkzIgh/" height="118"><tbody> <tr>
<td valign="top" width="170"><font color="#ffffff" face="Arial Black"> <div style="text-align: left; line-height: 1.9em; font-size: 11px"><script style="text/javascript"> function showpostcount(json) { document.write(parseInt(json.feed.openSearch$totalResults.$t,10)); }</script>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">   entradas</font>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">   comentarios</font>
<br /> <div style="text-align: left; line-height: 1.8em; font-size: 13px"><script> function DiasOnline(Dia, Mes, Year, Texto) { Meses = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"); Hoy = new Date(); Inicio = Date.parse(Meses[Mes - 1] + " " + Dia + " " + Year); Resultado = Math.round((Hoy.getTime() - Inicio) / 86400000); document.write(Resultado + " " + Texto); } DiasOnline(12, 2, 2008, "" );</script><font face="century gothic"> días online</font></div> </div> </font></td> </tr> </tbody></table> </center>
<div style="position:relative;top: -20px"><p><div style="text-align: center; line-height: 0.1em; font-size: 10px"><font face="century gothic">Gadget by <a href="http://www.blogsmadeinspain.blogspot.com/" target="_blank">Blogsmadeinspain</a></font></div></p></div>

Ver código del modelo de la derecha...[+/-]

<center> <table border="0" cellspacing="17" cellpadding="0" width="170" background="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjlbnGijeLivoni0t5l7L6-5Qhs_7W3fKXiUeEd36MmUNBmwqXu_cJ25lZmDhs02lmAPjcsptMNMjvIyn1IfuqPKfiCY_8Ds2hrAr_zanLWzajwboZ5VftF84uqcKqk5Eopgq915rClq3E/" height="118"><tbody> <tr>
<td valign="top" width="170"><font color="#747474" face="Arial Black"> <div style="text-align: left; line-height: 1.9em; font-size: 11px"><script style="text/javascript"> function showpostcount(json) { document.write(parseInt(json.feed.openSearch$totalResults.$t,10)); }</script>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">  entradas</font>
<br /><script src="URL COMPLETA DE TU BLOG/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script><font face="century gothic">  comentarios</font> <br /> <div style="text-align: left; line-height: 1.8em; font-size: 13px"><script> function DiasOnline(Dia, Mes, Year, Texto) { Meses = new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"); Hoy = new Date(); Inicio = Date.parse(Meses[Mes - 1] + " " + Dia + " " + Year); Resultado = Math.round((Hoy.getTime() - Inicio) / 86400000); document.write(Resultado + " " + Texto); } DiasOnline(12, 2, 2008, "" );</script><font face="century gothic"> días online</font></div> </div> </font></td> </tr> </tbody></table> </center>
<div style="position:relative;top: -20px"><p><div style="text-align: center; line-height: 0.1em; font-size: 10px"><font face="century gothic">Gadget by <a href="http://www.blogsmadeinspain.blogspot.com/" target="_blank">Blogsmadeinspain</a></font></div></p></div>

Colocar los siguientes elementos para adaptarlo a vuestro blog:
URL COMPLETA DE TU BLOG: Aparece en dos ocasiones en los códigos. Coloca ahí la dirección completa de tu blog, incluyendo http://
12, 2, 2008: Debes sustituir esos números por la fecha de nacimiento de tu blog, la fecha en que publicaste tu primera entrada. En el orden Día, Mes, Año

Regalo de Blogsmadeinspain para todos los suscriptores

He decidido celebrar que Blogsmadeinspain ha superado los 1500 días online para premiar a mis lectores más fieles.
En este libro digital hago recopilación de los mejores trucos para Blogger que he publicado y todas las plantillas gratuitas diseñadas por mí. Con 40 páginas y 120 plantillas de descarga y uso gratuitos, totalmente originales.

Libro digital en formato PDF para que podáis verlo sin necesidad de estar conectados a internet. Aunque también incluye todos los links o enlaces de los posts originales y de descarga de cada una de las plantillas.

Ha supuesto un gran esfuerzo de tiempo y dedicación, pero con más de 330.000 visitas únicas, 1.880 amables comentarios y casi 700 suscriptores vía email, es lo menos que podía hacer.

Los que ya seáis suscriptores vía email verificados solo tenéis que mandarme un email con la misma dirección de correo con la que estéis suscritos, y yo os contestaré mandando la edición PDF de este libro-recopilación.

Y los que queráis obtener dicho libro totalmente gratuito, pero aún no estéis suscritos vía email a Blogsmadeinspain, ahora es el momento de hacerlo… Pinchad sobre el icono “Vía Mail” y suscribiros. FeedBurner os mandará un correo para que verifiquéis la suscripción, verificadla y comunicadme a mí vuestro interés por el libro. Yo os lo mandaré al mismo email con el que os hayáis suscrito.

He optado por no dejar su descarga totalmente libre para premiar a las personas que son más asiduas a mi blog. Quiero agradecerles toda su fidelidad, además de aprovechar para dar un fuerte abrazo a todos y todas l@s que habéis confiado en mí para crearos plantillas exclusivas. No os podéis imaginar la enorme gratitud que os tendré siempre por vuestro trato, vuestra amabilidad y vuestra inestimable ayuda económica.

Solución a la redirección de Blogger con subdominios según el país desde el que se accede

Ayer os explicaba en esta entrada anterior el cambio efectuado por Blogger para que nuestros blogs redireccionaran automáticamente a direcciones URL con subdominios según el país desde el cual se visitaba.
Esto generaba graves problemas sobre todo en el posicionamiento y PageRank.

Como podéis comprobar en mi propio blog, esto ya tiene una fácil solución. Simplemente es necesario colocar un pequeño código de un script, en la edición HTML de la plantilla que estéis usando en el blog. Y se la debemos a Emilio Cobos.

Simplemente colocar el siguiente código inmediatamente después de <head> :

No tenéis que cambiar nada en el código. Y además al ser pequeño será muy fácil de eliminar si dentro de un tiempo no es necesario. Yo creo que todos estos cambios de Blogger no son definitivos, más bien son pruebas que realizan.

Blogger cambia la URL de tu blog con subdominios según el país desde el que se accede

Esta mañana nos hemos despertado con la sorpresa de que Blogger ha cambiado las direcciones URL en que se ven nuestros blogs, dependiendo cual sea el país desde el que se accede.
Así si accedéis a este blog desde España veréis en vuestra barra de navegación www.blogsmadeinspain.blogspot.com.es , pero si accedéis por ejemplo desde México lo veréis de esta otra forma www.blogsmadeinspain.blogspot.com.mx.

Esto supone un grave perjuicio a los blogs que llevamos años funcionando, con muchas visitas y un Pagerank alto, ya que nuestros blogs se quedan con Pagerank cero, como si hubiésemos comenzado a publicar hoy mismo.
Comenzaron controlando los comentarios con el pretexto de controlar el SPAM, siguieron con un control más estricto de los contenidos que ellos consideraban no apropiados, y ahora nos vienen con este cambio que nos perjudica muy gravemente.
Los únicos blogs que no se ven perjudicados por estos cambios son los que usaban un dominio propio.

Además, cuando pase el tiempo y recuperemos algo de Pagerank, nos encontraremos con que este será diferente en cada país. Incluso parece que algunos gadgets están dando problemas.

Y este es el motivo que nos da Blogger para estos cambios:

Realizaremos este cambio para proporcionar más asistencia en relación con la administración local del contenido. Si recibimos una solicitud de eliminación de contenido que infrinja la legislación local, este ya no estará disponible para los lectores en los dominios locales en los que estén en vigor esas leyes. Esta actualización es coherente con nuestro estrategia en cuanto a la libre expresión y la eliminación de contenido controvertido, que no ha variado.

Desde aquí quiero instar a todos los blogueros que usamos esta plataforma a que publiquéis una entrada en vuestros blogs rechazando este nuevo cambio tan perjudicial, y que solo va dirigido a controlar, controlar y controlar cada vez más nuestra libertad de expresarnos.

Crear un sencillo ÍNDICE con todas las entradas de tu blog

Hay muchas maneras de crear un ÍNDICE con todas las entradas de vuestro blog. Yo os voy a enseñar aquí la manera más fácil de todas. Las hay con presentaciones más atractivas, más elaboradas, etc… Pero ninguna es tan fácil como la que os muestro a continuación, donde solo tendréis que pegar un pequeño código donde queráis crear el índice. Y no por fácil deja de ser funcional, muy organizada y rápida de carga.

Podéis organizar vuestro índice clasificando las entradas por etiquetas... VER DEMO
O clasificándolas por fecha de publicación... VER DEMO

En el primer caso, aparecen marcadas las 10 o 12 últimas entradas publicadas con el indicador Nuevo!. Y en el segundo caso aparecen agrupadas por meses.

Leer completo...[+/-]

Para crear un índice de entradas agrupadas según las etiquetas de vuestro blog, cread una página en “Creación de entradas / Editar páginas” pinchando sobre PÁGINA NUEVA. Y en la pestaña “Edición de HTML” pegad este código:

Solo tienes que sustituir NOMBRE DE TU BLOG para adaptarlo a tu blog.

Si deseas ordenar las entradas por su fecha de publicación, haced igual que antes, pero pegando este código:

E igualmente sustituir NOMBRE DE TU BLOG para adaptarlo a vuestro blog.

EDITADO: Parece que a algunas personas les está dando problemas el alojamiento del archivo script, pese a estar configurado como archivo público. Podéis descargaros el archivo y alojarlo en alguna cuenta vuestra de "Google Sites" u otro servicio que soporte scripts.
Para ello colocar en vuestro navegador una de las rutas URL siguientes: (dependiendo de si queréis crear el índice por etiquetas o por fechas http://sites.google.com/site/blogsmadeinspain/indice.js http://sites.google.com/site/blogsmadeinspain/indicefecha2.js

Acceso restringido por contraseña en Blogger

Muchos de vosotros me habéis preguntado por la posibilidad de acceder a vuestro blog de Blogger, o a algunas de sus entradas con carácter restringido, es decir, teniendo un control de acceso mediante contraseña. Esto serviría para crear contenido que solo sea accesible a las personas que vosotros decidáis, a las cuales les habréis facilitado anteriormente la contraseña para tener acceso.
Con ello se abren infinidad de posibilidades en los blogs de Blogger, como zonas VIP o Premium, de acceso previo pago, contenido personal visible solo para vuestros amigos o visitantes especiales, etc...

He conseguido averiguar como hacerlo de una manera muy fácil. Para que podáis ver su funcionamiento he creado una página de Blogsmadeinspain de acceso restringido mediante contraseña. La contraseña para acceder a ella es 123456.

Ver Demo

Si estáis interesado en este tema. Seguid leyendo….

Leer completo...[+/-]

Como seguramente sabéis, la totalidad de un blog puede hacerse con acceso restringido en “Configuración / Permisos”, con la figura de los “lectores invitados”. Pero esta figura, además de restringir el acceso a la totalidad del blog, y no solo a una o varias entradas, tiene la limitación actual de 100 “lectores invitados”. Número totalmente insuficiente en la mayoría de los casos.

Para restringir el acceso a una entrada, solamente tenéis que pegar un pequeño código en la entrada de que se trate. Pero vayamos por orden. Seguid estos puntos:

1.- Cread una página o entrada donde se desvíe a vuestros visitantes que introduzcan una contraseña incorrecta. Podéis ver un ejemplo de ello si en mi Demo no colocáis la contraseña que os he indicado arriba. Esta entrada podría ser una entrada normal o página estática de vuestro propio blog o una entrada en un blog creado exclusivamente para esto, como es el caso de mi ejemplo. La dirección completa URL de esta entrada con el mensaje de error la llamaremos URL página de Contraseña incorrecta.

2.- En el Editor de Entradas, al crear la entrada que queremos proteger mediante contraseña, pincharemos sobre la pestaña “Edición de HTML”, y añadiremos justo al principio este código:

En contraseña colocar la contraseña que queráis. (Evidentemente puede ser diferente para cada entrada de acceso restringido). La URL página de Contraseña incorrecta ya os expliqué arriba qué es lo que era. Y por último, de color rojo lleváis marcados los mensajes que podéis personalizar a vuestro gusto.

Otras consideraciones:

- Sería conveniente que en la página que creéis con el mensaje de “Contraseña incorrecta” coloquéis también un enlace o link para volver a la página inicial de vuestro blog.

- La protección por contraseña estará operativa tanto en la entrada individual que se ha restringido, como en cualquier página de vuestro blog donde aparezca dicha entrada. Es decir, también deberá introducirse la contraseña para acceder a la página principal o de etiquetas, si contiene al menos una entrada restringida. Es precisamente esta última propiedad la que podemos aprovechar para proteger íntegramente un blog en su totalidad. Para ello debemos colocar los códigos antes indicados en todas las entradas.

El mejor traductor actual para un blog

Después de probar varias de las posibilidades que actualmente existen para colocar un traductor en tu blog, sigo recomendando “Google Traductor”. Se ha remodelado estéticamente y funcionalmente para darnos un mejor servicio en nuestros blogs.
Presenta varias posibilidades de visualización: insertado en algún lugar del blog, en forma de pestaña en una de las esquinas del sitio, e incluso con la posibilidad de que automáticamente presente un banner de traducción al detectar el lugar de visita con lengua diferente a la que está escrito el blog.

Y como siempre, resulta rápido y fiable. Si queréis colocar este traductor, que podéis ver y probar en la sidebar derecha de mi blog, pinchad AQUÍ.

Os explico a continuación algunos aspectos a tener en cuenta a la hora de configurar este gadget de traducción para vuestro blog.

Leer completo...[+/-]

Después de decidir en los dos primeros pasos, en el “Paso 3” pinchad sobre “Mostrar configuración opcional”. Entonces se desplegarán varias opciones para poder configurar el gadget. La primera opción que se os presenta es poder elegir entre todos los idiomas (53 idiomas) o seleccionar vosotros mismos los que queráis. Después tendréis que elegir el “Modo de presentación”, entre los tres que os comentaba al principio del post. Y dentro de cada uno hay varias posibilidades. Lo mejor es que hagáis pruebas a ver cual os gusta más para vuestro blog.

Una vez decididas estas opciones, en el “Paso 4” se os mostrará el código que tenéis que pegar como elemento “HTML/Javascript” en “Añadir un gadget” de vuestro blog. Pero antes pinchad, debajo del cuadro donde aparece el código, en “Vista previa de la página” y podréis ver justo debajo como os quedará el gadget con las opciones que habéis elegido.

Por si alguno quiere ahorrar tiempo y le gusta tal y como yo lo tengo en mi sidebar derecha, este es el código que yo uso:

<center><div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
    pageLanguage: 'es',
    includedLanguages: 'de,ar,cs,zh-CN,zh-TW,da,es,fi,fr,el,iw,hi,nl,en,it,ja,pt,ro,ru,sv,tr',
    autoDisplay: false,
    layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');}
</script><script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script></center>

Centrar fotografía en su columna con el gadget de Blogger “Imagen”

La mayoría de blogueros que comienzan en Blogger usan para colocar sus imágenes en las columnas laterales de su blog el gadget estandar de Blogger titulado “Imagen”.
Ese gadget se usa para colocar imágenes en cualquier parte del blog que no sean entradas, además permite colocarle un enlace o link a la imagen y un texto de “Pie de foto”.

Pero en la mayoría de los casos, la imagen que se coloca queda descentrada respecto a la columna, apareciendo alineada a la izquierda. He recibido varias consultas sobre este tema, y he encontrado una solución muy fácil para centrar la imagen que se coloca.

Leer completo...[+/-]

Basta con acceder a “Diseño / Edición de HTML”, y colocar en la plantilla el siguiente código, antes de ]]></b:skin>

.sidebar img { display: block; margin: 0 auto;}

Pero el mismo problema tendremos con el texto “Pie de foto” si no ocupa un renglón completo o varios renglones, es decir, nos quedará alineado a la izquierda y no centrado en la columna.
Pero esto tiene todavía una solución más fácil. Delante y detrás del texto que queramos poner como “pie de foto” colocamos <center> y </center> respectivamente. Quedando de esta forma:
<center>TEXTO DE PIE DE FOTO</center>

Corregir el error en los botones para "compartir" de algunas plantillas.

Hace ya algún tiempo Blogger cambió el sistema que venía usando de botones para "compartir" , eliminando el botón Buzz y modificando otros temas internos.
Pués bien, en alguna de las plantillas que diseñé antes de ese cambio, este sistema de botones daba algún error en su visualización o no se veían. Solo se producía error en algunas de las plantillas, en el resto funcionan perfectamente.

La solución para los que tengáis instalada alguna de esas plantillas es muy fácil, solo hay que modificar un par de códigos.

Leer completo...[+/-]

Entrad en "Diseño/Edición de HTML" y, antes de ]]></b:skin> , colocar este código:

.share-button {display: inline-block;}

También localizar este otro código:

<b:includable id='shareButtons' var='post'>
<b:if cond='data:post.sharePostUrl'>
<a class='share-button sb-email' expr:href='data:post.sharePostUrl +
"&target=email"' expr:title='data:top.emailThisMsg' target='_blank'>
<span class='share-button-link-text'><data:top.emailThisMsg/></span></a>
<a class='share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, "" + data:top.blogThisMsg + "", "height=270,width=475"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'>
<span class='share-button-link-text'><data:top.blogThisMsg/></span></a>
<a class='share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'> <span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a>
<a class='share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, "" + data:top.shareToFacebookMsg + "", "height=430,width=640"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'>
<span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a>
<a class='share-button sb-buzz' expr:href='data:post.sharePostUrl + "&target=buzz"' expr:onclick='"window.open(this.href, "" + data:top.shareToBuzzMsg + "", "height=415,width=690"); return false;"' expr:title='data:top.shareToBuzzMsg' target='_blank'>
<span class='share-button-link-text'><data:top.shareToBuzzMsg/></span></a>
</b:if>
</b:includable>

Y cambiarlo por este otro:

<b:includable id='shareButtons' var='post'>
<b:if cond='data:post.sharePostUrl'>
<a class='share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'> </a>
<a class='share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, "" + data:top.blogThisMsg + "", "height=270,width=475"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'> </a>
<a class='share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'> </a>
<a class='share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, "" + data:top.shareToFacebookMsg + "", "height=430,width=640"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'> </a>
<a class='share-button sb-buzz' expr:href='data:post.sharePostUrl + "&target=buzz"' expr:onclick='"window.open(this.href, "" + data:top.shareToBuzzMsg + "", "height=415,width=690"); return false;"' expr:title='data:top.shareToBuzzMsg' target='_blank'> </a>
</b:if>
</b:includable>

Blogsmadeinspain reanuda totalmente su actividad

Después de muchos meses de parada obligada, os anuncio que ya vuelvo a prestar desde este blog todos los servicios de diseño de plantillas exclusivas Blogger y diseño gráfico en general.
He tenido que subir el precio del diseño de plantillas, ya que son muchas las horas que dedico a cada diseño. Pero creo que todavía es bastante económico y está al alcance de todos.

Os recuerdo que podéis ver muchos de mis trabajos de diseño en Designmadeinspain, plantillas Blogger, logotipos, banners, carteles, diseño publicitario, etc...

Además os tengo una sorpresa... Pongo en marcha un nuevo servicio de realización de caricaturas digitales, llamado DIGIcaturas.

Son caricaturas digitales personalizadas ideales para imprimir en alta resolución y enmarcar para sobremesa o pared, regalos, invitaciones de boda, tarjetas, cumpleaños, felicitaciones, camisetas, etc... Por 26 euros

Envíanos tu foto y en menos de 48 horas tendrás tu caricatura. Sin esperas, sin gastos de envío... INFORMAROS PINCHANDO SOBRE EL BANNER

Además os he dejado en esta entrada anterior el primer diseño que hago de una plantilla para un Fotoblog. Con un diseño muy elegante y llamativo, y totalmente gratis.

Colocar gadgets en Blogger sin título

Como muchos de vosotros ya os habréis dado cuenta, Blogger obliga desde hace unos días a colocar título a todos los gadgets que se colocan o se modifican en nuestros blogs. Esto me parece una verdadera barbaridad, y ya han anunciado que van a corregirlo y dejarlo como estaba antes, es decir, que colocábamos título al gadget que lo necesitaba solamente, sin tener obligación de colocárselo a todos.

Pero para los impacientes que necesiten corregirlo lo antes posible, deciros que existe una buena solución, y es colocar como título este código <h2></h2>

Con ello conseguiremos poder colocar gadgets sin título. Haced la prueba, veréis como funciona a las mil maravillas.

Editado 2/07/2010: Os informo que Blogger ha cumplido lo prometido, y ha eliminado esa absurda obligación de colocar título a todos los gadgets que se colocan en los blogs. Por lo tanto, esta entrada no tiene ya mucho sentido.

Paginación para Blogger (Lo que tenemos hasta el momento)

Ya muchos sabéis lo que es la paginación en un blog, para los que aún no la conocéis o no sabéis que se denomina con ese nombre, deciros que es un sistema por el que las entradas de nuestro blog se agrupan en páginas y puede pasarse de una página a otra mediante artilugios parecidos a estos: (situados en la parte inferior del blog)

Se ve mucho en blogs de otras plataformas y en algunos de Blogger.

Hace ya bastante tiempo publiqué este post donde os comentaba la aparición de un script que conseguía esto en los blogs de Blogger. Pero al poco tiempo tuve que publicar este otro post, donde os informaba que ese script funcionaba solo regular, que no funcionaba al 100% y que presentaba algunos errores, por lo que no recomendaba su instalación en vuestros blogs.

Pues bien, ya ha pasado tiempo, y han aparecido varias formas más de insertar la paginación en los blogs de Blogger, así que con esta entrada quiero informaros de los diferentes métodos que han ido apareciendo, con mayor o menor eficacia. Os enlazaré desde aquí a las distintas entradas de los autores o de páginas de ayuda donde están bien explicados, y os haré mis apreciaciones sobre cada uno:

Leer completo...[+/-]

Script de TechieBlogger: Este es el método explicado en el post que ya publiqué, y que aclaraba en este post. Así que os remito a ese post para que leáis sobre él. Yo ya avisé en su día que no funcionaba bien, que producía saltos en las entradas, y había entradas que no aparecían nunca.
Sin embargo, había personas que comentaban que sí les funcionaba.

Método de PizcosBlog: Este método es explicado en este post de Pizcos. No lo recomiendo para principiantes, es algo complicado de instalar, y muy difícil o imposible de cambiarle el aspecto. No usa script externo, lo cual es un punto a su favor, pero parece no funcionar bien en páginas individuales y de etiquetas.
Decir que Pizcos lo usaba en su blog y dejó de hacerlo. Juzgad ustedes mismos.

Script de Blogger Plugins: Este método nos lo explica muy bien nuestra amiga Gema en esta entrada de su blog. Usa script externo, cosa que no me gusta, pero para los más "manitas" en esto, siempre existe la posibilidad de alojar el script en una cuenta vuestra o incluso tratar de meter ese script en la propia plantilla.
Introducirlo en la plantilla no resulta excesivamente complicado y puede personalizarse totalmente a vuestro gusto. Pero además tiene una opción para principiantes que te permite instalarlo en tu plantilla con solo pulsar un botón, aunque entonces no puede personalizarse.
Parece funcionar muy bien, salvo que en páginas individuales y de etiquetas no funciona. De momento, creo que es lo mejor que tenemos para nuestros blogs. EDITADO: En alguna ocasión he comprobado que aparecen saltos en las entradas, habiendo algunas entradas que no aparecen nunca.

Quiero advertir en relación a este último método, que cada vez que lo he instalado por el método fácil, es decir, pinchando sobre el botón que hay en el blog del autor, se me ha quedado bloqueado un tiempo la sección "Diseño/Elementos de la página", no pudiendo añadir gadgets ni apareciendo los que ya tenía durante algunos minutos. Pasado ese tiempo todo ha vuelto a la normalidad y la paginación estaba funcionando.
También tened en cuenta que la paginación no se ve en "Vista Previa" en la mayoría de los casos.

Con esta entrada he pretendido daros una idea global de los métodos de que disponemos por el momento para instalar la paginación en Blogger, solo me baso en mi experiencia y en comentarios de otros usuarios. He encontrado algún otro método, pero que parece no funcionar, o al menos no igual que estos.

Si alguien puede aportar algo más sobre este tema, que deje un comentario para que podamos conocer su opinión o su experiencia con estos u otros métodos.

Nuevo SERVICIO INTEGRAL de Blogsmadeinspain

Queréis cambiar la plantilla de vuestro blog y no os atrevéis por desconocimiento del lenguaje html o por falta de tiempo. Pues Blogsmadeinspain os hace el cambio de plantilla a vuestro blog, dejándolo listo para publicar las entradas y colocar todos los gadgets que queráis... Y solo por 10 Euros.
Algunas personas a las que les he diseñado plantillas exclusivas, y pese a mandarles una instrucciones muy detalladas de cómo realizar la instalación de la nueva plantilla, han preferido pagarme algo más para que se la dejase totalmente instalada y funcionando al 100% en su blog. Ahora extiendo este SERVICIO INTEGRAL a cualquier persona que por no manejarse bien con los códigos html o por falta de tiempo, prefieran pagar esta cantidad tan pequeña y desentenderse totalmente de preocupaciones y de sucesos inesperados. Aunque no sea una plantilla exclusiva, sino una de mis plantillas gratuitas.
Si os interesa, mandarme un e-mail explicando lo que queréis.

Como sabéis, Blogsmadeinspain os diseña una plantilla exclusiva y totalmente a vuestro gusto por 38 euros. Y ahora además os la deja totalmente instalada y funcionando en vuestro blog, solo por 10 Euros más.
De todas formas, no preocuparos por que deje de atender las dudas que me planteáis por e-mail. Seguiré respondiendo a todo el que me pregunta con la mayor disposición, aunque siempre dentro de lo que mis conocimientos me permiten.

Aprovecho para daros las gracias a todos por vuestros comentarios y vuestras visitas a mi blog. Sin ustedes este blog no podría existir. También agradecer profundamente a todas las personas que han confiado en mí para que les diseñe una plantilla personal y exclusiva.
¡MUCHAS GRACIAS!

Vista de compatibilidad en Internet Explorer 8

A todos los que uséis la versión 8 de Internet Explorer os interesa seguir leyendo.

Cada vez somos más los que usamos la versión 8 de Internet Explorer, y no todos saben que esta versión ya se ha diseñado de manera que cumpla los estándares por defecto (más o menos), un tema que había sido muy criticado en versiones anteriores de este navegador. Esto implica que sitios web que habían sido diseñados para versiones anteriores es posible que no se vean correctamente, pueden surgir desplazamientos extraños de algunos elementos, o códigos javascript que no funcionen bien, entre otras cosas.

Pero eso tiene una fácil solución con IE8, solo tenéis que pinchar sobre el botón de "Vista de compatibilidad" que existe en la barra de navegación, junto al de "Actualizar" y "Detener". Lo he marcado de color rojo en la captura de pantalla siguiente:

Pinchando sobre ese botón se activa la "Vista de Compatibilidad", y esto hace que el sitio que estemos visitando se vea como en IE7, por lo que desaparecen los errores que he explicado antes. Además, se os quedará guardado la activación de esta opción para el dominio donde lo hayáis activado, y no tendréis que repetir esto cada vez que entráis en un mismo sitio.

En Blogsmadeinspain uno de los errores que generaba esto es que no funcionaban correctamente los botones de colores que hay en la parte superior de la sidebar derecha, con los distintos temas. Así que ya sabéis, si usáis IE8 y notáis cosas raras al entrar en algún sitio web, solo tenéis que activar esta opción y problema resuelto.

Modificar el gadget de búsqueda de Blogger

Desde que Blogger publicó el gadget "Cuadro de búsqueda", sois muchos los que me habéis preguntado cómo podía modificarse, darle un estilo más atractivo y personal. En definitiva, adaptarlo más al diseño de vuestro blog.

Aunque este gadget presenta algunos parámetros de configuración, todos son referidos a la búsqueda y no a la imagen o diseño del mismo. Pues bien, aquí os voy a explicar como añadiendo unos sencillos códigos en vuestra plantilla, podréis modificarlo y adaptarlo a vuestro gusto.

El aspecto que este gadget presenta es este:

Y así podéis verlo en la sidebar izquierda de Blogsmadeinspain:

Yo he personalizado totalmente el botón, el color y tamaño de texto, y lo más importante, he quitado la publicidad de Google. Si queréis personalizar este útil gadget de Blogger, a continuación explico cómo hacerlo.

Leer completo...[+/-]

Lo primero, y para los que no lo habéis usado nunca, decir que para instalarlo en vuestro blog (normalmente en una sidebar) tenéis que entrar en "Diseño/Elementos de la página", pinchar sobre "Añadir un gadget" en la posición que vayáis a colocarlo, y dentro del cuadro de opciones que os sale elegir "Cuadro de búsqueda" (como en la siguiente imagen):

Veamos ahora por partes todo lo que podemos editar y modificar:

Eliminar la publicidad inferior de Google:

Localizar en la edición html de vuestra plantilla el código ]]></b:skin> y pegar justo arriba de él, estos códigos:

.gsc-branding-text {display:none;}
.gsc-branding-img-noclear {display:none;}

Solo con hacer esto, habrá desaparecido la frase de publicidad de Google.

Personalizar el botón de "Buscar":

En el mismo lugar que antes, pegar este código:

input.gsc-search-button {
color: #ffffff;
height: 31px;
font-weight:bold;
font-size: 14px;
background: #cc0000;
border: 1px solid #000000;
}

Con color: definimos el color de texto de la palabra "Buscar".

Con height: el alto en píxeles del botón. También podríamos incluir width: 30px; para expresar la anchura del botón, aunque por defecto se adapta al tamaño de texto elegido.

Con font-weight: podemos fijar si queremos el texto en "negrita" (bold) o normal (normal)

En font-size: definimos el tamaño de la letra en píxeles.

En background: colocamos el color de fondo que queremos para nuestro botón, con el código hex correspondiente. En el caso de mi blog, yo he colocado una imagen hecha por mí, en vez de un color de fondo. Para hacer esto sustituir ese renglón completo por ...

background: url('URL COMPLETA DE LA IMAGEN') no-repeat;

Y por último en border: definimos el borde que tendrá nuestro botón. Primeramente el ancho en píxeles, después el formato de línea(solid - línea continua, dotted - línea de puntos, etc...), y al final el código hex del color que queramos para el borde.

Si alguno de estos parámetros queremos que aparezca el que tiene por defecto Blogger, basta con borrar el renglón de código que corresponda.

Personalizar la caja de búsqueda:

La caja de búsqueda es el recuadro donde se escribe el texto que buscáis. Por defecto tiene el fondo de color blanco y las letras de color negro, pero esto puede cambiarse. Añadir en el mismo lugar que antes este código:

input.gsc-input {
color: #cc0000;
background: #e6e6e6;
}

En color: se define el código hex del color del texto que se está buscando, y en background: el del fondo de la caja de búsqueda.

Merece la pena hacer pruebas vosotros mismos, ya que este gadget es muy útil, está muy bien implementado y sus resultados se muestran de una forma clara, atractiva, y en la mayoría de los casos muy integrada con el aspecto general del blog.