30 junio 2008

El nuevo formulario de Blogger (Colócalo - Personalízalo)

H

ace día en el Blog de Blogger in Draft ha integrado los comentarios en las entradas, esto quieres decir que vamos a poder comentar como lo hacemos en WordPress. Me entere primero por SpanLoco, parecía imposible ponerlo en blog, pero lo logre gracias a Amanda de Blogger Buster, digo imposible porque tenía algunos hack que me hacían imposible integrarme a esa nueva modalidad de comentario y ahora vemos como en el Escaparate de Rosa coloca como personalizarlo, de verdad es increíble.


¡Recuerda! "GUARDAR SIEMPRE UNA COPIA DE TU PLANTILLA EN TU PC
Veamos como hacerlo:



1. No vamos a Blogger en Borrador (Blogger in Draft), buscamos en panel la pestaña configuración entramos ahí y luego no iremos a comentarios. Y encontraremos la nueva opción Ubicación del formulario de comentarios y seleccionaremos (Entrada incrustada a continuación), observen las imágenes (Ver 1, Ver2).
2. Luego de eso verificamos en nuestro blog si en cualquiera de nuestra entrada podremos ver el formulario integrado (Ver imagen)

De no aparecer ya que nuestra plantilla tiene modificaciones tal como lo explica Rosa “El formulario será así de sencillo de implementar en los blogs de nueva creación o en los blogs que no hayan personalizado ciertos aspectos de la plantilla. Si hemos modificado estas partes del código de la plantilla como es mi caso, entonces seguramente aunque habilitemos la opción para mostrar el formulario, este no funcionará.

Pero Amanda en sus blog Blogger Buster nos explica con un sencillo procedimiento como implementarlo a las plantillas que son modificadas y que a pesar de que hayan hecho el procedimiento que expliqué anteriormente y no se les dio.
1. Tenemos que tener el procedimiento que explique anteriormente ya listo.
2. Ahora nos vamos a la plantilla en la Edición HTML y lo expandimos en artilugios.
Ahora buscamos lo siguiente:

<p class='comment-footer'> <b:if cond='data:post.allowComments'> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a> </p> </b:if>

Y lo sustituimos por este otro:

<p class='comment-footer'> <b:if cond='data:post.embedCommentForm'> <b:include data='post' name='comment-form'/> <b:else/> <b:if cond='data:post.allowComments'> <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a> </b:if> </b:if> </p></b:if>


Y ahora vamos a personalizarlo:
Localizamos los CSS o antes de ]]></b:skin> y agregaremos algo así:
- Para centrar el formulario:

 
 .comment-form { 
margin:0px auto; 
width:400px;
}
- Esto es para la modificación de titulo ósea este “Publicar un comentario en la entrada”.

.comment-form h3 {
background:transparent url(Url_de_la_imagen) no-repeat scroll left 50%; color:#6998CA;
font-size:19px;
line-height:35px;
}
 
Veamos como las explicaciones de Rosa:

Si no vamos a colocar un icono delante del título, eliminamos la línea: background:transparent url(Url_de_la_imagen) no-repeat scroll left 50%;

color:#6998CA; El color del texto.

font-size:19px; Tamaño del texto.

line-height:35px; Ancho de la línea del texto, si nuestro icono tiene un ancho de 35px, por ejemplo, tendremos que poner aquí su misma medida para que no se vea cortado.

Yo le agregaría padding:0px; ya que la imagen quedaba debajo de el texto, ustedes le colocaran el número que quieran.

- Este otro para el mensaje de los formularios, para el que lo tiene habilitado si quieres habilitado aquí

.comment-form p{
background-color:#EFEFF7;
color:#000;
border:1px solid #6998CA;
padding:10px;
width:375px;
}

Veamos como lo explica Rosa:

background-color:#EFEFF7; Color de fondo.

color:#000; Color del texto.

border:1px solid #6998CA; Grosor, color y aspecto del borde.

padding:10px; Distancia del texto al borde de la caja.

width:375px; Ancho de la caja.

Así de fácil y vean el resultado aquí

17 comentarios:

  1. Hola! te ha quedado fantastico. Yo lo he intentado siguiendo tus pasos pero no he podido porque mi html aparece diferente a las explicaciones.

    Esperare a que blogger lo implante de una vez por todas.

    Un abrazo!

    ResponderEliminar
  2. Me parece algo maravilloso lo que implementó Blogger draft, además sacó muchas aplicaciones buenas.
    Creo que con el tiempo será una competencia más fuerte para wordpress.
    Abrazos

    ResponderEliminar
  3. Hola Malina! A mi también me paso lo mismo lo que tuve que hacer es revisar la plantilla poco a poco y ir comparando códigos hasta que lo encontré y eso que lo había buscado con CTRL+F y no lo conseguía. Saludos!

    Hola Marisol! Fue maravilloso las novedades de Blogger in Draft... Yo creo que ya es la mejor plataforma de blogs... Saludos!

    ResponderEliminar
  4. No se porque a mi no me aparece la posibilidad de incrustar los comentarios!!!¡porqeu sucede esto?¿como puedo solucionarlo?
    Felicidades por el blog
    LIZ

    ResponderEliminar
  5. Gracias,con tu ayuda y la de rosa puede implementar este nueva modalidad...le agregué algunas improvisaciones y quedó lindo
    Gracias
    LIZ

    ResponderEliminar
  6. Hola Elizabetha! Que bueno que lo hayas implementado... La solución era seguir intentado porque yo tampoco lo podía colocar pero lo hice con todo la paciencia del mundo y lo logre… Saludos

    ResponderEliminar
  7. muy bien excelente

    ResponderEliminar
  8. This site certainly has all the info I wanted about this
    subject and didn't know who to ask.

    my web-site; zayn malik quotes

    ResponderEliminar
  9. A motivating discussion is worth comment.

    There's no doubt that that you need to write more about this subject matter, it might not be a taboo subject but generally people don't discuss these issues.
    To the next! Best wishes!!

    My weblog ... understanding quotes

    ResponderEliminar
  10. Let's think of words that sound dirty but really aren't.
    A bowler who can consistently pick up his spares can easily hold a 180 average
    without getting any strikes. People are now looking to
    be able to connect to things like their vehicles through their smart phones, and now Buick has announced the release of their
    new e - Assist Fuel Effeciency smartphone games.

    Here is my blog: 삭제

    ResponderEliminar
  11. Just make sure your box leaves the impression they have something wonderful waiting for them inside of it.
    ' Always use a sun protection lotion or a sunscreen when moving about in the sun. You'll never go
    back to wasting money on expensive, chemical-laden products again.



    Visit my blog post ... Beauty

    ResponderEliminar
  12. Note that the speaker uses the adjective 'tame'
    instead of 'wild'. Once, in the year 1938 a magnetic storm emerged in the Polar Regions and its terrific brilliance was seen right
    up to Africa and Crimea. This is easily fixed because below the plastic
    you find the regular screw holes which I used to install the PCI
    cards.

    My web blog :: Homepage des Autors besuchen

    ResponderEliminar
  13. With this final scene, Kingsolver reasserts the value of family-however nontraditional it may be-as an essential and even life-saving support system for this diverse group of characters,
    as well as for society in general. The person
    who initially wanted the real truth hidden has the most to lose but
    anyone who has knowingly assisted in hiding the truth and changing
    the story will also suffer to some extent. It’s not Gordon’s fault that he has had to work with a poor script
    that is far more interested in perpetuating
    the myth about Polar Bears and so called Global Warming I just wish the BBC would not be so biased on the subject and for once tell the truth.



    Feel free to visit my blog post ... fha home loan

    ResponderEliminar
  14. samsung galaxy s3
    is the latest version of Android, a whopping 4. Although
    the official announcement for Samsung Galaxy S3 handset will come in several months, every Android enthusiast is eager
    see the technical specifications of the Samsung's next flagship smartphone. _To present to three other people to join in the support.

    ResponderEliminar
  15. It is almost like starting from scratch without reformatting the Apple - TV.
    The built-in web browser of Google TV separates it from media streaming devices like apple tv.
    We've already delivered our verdict as to what can be expected from the i - TV (or whatever it is called) and the Cupertino-based company will also need to navigate carefully because studios already have Hulu.

    ResponderEliminar
  16. Both services offer extra storage space for small fees if you need more.
    The heat from the air moves into the cooled
    refrigerant. The devices must be hooked to a power source
    and be connected to WI-FI for it to automatically back up.

    My blog post ... nest learning thermostat

    ResponderEliminar
  17. Is it an advantage or disadvantage to save everything on the web.
    What you need and prefer in a computer will
    determine if you will be satisfied with Chromebook or another computer.
    With built-in Adobe Flash support and a great browser, my children
    have complete access to their documents, calendars, email, and entertainment.



    Feel free to visit my site: samsung chromebook

    ResponderEliminar

¡Gracias por comentarme! No modero los comentarios porque me parece tentar contra la libertad de expresión de cada individuo, por eso le pido que no hacer comentarios con palabras obscenas, si vas a comentar como Anónimo por favor coloca tu nombre o cualquier apodo. ¡Gracias!