Configuración:
.
Biología
.
Botánica
.
Tecnología
.
Sociedad
A mis trece años de edad, el día 2 de Diciembre de 2007 inicié ‘El Balcón de Jame’. Este humilde espacio, cuyo secreto siempre fue el de compartir sin recibir nada a cambio, me dio la oportunidad de conocer un mundo nuevo, un entorno en el que me sentía yo mismo.

Hoy, 17 de abril de 2011 finalizo esta etapa de mi vida con una gran sonrisa y junto al recuerdo que este blog y cada unos de vosotros me habéis concedido.

He sido bloggero.

Jaime Trujillo Escobedo.

Centrar las imágenes del gadget de imagen

Pués como el título dice, te voy a enseñar a centrar las imágenes que podemos añadir con el gadget de imagen que ofrece blogger...



Diseño>edición HTML>expandimos artilugios

Busca esta etiqueta:
]]></b:skin>
Justo encima pégale este bloque:
.Image {
text-align:center;
}
Ahora, cada vez que pongamos una imagen con el gadget de añadir imágenes de blogger, aparecerán centradas. ^_^

Laube dice...

Pues mi plantilla no tiene esa etiqueta, así que no puedo centrar las imágenes en los gadgets de imagen... buaaaaa

Jaime Trujillo Escobedo dice...

Laube, no te preocupes, puees pegarlo en cualquier parte del CSS, por ejemplo, debajo del bloque de .main .Blog ;-)

Laube dice...

Uyyyyyyyyyyyy, a mí esto que dices me suena si no a chino, a thailandés... jeje. Me cuesta muchho encontrar las etiquetas a pesar de que las busco con el buscador, pero la mayoría d elas veces, no están las etiquetas.

Jaime Trujillo Escobedo dice...

Laube, no te preocupes, ahora te lo explico mejor ;-)

Busca este bloque (es el primero de tu plantilla)

body {
background:#4c4c4c;
margin:0;
color:#215670;
font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}

Y pégale el de "centrar imagen" debajo :-D

.Image {
text-align:center;
}

Laube dice...

Vale, Jaime, lo he hecho, pero no veo que la imagen esté más centrada. A ver, yo lo veo más o menos igual... A lo mejor es que no lo distingo bien porque tengo más gadget html que de imagen... A saber!!!! Seguiré mirando a ver si es que he perdido la visión periférica... jeje

Laube dice...

Y se pueden centrar también los gadget html??????

Jaime Trujillo Escobedo dice...

Laube, puedes ver cómo está centrado mirando el lazo de luto de color rosa que tienes en la sidebar (esa imagen esta puesta con un gadget de imagen :D)

Claro que se puede centrar un gadget html, te dejo este post en donde lo explico con dos simples pasos :-D

Laube dice...

Eres un solete!!!!!!!! Gracias!!!!!! Ya ves... soy una novata muy preguntona!!!! Te agradezco mucho la paciencia.

Un besote!

Jaime Trujillo Escobedo dice...

Laube, jejejeje, no te preocupes por ser preguntona, eso es bueno y así se aprende :-D

¡Un saludete ☺!

Laube dice...

Bueno, ya tengo tu blog agregado, así que te seguiré dando la lata.

Un besote!!!!!!!!

Jaime Trujillo Escobedo dice...

Laube, gracias por agregarme :-) da la lata todo lo que necesites, así es como se aprende :-D

¡Saludines!

Laube dice...

Le he pasado tu blog a mi marido y también te ha enlazado.

Un besote!

Jaime Trujillo Escobedo dice...

¡Vaya, muchas gracias Laube! y ¿cómo es el blog de tu marido? :-D

Laube dice...

Pues es un blog de actualidad y de esos de todo un poco. Creo que ya te ha enlazado, supongo que lo verás.

http://marcllambias.blogspot.com/

Jaime Trujillo Escobedo dice...

Laube, parece interesante :-D ahora mismo me paso por su blog :)

Gio dice...

Hola, buscando info legué a tu blog, me permites una consulta?:

Mi blog tiene dos sidebar, una a la izquierda y la otra a la derecha, al aplicar el truco que indicas acá, ambas se ven afectadas, mi consulta es: Cómo hacer para que lo que coloco en la sidebar izquierda quede alineado a la izquierda, y lo que coloco en la sidebar derecha quede alineado a la derecha???

Gracias de antemano ;)

Jaime Trujillo Escobedo dice...

Gio, en ese caso debes añadir antes de la etiqueta ]]></b:skin> estos bloques:

#sidebar .Image {
text-align:left;
}

#newsidebar-wrapper .Image {
text-align:right;
}

Puedes ver el resultado en vista previa. ^_^

Gio dice...

Hola Jaime,
Muchísimas gracias por tu ayuda, ahora mi blog quedó justo como quería.
Gracias, hasta pronto
Gio

Jaime Trujillo Escobedo dice...

Gio, me alegra que tu blog quedase como querías ^_^

Si necesitas algo más por aquí estoy :-D

Laube dice...

Jaime, sigo teniendo un problema... Cuando expando artilugios, copio el código para centrar las imágenes (o cualquier otro código), hago la vista previa, veo que me gusta, e intento guardar la plantilla... NO HACE NADA. No me permite guardar la plantilla con el nuevo código. Al final, me pide salir o abandonar la página y, claro, así se pierden los cambios hechos.
Me lleva pasando una temporada. No sé lo que es...
Tienes idea de qué puede ser?
Gracias de antemano.
Laura

Jaime Trujillo Escobedo dice...

Laube, es muuuy extraño. Si recuerdo bien, creo que me pasó algo similar. Mi caso se debía a la conexión de Internet y al navegador (Usaba Internet Explorer).

Prueba a cambiar de navegador (Firefox no suele tener problemas, así como Ópera, Chrome o Safari).

Si te sigue sucediendo con otro navegador, procederemos a pensar otra solución ;).

Anónimo dice...

Gracias Jaime e podido centrar mi imagen Widget colocando lo que tu mencionas

.Image {
text-align:center;
}

Jaime Trujillo Escobedo dice...

Me alegro mucho, Anónimo. Supongo que eso favorecerá al diseño del blog.

laovaladita dice...

muchas gracias. quedo de lujo

Jaime Trujillo Escobedo dice...

¡Ya veo laovaladita!

marluito dice...

Gracias Funciono Perfectamente!!!

Jaime Trujillo Escobedo dice...

¡Me alegro mucho, Marluito!

Anónimo dice...

hola, disculpa, he intentado hacer lo que tu dices pero no encuentro ni la primera etiqueta que mencionas ni mi blog empieza con la etiqueta que le indicas a laube,

Mi blog empieza asi

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:version='2' class='v2'


Y no tengo idea de donde pegar el bloque .Image {
text-align:center;
}


porque no encuentro la que dices ]]></b:skin>

para que la imagen que tengo en el gadget de arriba quede centrada y no a la izquierda, me puedes ayudar por favor?

Jaime Trujillo Escobedo dice...

Anónimo, es debido a que tu plantilla pertenece a una de las nuevas plantillas de blogger.

Incluye esta línea en un gadget HTML-Javascript (en el apartado de Diseño>Elementos de la página>Añadir gadget) y obtendrás el resultado esperado:

<style>.Image {text-align:center;}</style>

Anónimo dice...

Disculpa, y donde añado la etiqueta <style>.Image {text-align:center;}</style> , ya tengo creado el gadget con la imagen dentro, tengo que pegarlo donde iria el link de la imagen, o crear un gadget nuevo solo con esa etiqueta...?? Estoy algo perdida. Muchas gracias. (soy el anonimo del comentario anterior, es que todavia no me apaño)

Jaime Trujillo Escobedo dice...

Anónimo, puedes incluir la línea en cualquier gadget html-javascript de tu barra lateral. Lo más acertado sería incluirla en el gadget que utilizas para la imagen (si es html-javascript) aunque también puedes utilizar un nuevo elemento de página (html-javascript).

Anónimo dice...

Perdon??? lo siento pero no entiendo nada... Lo que quiero es centrar la imagen del gadget que he creado justo debajo del encabezado (o titulo del blog) porque en la vista previa la imagen sale a la izquierda. Me podrías decir paso a paso lo que tengo que hacer para ello?? no sé donde ni en que momento pegar los codigos!! :( soy muy cenutrio y nueva en esto, lo siento.. muchas gracias!!!

Jaime Trujillo Escobedo dice...

Anónimo, con la dirección de tu blog podría ofrecerte la solución al problema. Envíame la URL de tu bitácora para que pueda ayudarte.

No te preocupes por ser nueva en blogger, ya verás lo rápido que se aprende y las maravillas que podemos implementar en nuestros sitios web.

¡Saludos!

Perfect7726 dice...

Gracias…
Si me funciono ;)
Saludos.

Jaime Trujillo Escobedo dice...

Pude comprobar el resultado al visitar tu sitio, Perfect7726. Muchas gracias por tu comentario.

Vicepresidencia de Asuntos Jurídicos de la ASOFIS dice...

Gracias por la publicación, me sirvio bastante ya que no sabia como centrar las imagenes... :)

Melina Yuros dice...

genio!! me ha servido mucho!!

Con algo de Estilo dice...

Muchas gracias.
Me ha funcionado a la primera.

Un saludo desde Bcn.

Maricela Balanzar Merchant dice...

gracias! :)

Escribe tu comentario en la entrada...

El Balcón de Jaime fue terminado el 17 de abril de 2011. Leer despedida.

Me gustaría conocer tu opinión. El comentario será moderado y en breve se publicará.

Si deseas incluir un enlace utiliza este código:

<a href="Dirección de tu página">Titulo del enlace</a>

Para publicar un código haz uso del Conversor de entidades.

Intenta escribir sobre algo relacionado con el artículo. Si no lo haces, podría tardar en responderte.

¿Problemas al comentar? Utiliza el formulario antiguo