miércoles, 28 de enero de 2015

Formulario de contacto en Blogger en página independiente

Para añadir un formulario de contacto a una página creada en Blogger que no sea la principal, hay que seguir los siguientes pasos.

Ir a Diseño, y en cualquier lugar, seleccionar Añadir un gadget

Seleccionar el gadget Formulario de contacto. Si no se encuentra, pulsar en la segunda opción, Más gadgets.

Una vez añadido, ir a Plantilla - Editar HTML.

Buscar el texto ContactForm. Pulsar sobre la flecha negra de la izquierda para desplegarlo, y se observará un código como el siguiente:
<b:widget id='ContactForm1' locked='false' title='Contacta' type='ContactForm'>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p/>
        <data:contactFormNameMsg/>
        BLA, BLA, BLA
        <p/>
        <div style='text-align: center; max-width: 222px; width: 100%'>
          <p class='contact-form-error-message' expr:id='data:widget.instanceId + &quot;_contact-form-error-message&quot;'/>
          <p class='contact-form-success-message' expr:id='data:widget.instanceId + &quot;_contact-form-success-message&quot;'/>
        </div>
      </form>
    </div>
  </div>
  <b:include name='quickedit'/>
</b:includable>
</b:widget>
Del código anterior, se debe eliminar todo excepto las dos primeras y las dos últimas líneas.

Ahora, ir a la página donde se desea añadir el formulario de contacto, y en la edición HTML incluir esto:
<div class='widget ContactForm' id='ContactForm1'>
  <div class='contact-form-widget'>
    <div class='form'>
      <form name='contact-form'>
        <p>Nombre<p>
        <input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value=''/>
        <p>Correo electrónico *</p>
        <input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value=''/>
        <p>Mensaje *</p>
        <textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
        <input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Enviar'/>
        <p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
        <p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
      </form>
    </div>
  </div>
</div>
Eso es todo.

0 comentarios :

Publicar un comentario

 

Copyright @ 2015 Tosblama