89

Mensaje de bienvenida sobre las entradas

He recibido varias consultas últimamente en las que me solicitaban la forma de mostrar un mensaje de bienvenida en la página principal.

Vamos a crear sobre las entradas una nueva sección en la que colocaremos un gadget HTML donde incluiremos nuestro mensaje de bienvenida, que solo será visible en la página principal del blog y al que daremos un aspecto diferente al resto del blog.

[1] En nuestro panel vamos a "Edición HTML" y localizamos este código sin expandir las plantillas de artilugios":

<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Entradas del blog' type='Blog'/>
</b:section>

[2] Justo antes de ese código, colocamos el código para la nueva sección:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:section class='main' id='main-dos' showaddelement='yes'>
<b:widget id='HTML50' locked='false' title='' type='HTML'/>
</b:section>
</b:if>

[3] Guardamos los cambios.
Si ahora vamos a la parte de "Diseño" de nuestro panel, veremos la nueva sección sobre las entradas con el gadget HTML que hemos añadido:

Nueva Seccion

[4] Pinchamos entonces en "editar" del nuevo gadget y colocamos algo como esto en su interior:
<div class="mensaje">

<h2>¡Bienvenido!</h2>

<img src="http://img155.imageshack.us/img155/3627/34283694.jpg"/>
<p>Bienvenido a mi blog.</p>
<p>Espero que lo que veas aquí sea de tu agrado y pases un rato agradable.</p>

<p>¡Estás en tu casa!</p>

<p>Si quieres puedes suscribirte a mi <a href="http://feeds2.feedburner.com/blogspot/hnBy">feed</a> </p>

<p>Y si necesitas contactar conmigo, puedes enviarme un <a href="mailto:lejaniaimposible@hotmail.com">email</a></p>

</div>

[5] Guardamos cambios y vamos a comprobar como se ve nuestro mensaje de bienvenida:

Vista previa

[6] Vamos a usar algo de CSS para personalizar el diseño del mensaje.
Como podéis ver, el contenido del mensaje de bienvenida está incluido dentro de un <div> al que hemos añadido una clase (<div class="mensaje">), usando esa clase colocaremos en el CSS de nuestra plantilla (siempre antes de ]]></b:skin>) algo como esto:

.mensaje{background:#B7D3D9;padding: 10px;font-size: 14px;}
.mensaje h2{font-size: 22px; margin: 0 auto; color: #fff; font-weight: bold;text-align: center; }
.mensaje a{font-weight: bold; color:#fff;text-decoration:underline;}

Con esto le estamos diciendo al contenido de nuestro "mensaje" que muestre un fondo de color, una separación del contenido a los bordes y que el tamaño del texto sea de 14px:

.mensaje{background:#B7D3D9;padding: 10px;font-size: 14px;}

En el div hemos incluido el título del mensaje entre <h2> y </h2> para poder controlar su aspecto.
Le damos un tamaño de texto de 22px, establecemos un margen, un color para el texto y le indicamos que se vea centrado y en negrita:

.mensaje h2{font-size: 22px; margin: 0 auto; color: #fff; font-weight: bold;text-align: center; }

Añadimos también una línea de código que controle el aspecto de los enlaces a la vista.
Serán de color blanco y estarán en negrita, mostrándose además subrayados:

.mensaje a{font-weight: bold; color:#fff;text-decoration:underline;}

[7] Guardamos los cambios en la plantilla y comprobamos el aspecto que va cobrando nuestro mensaje.

Mensaje configurado

[8] Podríamos añadir una imagen dentro del div para que su diseño quedase aún mas llamativo, incluso podríamos usar esa imagen como enlace.

Editamos de nuevo el gadget y colocamos la url de la imagen después de su título:
<div class="mensaje">

<h2>¡Bienvenido!</h2>
<img src="http://img155.imageshack.us/img155/3627/34283694.jpg"/>
<p>Bienvenido a mi blog.</p>
<p>Espero que lo que veas aquí sea de tu agrado y pases un rato agradable.</p>

<p>¡Estás en tu casa!</p>

<p>Si quieres puedes suscribirte a mi <a href="http://feeds2.feedburner.com/blogspot/hnBy">feed</a> </p>

<p>Y si necesitas contactar conmigo, puedes enviarme un <a href="mailto:lejaniaimposible@hotmail.com">email</a></p>

</div>

[9] Ya solo nos quedaría añadir, justo a continuación del código CSS que antes colocamos en la plantilla, una línea más de código para controlar la posición de la imagen y añadirle un borde con una ligera separación de este a la imagen:

.mensaje img{float: right;border: 1px solid #fff;padding: 2px;}

Resultado final

Entradas Relacionadas:

89 comentarios:


Themasteralex

hola de nuevo rosa,

gracias por este tutorial muy bueno.

ya lo utilise y quedo muy bien.

Ahora quiero contactar contigo te tengo una propuesta mi emails son :

alex_themaster_07@hotmail.com

o tambien

gatosruiz@gmail.com

gracias por todo Rosa.

Saludos

LILY

hola Rosa! Sigo siempre tu blog y aprendo muchas cosas gracias a tus enseñanzas por lo que te agradezco. Quisiera ver si podés ayudarme con esto, logré poner tal como lo indicás un mensaje de bienvenida antes de las entradas. La pegunta es cómo puedo quitar el link que aparece sobre la derecha de entrada directa a editar el post, no me gusta como queda al ser un mensaje fijo. Gracias de antemano. Te dejo un enlace de mi blog que está todavía en construcción
http://programamedios.blogspot.com/

LokoGB

Mil gracias Rosa, en mi invitacion colocare un enlace a esta entrada. :)

LokoGB

Rosa una pregunta fuera del tema, saber como puedo bloquear el clic derecho en el blog :S

Daniel Sanchez

Hola Rosa excelente post! ya lo probe en mi blog, pero kiero ir mas alla: Como puedo hacer para ke la imagen kede bajo el texto para ke se vea dentro, si visitas mi blog veras a lo ke me refiero, kiero ke lo escrito este dentro del cuadrito, se puede?

Daniel Sanchez

olvide mencionar ke mi blog es Soporte Empresarial
supongon ke es en el codigo:
.mensaje img{float: right;border: 1px solid #fff;padding: 2px;}
pero no sabria como, me puedes explicar?
Mil gracias de antemano!

pinon

Hola Rosa muchas gracias, por hacerlo tan fácil ;)

Christian

Hola, Rosa, ¿me puedes confirmar si recibiste mi último correo en el que te detallaba algunos problemas que tenía? Gracias y perdón por las molestias

Rosa

LILY ¿A qué te refieres exactamente?:o
Yo no veo nada donde dice....y si hablas de los iconos de edición (el lápiz o las barritas de herramientas) esos no los ven las visitas, solo los ves tu como administradora del blog y solo si estás logueada en Blogger, si no tampoco los ves...

Rosa

LokoGB En este comentario puedes ver como bloquear el ratón.

Rosa

Daniel Supongo que quieres decir que la imagen esté en el fondo del mensaje para que el texto quede sobre ella ¿no?
Entonces no coloques la imagen dentro del código ni esta línea:
.mensaje img{float: right;border: 1px solid #fff;padding: 2px;}

De eso te olvidas.
Y directamente pones la url de la imagen en la primera línea del CSS así:

.mensaje{background:#B7D3D9 url(AQUI LA URL DE LA IMAGEN)no-repeat;padding: 10px;font-size: 14px;}

Rosa

Christian Si, este si llegó ;)
Esta noche te envío respuesta.

TRECARUNGA

¡Hola Rosa! aun tratando de saber como quitar ese "punteado" de el enlace del footer (: se ve bueno este mensajito de bienvenida (; suerte Rosa, ¡adios!

Marian

mi pregunta es, ¿cuando pinchas en una entrada antigua, sale también este mensaje al inicio de la página tras cargar de nuevo el blog?. Gracias.

MALINA

Rosa yo utilizo desde hace mucho lo de poner un mensaje encima de las entradas para "avisos" pero lo hago simplemente creando un nuevo elemento html/javascript y arrastrandolo por encima de entradas del blog (lo admite en todas las plantillas), mi pregunta es si con tu metodo podemos hacer que solo se vea en la pagina principal y no en las individuales.

Σ=o) Pau

Malina.. se puede supongo si al agregarlo como elemento html sabiendo cual es el ID utilizas esto
http://elescaparatederosa.blogspot.com/2008/01/mostrar-un-widget-en-una-pgina.html

asi lo hago yo para que no pese la página principal :)

besos a ti y para Rosa en la ventana ^_^

Cristian

hola rosa ! me gusta esta "Bienvenida" y pienso en colocarlo en mi blog, pero quisiera agregarle un vinculo que cierre y abra el mensaje para que no moleste a los visitantes, un efecto como "ver más [+]", me entendés? cómo lo hago?

Cristian

PD: me gusta la nueva imagen en el header!!

Sisco

Genial, como siempre.
Un abrazo

Rosa

TRECARUNGA Pues es que estoy de consultas "hasta arriba" estos días y no lo he vuelto a mirar la verdad :$ En cuanto pueda lo hago.

Rosa

Marian NO, solo es visible en la página de inicio del blog.

Bonzu Pipinpadaloxicopolis III

¿Se podrá ocultar al recargar la página varias veces?

Rosa

MALINA Así es, solo es visible en la página principal. De todos modos también podrías hacer lo mismo con el gadget sobre las entradas, para que solo se vea en el home...el problema es que en algunas plantillas, el gadget aunque no esté ahí en las otras páginas si deja "un hueco" es decir, no se ve, pero ocupa un espacio, con la sección eso no pasa, al menos en las plantillas que he probado...

Rosa

Bonzu No, no se oculta recargando la página. Solo es visible en la página de inicio del blog, en las otras no se ve.

Rosa

Cristian Gracias por lo del header.
A mi me encantó cuando me la regalaron :D

Mira si te sirve esto:
http://elescaparatederosa.blogspot.com/2007/11/mostrar-y-ocultar.html

TRECARUNGA

Rosa no hay apuro, cuando puedas ;)

MALINA

genial entonces

LILY

hola Rosa, soy Lily, te consulté sobre como sacar los íconos de edición, gracias por tu respuesta, no me había dado cuenta de que no se veían en la web, cariños y gracias por todo! LILY

Daniel Sanchez

gracias por tu pronta respuesta, es exactamente eso lo ke kiero hacer, pero no me funciono, creo ke me equivoque en algo, quite la linea de la imagen del codigo del gadget, y borre la linea:

.mensaje img{float: right;border: 1px solid #fff;padding: 2px;}

y en el codigo de la plantilla agregue:

.mensaje{background:#B7D3D9 http://www.vivapostal.com/imagenes/comentarios/bienvenido/images/bienvenido_bn_7.gif no-repeat;padding: 10px;font-size: 14px;}

pero no me aparece, en donde me estare ekivocando? tenia ke dejar la palabra url y los () y dentro el url? supongo ke aki este el error, perdona ke te moleste de nuevo pero al dejarlo asi no aparece nada y si lo dejo como te copie la linea tampoco, me falta algun signo? poner comillas? o el =, espero tu respuesta, mil gracias...

Fabiana

¡Feliz día atrasado! Es que mi escaso tiempo libre (terminaron mis vacaciones, snif) se lo dedico al profe pizcos y sus ejercicios (¡voy a enloquecer con tanto código!), pero como soy porfiada sé que lo conseguiré... jojo.
Me encantó la cabecera, esta es más "ciber_docente Rosa", jiji. Un abrazo.

Gsar Flakita

Hola Rosa que tal??
pasaba para decirte que te he dejado un premio en mi blog, es que te lo mereces, trabajas mucho por toddos y esta es mi manera de agradecertelo...
Gracias por hacer siempre un espacio para todos y respodnder a la velocidad de la luz XD

Rosa

Daniel Ha de ir así:

.mensaje{background:#B7D3D9 url(http://www.vivapostal.com/imagenes/comentarios/bienvenido/images/bienvenido_bn_7.gif) no-repeat; padding: 10px;font-size: 14px;}

Rosa

Fabiana Gracias! Y sigue aplicándote con Pizcos, que al final verás el resultado :D

Jaime Trujillo Escobedo

Que bonito Rosa! la verdad es que muchas veces se necesitan este tipo de bienvenidas o avisos, es muy útil poder ponerlos de esta forma tan linda! :D Saludines ;)

Rosa

Jaime Siii, es lindo! Gracias por pasarte ;)

Portu

Hola Rosa. Me gusta mucho la idea de un mensaje de bienvenida en el blog, pero lo que no me gusta es que ocupe tanto espacio en la parte inicial del blog. ¿Se podría colocar alguna imagen (X) de forma que al pinchar en ella el mensaje de bienvenida desaparezca?

Mi comentario se debe principalmente a que me ha surgido un problema en mi blog , y como siempre que he tenido un problema he recurrido a ti y me lo has solucionado... aquí estoy.
En un apartado en el que tengo puesta una encuesta, no consigo que las letras de las respuestas aparezcan de color blanco (para que quede bien con el color general del blog) por ello, si visitas mi blog, verás que el fondo de la encuesta lo he coloreado de un color gris, que no queda muy bien, pero que con el que, al menos, puedo ver las respuestas. ¿Cómo puedo cambiar el color de las respuestas de la encuesta?

Gracias por adelantado. ^^

Rosa

Portu Podrías usar algo de este tipo:
http://elescaparatederosa.blogspot.com/2007/11/mostrar-y-ocultar.html

En cuanto a la encuesta, pueden hacersele algunos cambios,como color añadirle color de fondo y borde por ejemplo, pero no mucho más, ya que no hay acceso al código, es una iframe controlada directamente por Blogger y que se supone debería adaptarse al fondo de cada blog...pero no lo hace :(

Daniel Sanchez

gracias de nuevo por responder, pero sigo sin poderlo hacer funcionar, no se cual puede ser el error, o seria mejor ke suba la imagen a otro servidor? el caso es ke modificandola con tus instrucciones borrando el link del html del gadget y copiando esta linea:

.mensaje{background:#B7D3D9 url(http://www.vivapostal.com/imagenes/comentarios/bienvenido/images/bienvenido_bn_7.gif) no-repeat; padding: 10px;font-size: 14px;}

como me indicaste en el codigo css me aparece el texto y todo pero no aparece el background, te copio todo el codigo por si me ekivoke en algun lugar, disculpa en verdad tantas molestias,

.mensaje{background:#B7D3D9 url(http://www.vivapostal.com/imagenes/comentarios/bienvenido/images/bienvenido_bn_7.gif) no-repeat; padding: 10px;font-size: 14px;}
.mensaje{background:#B7D3D9;padding: 10px;font-size: 12px;}
.mensaje h2{font-size: 22px; margin: 0 auto; color: #fff; font-weight: bold;text-align: center; }
.mensaje a{font-weight: bold; color:#fff;text-decoration:underline;}

todo esto antes de:

]]> skin

(kite parte del codigo porke no me deja postear mi coment si lo pongo textual, pero tu me entiendes)

pasate por mi blog y velo tu misma, no se donde esta mi error... mil gracias de nuevo,
Soporte Empresarial

crismatur

gracias por este tutorial:) soy nuevo en esto y la verdad es que me parece muy interesante y dificil me siento como ese niño que empieza a andar. un saludo

Poetas Anónimos

Hola Rosa, como estás, todavía feliz por la ayuda que me brindaste ayer,
lo que me trae hoy es preguntarte como hacer para poner por ejemplo los perfiles de los usuarios, las etiquetas etc etc, como tienes tu "recomendados", "archivos de blog" y blog de ayuda, osea dentro de una ventana con una barra lo cual hace que no se tornen muy largos en la sidebar.

¡Muchas gracias!

Rosa

Daniel Sanchez Fijate que has repetido dos veces .mensaje{ con distintas instrucciones...

La cosa sería así:

.mensaje{background: url(http://www.vivapostal.com/imagenes/comentarios/bienvenido/images/bienvenido_bn_7.gif) no-repeat; padding: 10px;font-size: 14px;}
.mensaje h2{font-size: 22px; margin: 0 auto; color: #fff; font-weight: bold;text-align: center; }
.mensaje a{font-weight: bold; color:#fff;text-decoration:underline;}

Daniel Sanchez

Perfecto! por fin funciono, lamento tanta molestia, por mas ke leia y leia el codigo no encontraba el error, y estaba en mi nariz, ;) ya funciono ahora solo es cosa de modificar el color de los links del fees y del email y formatear el texto para ke kede como kiero, pero ya funciona!

Te agradezco mucho en verdad tu blog es de gran ayuda.

Rosa

Poetas Mira en esta entrada:
http://elescaparatederosa.blogspot.com/2007/10/scrollbars-en-cualquier-parte-del-blog.html

Poetas Anónimos

Gracias Rosa, no me había dado cuenta que se llamaban scrollbars!

Ya lo implementé!! Buenisimo!

Shir

Hola Rosa quisiera saber donde le cambio el color al texto y al fondo en el mensaje de bienvenida

GRacias
:)

Céz

Hola Shir, si me permites ayudarte, en la sig linea del código:
.mensaje{background:#B7D3D9;padding: 10px;font-size: 14px;}
observa el valor de "background" y cambiale por otro de tu gusto

y la otra linea del código, puedes cambiar el valor de color de fuente

.mensaje h2{font-size: 22px; margin: 0 auto; color: #fff; font-weight: bold;text-align: center; }

Aquí te dejo un link para que busques el valor del color que quieres, pulsa el cuadrito de colores y selecciona un color y te aparecerá un valor para que insertes en Background y Color (la 2da linea del codigo). Suerte. :D

Céz

sorry, la dirección es www.colr.org.

Jejeje

PD. Saludos a Rosa.

Rosa

Céz Gracias por la ayuda. ;)

Carmen

¡Muchas gracias Rosa!. La bienvenida y algún que otro artilugio, están dejando mis blogs preciosos. También he puesto tu enlace. Gracias por tu ayuda. Besiños, Carmen.

Shir

Gracias Cesar ... intente cambiar el fondo del modo que me dijiste pero no sale :( quizas sea porque es una plantilla que baje de internet , :S
Gracias de todas maneras

Shir

Upss...quice decir gracias Céz...:)

Rosa

Shir Perdona, en realidad tampoco me fijé demasiado en la respuesta de Céz ;$

Los cambios se hacen en esta parte del código:
.mensaje{background:#B7D3D9;padding: 10px;font-size: 14px;}

El color de fondo lo cambias sustituyendo #B7D3D9 por el código del color que vayas a usar.
Para el color del texto, tienes que añadir antes de la llave final de ese código, algo así:
color: #dddddd;

Cambiando ese código por el del color que vayas a usar tu.

Cristianos on line

Rosa,mi nombre es Ana María soy periodista en el Uruguay, soy una seguidora de tiempo y gracias a ti pudimos hacer el blog de nuestra radio en internet, creo que sos fantastica, no solo en lo de los blogs sino como persona, por eso me atrevo a molestarte porque necesitaria urgente entablar comunicación contigo, no es sobre blog, es un tema muy importante en lo que tu podrias ayudarnos.
Te agradecería si me enviaras tu mail, para explicarte con más detalles.
Un saludo afectuoso desde Uruguay.
amkipreos@gmail.com

Rosa

Cristianos on line Te he enviado un email.

Grumpy

Gracias Rosa
Me lo llevo!
un saludo

Francisco Bórquez

Yo lo use para crear una página de inicio

Rosa

Francisco Un diseño fantástico el de Nerao ;)

Céz

Concuerdo con Rosa! Un blog tan cool! seguro que tienes 15 años, Francisco?

Rosa

Céz Je, je, ;)

WebMaster

La verdad que esta opcion para dar la bienvenida esta muy bien y es facil de implementar. Pero me encuentro con 2 problemas:

1º Tengo modificado el ancho de las entradas del blog y se me queda mas pequeño. No es gran problema pero si se puede ajustar mejor.

2º Uso una plantilla Rounders 3 y cambie las imagenes redondas por otras que me gustaron mas. Ahora el mensaje de Bienvenida me parte las imagenes y me deja ver el fondo. Eso si que no lo puedo dejar asi.

Imagino que tiene facil solucion, pero la desconozco. A ver si teneis idea de que podria modificar, gracias. Y para que se me entienda mejor dejo un par de capturas:

Bienvenida partiendo imagen.Vista correcta de entradas.Gracias por todo.

Rosa

WebMaster Las imágenes no se ven :(

La nueva sección tiene una id, exactamente main-dos usando esa id en el CSS:

#main-dos{
width: 300px;
}

Eso para controlar el ancho de la sección.
En cuanto a partir las imágenes, ya sería algo más complicado, tendrías que incluir la sección dentro de un div:
<div id='main-wrapper2'> </div> en lugar de dentro del main-wrapper

WebMaster

Rosa que raro que no veas las imágenes, están alojadas en picasa y el álbum es publico. Las he probado y las veo sin problemas desde varios ordenadores, además sin registrarme en picasa. Perdona pero no especifique que son enlaces, no intente poner las imágenes directamente. Las pondré de nuevo pero con enlaces a Imageshack,

Me puse a pensar en como arreglarlo y gracias a tu comentario sobre "main-dos" y revisando la plantilla, junto con algunas pruebas conseguí hacer algo. Voy por partes:

1º Vista correcta del blog antes de insertar el mensaje de bienvenida :: Ver Imagen Aquí ::
2º Error en el blog al insertar el mensaje de bienvenida. Solo falla cuando sale el mensaje, en el resto va perfecto :: Ver Imagen Aquí ::

Observe que tengo la siguiente línea CSS:

#main {
background:url("http://lh5.ggpht.com/_LpY7kEfaaPg/SE6Vk8hffEI/AAAAAAAAB74/qOugxhdHbZw/layout2.png") repeat-y $startSide;
padding:18px;
width:719px;
}

Y se me ocurrió, poner a continuación el "main-dos" pero modificado. Para que se pareciera al anterior añadí "background" y la "url" que me da el fondo que falta para rellenar, con un "with" idéntico de tamaño, mas un "paddind" que me movía la posición del mensaje, no la anchura para escribir mas largo. Al final justo después de #main puse lo siguiente:

#main-dos {
background:url("http://lh5.ggpht.com/_LpY7kEfaaPg/SE6Vk8hffEI/AAAAAAAAB74/qOugxhdHbZw/layout2.png") repeat-y $startSide;
padding:1px 118px ;
width: 719px;
}

El resultado fue el siguiente :: Ver Imagen Aquí :: y aunque no estaría mal darle algo mas de anchura al mensaje, tal y como queda si me puede servir, aunque todavía me queda probarlo en varios navegadores, sistemas operativos y personalizarlo.

Perdona por el ladrillo. Saludos y gracias por todo...

Dirección de las imágenes por si acaso puse mal los enlaces:
http://img411.imageshack.us/img411/8552/pantallazo1.gif
http://img411.imageshack.us/img411/2207/pantallazo2.gif
http://img66.imageshack.us/img66/8291/pantallazo3.gif

Rosa

WebMaster De ladrillo nada...me ha encantado leer como ibas haciendo paso a paso...enseguida "pillaste" la idea, aunque la mía era dejar la sección con el mensaje fuera de la imagen blanca, o sea, antes que las entradas no "dentro de"...pero si compruebas que anda bien en los distintos navegadores y demás, tu resultado está genial.

P.D. Hoy si veo las imágnes correctamente, ayer me salía una página de error.

WebMaster

Rosa el problema era que siguiendo las instrucciones que habias puesto, y usando una plantilla Rounders 3 de Blogger, el mensaje lo colocaba directamente dentro como ves en las imagenes, no fuera de la imagen blanca.

Pero si te digo la verdad me gusta mas dentro para mi plantilla que fuera. Un saludo...

Rosa

WebMaster Si, si, entendí todo a la primera ;)
Y si, como ya te dije en el otro comentario, el resultado ¡genial!

DELI

Hola Rosa! Siempre sigo tu blog y me es de gran ayuda, pero tengo una duda: como hago para cambiar la imagen de bienvenida?

Rosa

DELI Si hablas de cambiarla en el mensaje del ejemplo de esta entrada, tendrías que sustituir esta url en el código http://img155.imageshack.us/img155/3627/34283694.jpg Por la url de la imagen que vayas a poner.

DELI

Ahh. Muchisimas gracias Rosa.:D

Rosco

Hola Rosa!! Muy buena tu página!!
Utilizé este truco y me sirve aunque no me queda como me gustaría.echale un vistazo: http://omahaholdemhilo.blogspot.com/
Quiero saber si se puede hacer que el Titulo no quede como el de todos los widgets, sin el rectangulito gris..o ensancharlo de ser posible; y por otro lado quería separar los renglones como en el resto de los posts.gracias

Admin

Alguna idea Rosa? si me puedes decir que códigos tengo que cambiar o agregar te agradecería..gracias

Rosa

Rosco Que veo que también eres Admin...

El cuadrado te sale así porque todos los widget de tu blog tienen en mismo diseño, una solución rápida sería eliminar esto en el gadget:
<h2>¡Bienvenido!</h2>

Y colocar el Bienvenido en el título del gadget, quedaría muchísimo mejor y de acuerdo al diseño de tu blog.

Por cierto, porque preguntes dos veces no voy a ir más rápido, ya voy lo más rápido que puedo...

labitcoradetini

Pues yo soy un burro y no me aclaro me da miedo tocar la plntilla y fastidiarlo todo.... he leido Asturias por algun sitio??? Gracias por compartir vusetros conocimientos aunque yo sigo mirando algo que pueda copiar y pegar en el sidebar...Saludos!!

Flame Zero

rosa voy a intentarlo, pero sabes como puedo hacer para que el fondo del cuadro de bienvenida sea una imagen?

gracias .

david.

Rosa

Flame Zero Mira el comentario número 11

Fackss

que buena estaba esperando esto jeje
pero tengo dudas :$ como puedo borrar la linea que separa el mensaje de bienvenida con las demas entradas?
muchas gracias

Rosa

Fackss No vuelvas a preguntarme nada para tu blog mientras esté en privado... para ver como quitar eso tendría que ver el blog, así que no puedo contestarte.

Fackss

aaaaa disculpa pero ya saque el mensaje ya no vale la pregunta anterior
:P

Supernovas

Hola Rosa,
me parece genial esta idea de mensaje solo en la pagina pricipal. Gracias a ti tengo el blog a mi gusto y por ello agradecerte toda la ayuda que nos prestas. Respecto al tema que se trata aquí, veras, es que tengo dos preguntas:
1- ¿Es posible hacer lo mismo (que solo aparezca en la pagina pricipal) justo debajo de la cabecera, cogiendo todo el ancho?
2- ¿Se puede añadir un recuadro al texto?

Y para matizar te comento que tengo la plantilla ensanchada, el cuerpo de las entradas lo tengo en 500 px.
Muchas gracias de antemano!!!!!

Rosa

SUPERNOVASSolo tienes que arrastrar el gadget a debajo del header...
En cuanto al borde, colocar en el CSS algo así:
.mensaje { border: 2px solid #000;}
Cambiando el color del borde en #000

Supernovas

Muchas gracias por contestar tan rapido!!!!
Respecto a poner un borde ya está solucionado. Pero referente a poner el gadget justo debajo de la cabecera, encuentro el problema de que aparece en todas las paginas. En cambio, al ponerlo encima de las entradas, solo aparece en la pagina principal. Me imagino que no se podrá hacer. Muchas gracias!!!!

Rosa

SupernovasLo pongas donde lo pongas, lo que hace que solo sevea en la página principal es el código que lo envuelve, es decir, esta línea:
<b:if cond='data:blog.url == data:blog.homepageUrl'> y la de cierre </b:if>

Una vez colocado el gadget bajo la cabecera, localizas la línea que pertenece a ese gadget desde el html y la envuelves con este código.

Supernovas

Y como puedo localizarla?
Es que incluso le he puesto titulo para verlo en el codigo HTML de la plantilla, pero nada.

Rosa

SupernovasEs una línea más o menos como esta, y donde dice "title" estará el que tu hayas puesto:
<b:widget id='HTML2' locked='false' title='' type='HTML'/>


Como encontrar algo en la plantilla:
http://elescaparatederosa.blogspot.com/2007/09/encontrar-una-parte-de-codigo-en-la.html

Psic. Ananda Sannyasi S. Glez. Cruz (Asadharana Devi Dasi, discípula de S.S.Bhakti Tirtha Swami)

Hola, de antemano quiero agradecerte por compartir lo que sabes, me encantò la idea de poner un mensaje de bienvenida y seguì tus instrucciones, sòlo que al llegar a la parte de CSS no pude seguir pues no sè que es eso, o en que parte lo encuentro. Apenas estoy aprendiendo a esto del blog, ojalà pudieras explicarme como poner un fondo en la bienvenida. Gracias.

Rosa

Psic. AnandaEn el paso [6] de la entrada se dice donde colocarlo... revisa además en comentarios anteriores... siempre ayudan.

Kayomi

Hola Rosa, me decidí a poner un mensaje de bienvenida, pero me gustaría que el color de fondo del background se quede ajustado y pegado a la sidebar. Imagino que tiene que ver con el ancho y no sé si afectará a la imagen. Muchas gracias de antemano. Saludos Kayomi

Rosa

Kayomi El gadget toma la anchura del main... no puedes darle más o la sidebar se caerá a debajo de las entradas.

Kayomi

He probado con varias cosas y al final opto por quitarle el fondo de color al background, creo que así se queda mejor. El mensaje destaca más con el fondo pero queda poco estético con el hueco entre el main y la sidebar. Muchas gracias por tu ayuda una vez más. Saludos Rosa

manu6666

me costo un poco pero al fin llege a lo que queria lograr. muy bueno. gracias rosa
te dejo mi blog para que lo mires. xao cuidate

Contraseña:

www.peliculasenzonadirecta.blogspot.com

Publicar un comentario en la entrada

Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).

Los comentarios están siendo moderados.

:) :(( :( :P :D :$ ;) :I :X :O |O :S