Codificación aprenderaprogramar.com: CU00453A
UN FORMULARIO DE CONTACTO CON NOSOTROS (ADMINISTRACIÓN WEB)
Joomla, a través del componente “Contactos” permite funcionalidades relacionadas con servicios de agenda y entre personas. No vamos ahora a hablar en profundidad de este componente, simplemente vamos a explicar una forma de generar un formulario para que los usuarios nos puedan enviar una sugerencia, comentario o petición.
Para esto hay distintas posibilidades (entre ellas usar extensiones específicas que permiten la creación y envío de formularios): ahora vamos sólo a hacer una primera aproximación usando el componente que Joomla incorpora por defecto.
Empecemos diciendo que el componente “Contactos” nos permite tener una agenda con datos de contactos. Los contactos se organizan en categorías, como ya hemos visto para otros elementos, de forma que un contacto necesariamente ha de estar incluido en una categoría, que no tiene nada que ver con las otras posibles categorías existentes (de artículos, de weblinks, etc.). Vamos a crear una categoría de contactos que somos las personas del staff de administración de la web, es decir, nosotros mismos. Vamos a Componentes --> Contactos --> Categorías. Pulsamos el botón “Nuevo” y ponemos un título (p.ej. aprenderaprogramar.com), asociamos si queremos una imagen y un texto de descripción (p.ej. Grupo de personas que forman el staff de aprenderaprogramar.com), y guardamos.
Pinchamos ahora en el link “Contactos”, o a través de Componentes --> Contactos --> Contactos y accedemos a la lista de contactos. Nos vamos a crear a nosotros mismos. Pulsamos “Nuevo” y rellenamos únicamente estos campos:
Nombre: p.ej. Atención al cliente aprenderaprogramar.com
Categoría: la que hayamos creado, en nuestro caso aprenderaprogramar.com
Correo (Usuario enlazado): según la versión de joomla que estemos usando, hemos de especificar el correo donde queremos recibir el texto que un usuario nos pueda enviar en un formulario, por ejemplo
URL Web (Detalles del contacto – Sitio web): si queremos consignamos una URL, p.ej. http://www.aprenderaprogramar.com
Información general (Otra información): un texto explicativo, por ejemplo “Puedes contactar con aprenderaprogramar.com para exponer tus dudas y sugerencias a través de este formulario.”
Imagen del contacto (Detalles del contacto – Imagen): tenemos opción a consignar una imagen y según la versión de joomla que estemos usando más datos adicionales (como cargo, dirección postal, teléfono, etc.).
En Opciones de visionado (parámetros del contacto) ponemos todo en “Ocultar” excepto Nombre, URL (página web), Información general e Imagen; si aparece un parámetro de configuración denominado Opciones del visionado – formato, elegimos la opción “Plano”. En “Formulario de contacto” (“Parámetro del e-mail”) ponemos activa la opción “Formulario e-mail” (Mostrar el formulario de contacto) y también activa “Copiar e-mail” (Enviar una copia al remitente). Como texto descriptivo podemos poner “Contacta con aprenderaprogramar.com” y guardamos.
¿Qué hemos hecho? Hemos definido un contacto, nosotros mismos, con un correo electrónico donde vamos a derivar los mensajes que a través de un formulario nos quieran hacer llegar los usuarios (por eso hemos activado la opción “Formulario e-mail” (Mostrar el formulario de contacto), que permite el envío de un correo electrónico vía web a través de un formulario sin que se muestre la dirección de mail que va a recibir el correo).
Ahora vamos a ver cómo podemos visualizar ese formulario de envío en el FrontEnd. Para ello nos vamos a valer de una vista del componente com_contact denominada “Presentación estándar de contacto”. Para acceder a esta vista tenemos dos opciones: a través de un link a la dirección correspondiente ó a través de un ítem de menú. Vamos a crear un ítem de menú y comentaremos cómo se haría con un link. Vamos al gestor de menús y creamos un nuevo menú al que denominaremos “Contactar”. Le ponemos un nombre y descripción (p.ej. “Contactar con aprenderaprogramar.com”).
En el gestor de menús pulsamos en el icono “Editar ítems del menú” o en “Elementos del menú” para añadir un ítem de menú al menú que hemos creado. Pulsamos “Nuevo” y seleccionamos como tipo de ítem Contactos --> Contacto --> Presentación estándar del contacto (Mostrar un solo contacto).
Escribimos un título, p.ej. “Contactar con aprenderaprogramar.com” y en Opciones obligatorias (Parámetros – Básico) seleccionamos el contacto que hayamos creado, en nuestro caso “Atención al cliente aprenderaprogramar.com” y guardamos.
Recordar que para visualizar un menú necesitaremos crear un módulo: creamos el módulo correspondiente al menú.
Finalmente en el gestor de módulos publicamos el módulo para que esté accesible desde el FrontEnd. Ahora en el FrontEnd, pinchamos sobre el ítem de menú correspondiente a “Contactar con aprenderaprogramar.com” y accedemos a la vista que hemos creado del componente com_contact.
Nos debe aparecer un formulario que nos pida nombre, dirección de e-mail, tema del mensaje (asunto) y que nos muestre un cuadro de texto para escribir el mensaje. Puede haber algunas variaciones según la versión de joomla y según la plantilla que estemos utilizando. El aspecto puede ser similar al que muestra la siguiente imagen.
Los campos a rellenar son en general obligatorios, aunque algunas versiones de joomla permiten que se deje algún campo sin rellenar. La opción “Enviar una copia de este mensaje a su propio e-mail” o “Envíame una copia” o similar permite que se envíe una copia del mensaje al propio usuario, que así “verifica” el envío adicionalmente.
Bien, después de rellenar el formulario pulsemos enviar a ver qué pasa. Si todo ha ido bien aparecerá un mensaje del tipo “Gracias por su correo”. Si estamos trabajando en local o ha habido algún problema es posible que no haya envío de correo y nos aparezca un mensaje de error como: “No es posible inicializar la función de correo”.
Si obtenemos un mensaje de error y no hay envío de correos, para entender por qué ocurre esto tendremos que atender a dos cuestiones:
a) La propia configuración de Joomla.
b) La configuración del servidor, que es al fin y al cabo el sistema desde donde se va a enviar el correo. El envío de correos desde un servidor local puede presentar problemas.
Vamos a tratar de solventar este problema si se te ha presentado, si no sigue más adelante. Vamos a ir al BackEnd a Sitio --> Configuración global --> Servidor. Fíjate en el cuadro “Configuración de correo electrónico”:
Lo que aquí figure va a tener relevancia en cómo gestione Joomla los correos electrónicos. La opción “PHP Mail” (“Función de correo PHP”) puede ser la más eficiente, pues es una simple función PHP que puede ir muy bien para envío de datos en formularios. No obstante, podemos tener problemas de configuración tanto en nuestro servidor local (WAMP ó XAMPP si es el caso) como en el servidor de nuestro proveedor de hosting, que es posible que tenga restringido el uso de esta función como medio de lucha contra correos basura. No vamos a abordar este asunto: piensa que cuando tengas tu sitio en un servidor tendrás que hacer pruebas y configurar / hablar con tu proveedor para conocer las posibilidades. Prueba a tratar de enviar el formulario con esta opción habilitada. En caso de que no te funcione, para no dejarlo aquí, que sería quedarnos con el mal sabor de boca de “esto no funciona”, vamos a ver cómo resolveríamos esto con un servidor SMTP. Nosotros podemos estar trabajando con nuestro servidor WAMP o XAMPP y por otro lado usar un servidor SMTP externo para el envío de correos. Esto no es lo más eficiente, porque equivale al envío de un correo convencional, pero para pruebas en local o si tenemos problemas con la función php y mientras no tengamos un volumen grande de usuarios puede valernos.
Vamos pues a escribir en el cuadro de Sitio --> Configuración global --> Servidor --> Configuración de correo unos datos como:
Programa de correo (gestor de correo): servidor SMTP
Dirección del remitente (correo del sitio):
Nombre del remitente (remitente): aprenderaprogramar.com (por ejemplo)
Ruta para sendmail: /usr/sbin/sendmail
Autenticación SMTP (seguridad SMTP): Sí (esto depende, si no te funciona prueba de otra forma; esta opción no aparece en todas las versiones joomla)
SMTP Security(seguridad SMTP): Nada o ninguna.
SMTP Port(Puerto SMTP): 25
Usuario SMTP: nombre del usuario para el correo
Servidor SMTP: dato de tu proveedor de correo, es del tipo “smtp.gmail.com” ó “mail.terra.es”, etc.
Con la configuración descrita (o pequeñas variantes), bien usando la función PHP o bien usando SMTP, llegaremos a poder enviar un formulario. En este caso, tras pulsar el botón enviar nos aparecerá algo como “Gracias por su e-mail”.
Como administradores web recibiremos un correo del tipo:
De: José Luis de la Serna [
Enviado el: jueves, 01 de octubre de 2009 18:28
Para:
Asunto: aprenderaprogramar.com: mi felicitación
Esta es una consulta de correo electrónico http://localhost/Joomla/ a través de: José Luis de la Serna <
Estimados amigos: querría felicitaros por vuestro artículo “El viento de la noche”, con el cual me he sentido muy identificado. También quiero puntualizaros que el viento de noche suele soplar de costa a tierra y no al revés. Felicitaros por vuestra página web, un saludo
José Luis de la Serna
Si el usuario ha seleccionado la opción de enviar una copia a su propio e-mail recibirá un correo del tipo:
|
Fecha: |
Thu, 1 Oct 2009 17:31:06 +0200 [17:31:06 CEST] |
|
De: |
aprenderaprogramar.com < |
|
Para: |
|
|
Asunto: |
Copia de: mi felicitación |
|
Copia de: José Luis de la Serna |
|
Si nos fijamos, el envío del correo lo realiza la dirección que tenemos especificada en la configuración global, mientras que lo recibe la dirección que hemos especificado como contacto. Sin embargo, para la administración web, aparece como remitente la dirección especificada por el usuario.
¿Evita el sistema las suplantaciones de identidad? Pues no, cualquiera puede enviar su formulario diciendo que es
En fin, todo esto puede mejorarse, pero hemos dado un primer paso. Como medida básica de seguridad tenemos la opción a instalar una extensión que requiera al usuario que introduzca una imagen deformada con letras y números (captcha). De otra manera, aparte de para enviar textos improcedentes, insultantes, degradantes, etc. puede ser usado para el envío automático de cientos de mensajes continuadamente hasta provocar en nuestro sistema un fallo de saturación (Denegación de servicio o Denial of service).
CONFIGURACIÓN DE CORREO CON UNA CUENTA DE GMAIL
Vamos a dar una orientación de cómo se configuraría el correo con una cuenta de gmail.
Programa de correo: servidor SMTP
Dirección del remitente:
Nombre del remitente: aprenderaprogramar.com (por ejemplo)
Ruta para sendmail: /usr/sbin/sendmail
Autenticación SMTP: Sí
SMTP Security:TLS
SMTP Port:465
Usuario SMTP: nombre del usuario para el correo, p. ej.
Contraseña: la que tengamos establecida en gmail.
Servidor SMTP: smtp.gmail.com
Las opciones de configuración en gmail las tienes, una vez accedes a la ventana principal en el link “Configuración”. Habilita ahí el correo pop.
ACCESO AL FORMULARIO DE ENVÍO SIN PASAR POR UN MENÚ
Vamos a comentar cómo podríamos acceder al formulario sin pasar por un menú, o mejor dicho, de momento aparentando que no pasamos por un menú. Para empezar, vamos a acceder a la configuración del ítem de menú que apunta al formulario de contacto. Si nos fijamos en “Enlace”, habrá una dirección del tipo index.php?option=com_contact&view=contact&id=1, que completa sería similar a alguna de estas:
http://localhost/Joomla/index.php?option=com_contact&view=contact&id=1
http://www.aprenderaprogramar.com/index.php?option=com_contact&view=contact&id=1
Por otro lado, si tenemos configurada la optimización SEO en Sitio --> Configuración global --> Sitio:
Cuando accedamos desde el FrontEnd al formulario, veremos una dirección distinta similar a: http://localhost/Joomla/contactar-con-aprenderaprogramarcom.html
Pues bien, para acceder al formulario desde cualquier punto basta establecer un link a cualquiera de estas direcciones en el punto que nosotros queramos. Seguidamente, procederemos a despublicar el módulo vinculado con el ítem de acceso al formulario de contacto (o el ítem de menú si así lo preferimos). De esta manera podemos acceder al formulario (yendo directamente a la URL de la vista del componente) sin tener que pasar por un menú. Lo que no podemos hacer es borrar el ítem de menú que apunta a la vista, ya que la vista está definida gracias a este ítem de menú y si lo borramos no podremos acceder al formulario.
En definitiva: podemos acceder a una vista directamente a través de un link o tecleando una url en nuestro navegador sin pasar por un item de menú en el frontEnd. Para ello es necesario que exista un item de menú que defina la dirección url a la que queremos acceder (aunque luego no haya ningún módulo o menú en el frontEnd que permita el acceso).
Ten en cuenta que el fin principal del componente Contactos sería disponer de un listado amplio de personas organizados en categorías. Por ejemplo, supón que vas a gestionar una asociación de guías turísticos y que los tipos de guías existentes son: “Guías de naturaleza”, “Guías de ciudad” y “Guías de monumentos”. A través de este componente podrías organizar los datos de contacto y fotografías de los guías en categorías, y luego mostrar la información de los guías en la página web, permitir que los usuarios de la web realicen búsquedas de un guía en base a un criterio (por ejemplo guías que se encuentren en una ciudad concreta) y si así se quiere, permitir que exista un formulario de contacto para cada guía. Los contactos no tienen por qué ser usuarios Joomla de nuestra página web. Nosotros en este ejemplo nos hemos limitado a crear un contacto para ver la posibilidad de envío de un formulario, pero la idea del componente Contactos de Joomla es mucho más amplia: poder disponer de listados de contactos organizados en categorías, poder mostrar distintas vistas de los contactos y permitir consultas, envío de formularios, etc.
Para hacer un comentario o consulta utiliza los foros aprenderaprogramar.com, abiertos a cualquier persona independientemente de su nivel de conocimiento.
