Bienvenido a VidaBlogger, un sitio dedicado a brindar Ayuda para Blogs.

Vas a poder encontrar trucos blogger, tutoriales y herramientas para blogs, aprenderás estrategias sobre SEO y posicionamiento web, y te daremos los mejores consejos para que lleves tu blog al máximo potencial!





25 abr. 2009

Crear un Mensaje de Bienvenida en el blog

Hoy vamos a ver uno de los trucos que me han pedido bastante por email. Se trata de colocar un Mensaje de Bienvenida al Blog, el cual aparecerá solamente en el Home, y al cual daremos un aspecto diferente del resto del blog para que resalte.

Es una forma de dar bienvenida a los usuarios y de recomendarles algunas cosas que creemos que le interesarán, a la vez de proporcionarles información breve acerca de los temas que trata el blog, o bien pueden usarlo para lo que crean necesario.

Para añadir el Mensaje de Bienvenida al blog debemos ir a la Edición HTML de la plantilla (Diseño --> Edición HTML) y buscamos el siguiente código:

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

y justo antes del mismo añadimos esta 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>

Guardamos los cambios y ahora nos dirigimos a Diseño, donde veremos que aparece un gadget HTML nuevo (que acabamos de añadir al agregar el código anterior) en la parte principal del blog, tal como muestra esta imagen:


Hacemos click en "Editar" ese gadget y pegamos el código del Mensaje de Bienvenida, el cual puede ser algo así como este:

<div class="mensaje">
<h2>¡Bienvenido!</h2>

<img
src="http://img155.imageshack.us/img155/3627/34283694.jpg"/>
<p>Bienvenido a mi blog: VidaBlogger - Ayuda para
Blogs</p>
<p>Espero que lo que veas aquí sea de tu
agrado y pases un buen momento con nosotros.</p>
<p>¡Estás en tu casa! Por lo cual
puedes leer y comentar lo que quieras.</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:TU-EMAIL@hotmail.com">email</a></p>

</div>


Con estos pasos ya tenemos un Mensaje de Bienvenida, podemos dejarlo tal como esta o bien darle un poco más de estilo para que quede más bonito. Para ello nos dirigimos a Diseño y buscamos ]]></b:skin> y justo antes de eso pegamos este código:


.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;}


Si queremos cambiarle el color de fondo debemos modificar donde dice background:#B7D3D9 por el número del color que quieras (para saber los colores visita este post Generador de Colores)

El resultado de todo lo que hemos hecho hasta aquí se verá de esta forma:


Como pueden ver, ese es un ejemplo de mensaje de bienvenida. Pueden escribir en él lo que quieran, lo mismo que cambiar la imagen que tiene de adorno (o sacarla si no quieren imágenes).

Para cambiar la imagen solo editamos la parte que dice:

<img
src="http://img155.imageshack.us/img155/3627/34283694.jpg"/>

por: <img src="URL-DE-TU-IMAGEN"/>


Espero que les sea de utilidad!

Si te ha gustado este post, no dudes en suscribirte al feed RSS de VidaBlogger!

8 comentarios :

  1. amigo estoy trabajando con tus consejos y todo salio de 10 la bienvenida 10, las estrellas 10 en los post , pero lo del chat todo bien pero no logro saber como habillitarlo me dice que esta bloqueado y en ese server no se como pedir explicaciones de habilitacion
    podes ayudarme mi mail es oscargordillo@fibertel.com.ar
    gracias oscar

    ResponderEliminar
  2. El dato esta bueno, pero personalmente me molestan los mensajes de bienvenida :(

    ResponderEliminar
  3. Gracias! te debo una :3
    muy bueno y sencillo de entender

    ResponderEliminar
  4. como modifico el tamaño de las fotos!?

    ResponderEliminar
  5. Es facil y sencillo de instalar, pero debajo del mensaje viene practicamente todos los articulos del blog ¿no?
    Saludos, me gusta tu blog.

    ResponderEliminar
  6. que buenos trucos , gracias por su ayuda pero me gustaria quitar el cuadro que dice aun no hay entradas podrian decirme como ? :(

    ResponderEliminar
  7. Hola super buen post. Exelente hee muy exelente. Pos muchos saludos..
    ATT: Car_Hack
    http://elcarhacker.blogspot.com/

    ResponderEliminar
  8. Hola, queria saber si es posible agregar una imagen detras de la bienvenida que escribi con la herramienta texto.

    Gracias por sua atencion, saludos!

    ResponderEliminar

Lea las reglas:

Todos los comentarios serán leídos y moderados previamente.

Serán publicados aquellos comentarios que respeten las siguientes reglas:
- Su comentario debe estar relacionado al contenido del post.
- No se aceptan comentarios tipo SPAM.
- No incluya links No necesarios en el contenido de su comentario.
- Si quieres dejar la url de tu blog, hazlo utilizando la opción OpenID.
- La caja de comentarios no es el lugar para pedir intercambio de links (para ello ve a la página de contacto).
- Ofensan personales, amenazas o insultos NO serán permitidos.

OBS: Los comentarios de los lectores no reflejan las opiniones del blog.