Formularios de contacto en Magento

7.Octubre.2009 · 14 · Publicado por Sergio Baixauli en: Magento Etiquetas: , , ,
En una de nuestras últimas tiendas nos hemos encontrado con el problema de necesitar dos formularios de contacto diferentes al mismo tiempo. Uno para el contacto y otro para recoger información muy específica del usuario. Hasta la fecha, Magento no tiene una forma sencilla de resolver este problema. Hay gente que pasa del core de Magento e implementa una página en PHP para el envío del segundo formulario. Es una opción... nosotros vamos a crear una nueva extensión para el envío de correos y además añadiremos campos personalizados. Una vez activado el envío de formularios desde el administrador, nuestra tienda dispondrá de una página de contacto para que nuestros clientes se pongan en contacto con nosotros. Si no habéis tocado nada, dicho formulario lo podemos encontrar en www.mitienda.com/contacts

Para el segundo formulario vamos a necesitar la siguiente estructura de ficheros: Este artículo se basa en uno que encontré en francés en esta página.

* app/code/local/Magentix/Brochure/controllers/IndexController.php * app/code/local/Magentix/Brochure/Helper/Data.php * app/code/local/Magentix/Brochure/etc/config.xml * app/code/local/Magentix/Brochure/etc/system.xml * app/design/frontend/default/default/layout/brochure.xml * app/design/frontend/default/default/template/brochure/form.phtml * app/locale/es_ES/Magentix_Brochure.csv * app/locale/es_ES/template/email/brochure_form.html * app/etc/modules/Magentix_Brochure.xml

Respetando su nomenclatura original, el módulo se llamará Brochure y Magentix será su contenedor. Es una buena forma de organizar nuestras extensiones. Lo primero, el contenido de los ficheros. Este en concreto es el nucleo del formulario. Se encarga de recoger los valores y enviarlos. Muestra mensajes con el resultado.
PLAIN TEXT
PHP:
  1. app/code/local/Magentix/Brochure/controllers/IndexController.php
  2.  
  3. <?php
  4.  
  5. class Magentix_Brochure_IndexController extends Mage_Core_Controller_Front_Action {
  6.  
  7.     const XML_PATH_EMAIL_RECIPIENT  = 'brochure/email/recipient_email';
  8.     const XML_PATH_EMAIL_SENDER     = 'brochure/email/sender_email_identity';
  9.     const XML_PATH_EMAIL_TEMPLATE   = 'brochure/email/email_template';
  10.     const XML_PATH_ENABLED          = 'brochure/brochure/enabled';
  11.  
  12.     public function preDispatch() {
  13.         parent::preDispatch();
  14.  
  15.         if( !Mage::getStoreConfigFlag(self::XML_PATH_ENABLED) ) {
  16.             $this->norouteAction();
  17.         }
  18.     }
  19.  
  20.     public function indexAction() {
  21.         $this->loadLayout();
  22.         $this->getLayout()->getBlock('brochureForm')->setFormAction( Mage::getUrl('*/*/post') );
  23.  
  24.         $this->_initLayoutMessages('customer/session');
  25.         $this->_initLayoutMessages('catalog/session');
  26.         $this->renderLayout();
  27.     }
  28.  
  29.     public function postAction() {
  30.         $post = $this->getRequest()->getPost();
  31.         if ($post) {
  32.             $translate = Mage::getSingleton('core/translate');
  33.             /* @var $translate Mage_Core_Model_Translate */
  34.             $translate->setTranslateInline(false);
  35.                        
  36.             try {
  37.                 $postObject = new Varien_Object();
  38.                 $postObject->setData($post);
  39.  
  40.                 $error = false;
  41.  
  42.                 if (!Zend_Validate::is(trim($post['name']) , 'NotEmpty')) $error = true;
  43.                 if (!Zend_Validate::is(trim($post['address']) , 'NotEmpty')) $error = true;
  44.  
  45.                 if ($error) throw new Exception();
  46.  
  47.                 $mailTemplate = Mage::getModel('core/email_template');
  48.                 /* @var $mailTemplate Mage_Core_Model_Email_Template */
  49.                 $mailTemplate->setDesignConfig(array('area' => 'frontend'))
  50.                     /* L'adresse de réponse est ici l'adresse de l'expéditeur définie dans l'administration */
  51.                     ->setReplyTo(Mage::getStoreConfig(self::XML_PATH_EMAIL_SENDER))
  52.                     ->sendTransactional(
  53.                         Mage::getStoreConfig(self::XML_PATH_EMAIL_TEMPLATE),
  54.                         Mage::getStoreConfig(self::XML_PATH_EMAIL_SENDER),
  55.                         Mage::getStoreConfig(self::XML_PATH_EMAIL_RECIPIENT),
  56.                         null,
  57.                         array('data' => $postObject)
  58.                     );
  59.  
  60.                 if (!$mailTemplate->getSentSuccess()) {
  61.                     throw new Exception();
  62.                 }
  63.  
  64.                 $translate->setTranslateInline(true);
  65.  
  66.                 Mage::getSingleton('customer/session')->addSuccess(Mage::helper('brochure')->__('Your inquiry was submitted'));
  67.                                
  68.                 $this->_redirect('*/*/');
  69.  
  70.                 return;
  71.             } catch (Exception $e) {
  72.                 $translate->setTranslateInline(true);
  73.  
  74.                 Mage::getSingleton('customer/session')->addError(Mage::helper('brochure')->__('Unable to submit your request. Please, try again later'));
  75.                 $this->_redirect('*/*/');
  76.                 return;
  77.             }
  78.  
  79.         } else {
  80.             $this->_redirect('*/*/');
  81.         }
  82.     }
  83. }

Alguna función que nos pueda ayudar a la hora de autocompletar el formulario, como por ejemplo el nombre de usuario si estuviera logado.
PLAIN TEXT
PHP:
  1. app/code/local/Magentix/Brochure/Helper/Data.php
  2.  
  3. <?php
  4.  
  5. class Magentix_Brochure_Helper_Data extends Mage_Core_Helper_Abstract {
  6.     public function getUserName() {
  7.         if (!Mage::getSingleton('customer/session')->isLoggedIn()) return '';
  8.  
  9.         $customer = Mage::getSingleton('customer/session')->getCustomer();
  10.         return trim($customer->getLastname());
  11.     }
  12. }

Fichero de configuracion. La única parte que "podemos" tocar de aquí es la línea de "frontName". En el ejemplo pone brochure, lo que significa que si queremos acceder al formulario la url será http://www.mipagina.com/brochure Para cambiar esta url, cambiamos esto --> brochure por esto otro contacto2 y ya está
PLAIN TEXT
XML:
  1. app/code/local/Magentix/Brochure/etc/config.xml
  2.  
  3. <?xml version="1.0"?>
  4. <config>
  5.         <modules>
  6.                 <Magentix_Brochure>
  7.                         <version>1.0</version>
  8.                 </Magentix_Brochure>
  9.         </modules>
  10.         <frontend>
  11.                 <routers>
  12.                         <brochure>
  13.                                 <use>standard</use>
  14.                                 <args>
  15.                                         <module>Magentix_Brochure</module>
  16.                                         <frontName>brochure</frontName>
  17.                                 </args>
  18.                         </brochure>
  19.                 </routers>
  20.                 <translate>
  21.                         <modules>
  22.                                 <Magentix_Brochure>
  23.                                     <files>
  24.                                         <default>Magentix_Brochure.csv</default>
  25.                                     </files>
  26.                                 </Magentix_Brochure>
  27.                         </modules>
  28.                 </translate>
  29.                 <layout>
  30.                     <updates>
  31.                         <brochure>
  32.                             <file>brochure.xml</file>
  33.                         </brochure>
  34.                     </updates>
  35.                 </layout>
  36.         </frontend>
  37.         <global>
  38.                 <resources>
  39.                     <brochure_setup>
  40.                         <setup>
  41.                             <module>Mage_Brochure</module>
  42.                         </setup>
  43.                         <connection>
  44.                             <use>core_setup</use>
  45.                         </connection>
  46.                     </brochure_setup>
  47.                 </resources>
  48.                 <helpers>
  49.                     <brochure>
  50.                         <class>Magentix_Brochure_Helper</class>
  51.                     </brochure>
  52.                 </helpers>
  53.                 <template>
  54.                     <email>
  55.                         <brochure_email_email_template translate="label" module="brochure">
  56.                             <label>Brochure Form</label>
  57.                             <file>brochure_form.html</file>
  58.                             <type>text</type>
  59.                         </brochure_email_email_template>
  60.                     </email>
  61.                 </template>
  62.         </global>
  63.         <adminhtml>
  64.                 <translate>
  65.                     <modules>
  66.                         <Magentix_Brochure>
  67.                             <files>
  68.                                 <default>Magentix_Brochure.csv</default>
  69.                             </files>
  70.                         </Magentix_Brochure>
  71.                     </modules>
  72.                 </translate>
  73.                 <acl>
  74.                     <resources>
  75.                         <admin>
  76.                             <children>
  77.                                 <system>
  78.                                     <children>
  79.                                         <config>
  80.                                             <children>
  81.                                                 <brochure translate="title" module="brochure">
  82.                                                     <title>Brochure Section</title>
  83.                                                 </brochure>
  84.                                             </children>
  85.                                         </config>
  86.                                     </children>
  87.                                 </system>
  88.                             </children>
  89.                         </admin>
  90.                 </resources>
  91.                 </acl>
  92.         </adminhtml>
  93.         <default>
  94.                 <brochure>
  95.                     <brochure>
  96.                         <enabled>1</enabled>
  97.                     </brochure>
  98.                     <email>
  99.                         <recipient_email><![CDATA[hello@example.com]]></recipient_email>
  100.                         <sender_email_identity>custom2</sender_email_identity>
  101.                         <email_template>brochure_email_email_template</email_template>
  102.                     </email>
  103.                 </brochure>
  104.         </default>
  105. </config>

El fichero system.xml pinta la configuración de la extensión en el administrador. Adjunto una captura para que podáis relacionar los campos y ver como quedan después. form-contact
PLAIN TEXT
XML:
  1. app/code/local/Magentix/Brochure/etc/system.xml
  2.  
  3. <config>
  4.     <sections>
  5.         <brochure translate="label" module="brochure">
  6.             <label>Brochure</label>
  7.             <tab>general</tab>
  8.             <frontend_type>text</frontend_type>
  9.             <sort_order>101</sort_order>
  10.             <show_in_default>1</show_in_default>
  11.             <show_in_website>1</show_in_website>
  12.             <show_in_store>1</show_in_store>
  13.             <groups>
  14.                 <brochure translate="label">
  15.                     <label>Accept our brochure</label>
  16.                     <frontend_type>text</frontend_type>
  17.                     <sort_order>10</sort_order>
  18.                     <show_in_default>1</show_in_default>
  19.                     <show_in_website>1</show_in_website>
  20.                     <show_in_store>1</show_in_store>
  21.                     <fields>
  22.                         <enabled translate="label">
  23.                             <label>Enable Brochure</label>
  24.                             <frontend_type>select</frontend_type>
  25.                             <source_model>adminhtml/system_config_source_yesno</source_model>
  26.                             <sort_order>10</sort_order>
  27.                             <show_in_default>1</show_in_default>
  28.                             <show_in_website>1</show_in_website>
  29.                             <show_in_store>1</show_in_store>
  30.                         </enabled>
  31.                     </fields>
  32.                 </brochure>
  33.                 <email translate="label">
  34.                     <label>Email Options</label>
  35.                     <frontend_type>text</frontend_type>
  36.                     <sort_order>50</sort_order>
  37.                     <show_in_default>1</show_in_default>
  38.                     <show_in_website>1</show_in_website>
  39.                     <show_in_store>1</show_in_store>
  40.                     <fields>
  41.                         <recipient_email translate="label">
  42.                             <label>Send Emails To</label>
  43.                             <frontend_type>text</frontend_type>
  44.                             <sort_order>10</sort_order>
  45.                             <show_in_default>1</show_in_default>
  46.                             <show_in_website>1</show_in_website>
  47.                             <show_in_store>1</show_in_store>
  48.                         </recipient_email>
  49.                         <sender_email_identity translate="label">
  50.                             <label>Email Sender</label>
  51.                             <frontend_type>select</frontend_type>
  52.                             <source_model>adminhtml/system_config_source_email_identity</source_model>
  53.                             <sort_order>20</sort_order>
  54.                             <show_in_default>1</show_in_default>
  55.                             <show_in_website>1</show_in_website>
  56.                             <show_in_store>1</show_in_store>
  57.                         </sender_email_identity>
  58.                         <email_template translate="label">
  59.                             <label>Email Template</label>
  60.                             <frontend_type>select</frontend_type>
  61.                             <source_model>adminhtml/system_config_source_email_template</source_model>
  62.                             <sort_order>30</sort_order>
  63.                             <show_in_default>1</show_in_default>
  64.                             <show_in_website>1</show_in_website>
  65.                             <show_in_store>1</show_in_store>
  66.                         </email_template>
  67.                     </fields>
  68.                 </email>
  69.             </groups>
  70.         </brochure>
  71.     </sections>
  72. </config>

Ahora el estilo del formulario (1 columna, dos columnas, etc.)
PLAIN TEXT
XML:
  1. app/design/frontend/default/default/layout/brochure.xml
  2.  
  3. <?xml version="1.0"?>
  4. <layout version="0.1.0">
  5.         <default></default>
  6.         <brochure_index_index>
  7.                 <reference name="root">
  8.                         <action method="setTemplate"><template>page/2columns-right.phtml</template></action>
  9.                         <action method="setHeaderTitle" translate="title" module="brochure"><title>Brochure</title></action>
  10.                 </reference>
  11.                 <reference name="content">
  12.                         <block type="core/template" name="brochureForm" template="brochure/form.phtml"/>
  13.                 </reference>
  14.         </brochure_index_index>
  15. </layout>

Pintamos el formulario y añadimos / modificamos los campos a nuestro gusto...
PLAIN TEXT
PHP:
  1. app/design/frontend/default/default/template/brochure/form.phtml
  2.  
  3. <div id="messages_product_view"><?php echo $this->getMessagesBlock()->getGroupedHtml() ?></div>
  4.  
  5. <form action="<?php echo $this->getFormAction(); ?>" id="brochureForm" method="post">
  6.  
  7.    <div class="input-box">
  8.       <label for="name"><?php echo $this->__('Name') ?> <span class="required">*</span></label><br />
  9.       <input name="name" id="name" title="<?php echo $this->__('Name') ?>" value="<?php echo $this->htmlEscape(Mage::helper('brochure')->getUserName()) ?>" class="required-entry input-text" type="text" />
  10.    </div>
  11.  
  12.    <div class="input-box">
  13.       <label for="address"><?php echo $this->__('Address') ?> <span class="required">*</span></label><br />
  14.       <input name="address" id="address" title="<?php echo $this->__('Address') ?>" value="" class="required-entry input-text" type="text" />
  15.    </div>
  16.  
  17.    <div class="input-box">
  18.       <label for="telephone"><?php echo $this->__('Telephone') ?> </label><br />
  19.       <input name="telephone" id="telephone" title="<?php echo $this->__('Telephone') ?>" value="" class="input-text" type="text" />
  20.    </div>
  21.  
  22.     <div class="button-set">
  23.         <p class="required"><?php echo $this->__('* Required Fields') ?></p>
  24.         <button class="form-button" type="submit"><span><?php echo $this->__('Submit') ?></span></button>
  25.     </div>
  26. </form>
  27.  
  28. <script type="text/javascript">
  29.    var magazineForm = new VarienForm('brochureForm', true);
  30. </script>

Indicamos las traducciones para los campos de nuestro formulario. Si añadimos más hay que tocar este fichero
PLAIN TEXT
PHP:
  1. app/locale/es_ES/Magentix_Brochure.csv
  2.  
  3. "* Required Fields","* Champs obligatoires"
  4. "Submit","Envoyer"
  5. "Name","Nom"
  6. "Address","Adresse"
  7. "Telephone","Telephone"

El template para los campos del email. Esto es lo que recibirá el correo que configuremos. Lo mismo que con el anterior, si añadimos nuevos campos habrá que tocar también este fichero. OJO con este fichero, guardarlo en UTF-8!
PLAIN TEXT
PHP:
  1. app/locale/es_ES/template/email/brochure_form.html
  2.  
  3. <!--@subject Solicitud de info@-->
  4.  
  5. Nombre : {{var data.name}}
  6.  
  7. Dirección: {{var data.address}}
  8.  
  9. Teléfono: {{var data.telephone}}

Y por fín el último fichero
PLAIN TEXT
XML:
  1. app/etc/modules/Magentix_Brochure.xml
  2.  
  3. <?xml version="1.0"?>
  4. <layout version="0.1.0">
  5.         <default></default>
  6.         <brochure_index_index>
  7.                 <reference name="root">
  8.                         <action method="setTemplate"><template>page/2columns-right.phtml</template></action>
  9.                         <action method="setHeaderTitle" translate="title" module="brochure"><title>Brochure</title></action>
  10.                 </reference>
  11.                 <reference name="content">
  12.                         <block type="core/template" name="brochureForm" template="brochure/form.phtml"/>
  13.                 </reference>
  14.         </brochure_index_index>
  15. </layout>

Bueno, pues con esto, y todo ha ido bien, tendremos una nueva opción en nuestro administrador desde donde podremos configurar el envío de correos a través de un nuevo formulario.
Compartir:
  • Print
  • Facebook
  • Twitter
  • Meneame
  • Google Bookmarks
  • del.icio.us
  • Digg

PROYECTOS RELACIONADOS


COMENTARIOS

Gabriel #

20 de Noviembre de 2009 a las 16:24

¿Que tal? Hice todos los pasos pero no me sale la opcion en el administrador! Cual podria ser el error? Estoy trabajando con la version 1.3.2.4 de Magento. Gracias!!


Sergio Baixauli #

25 de Noviembre de 2009 a las 18:06

Hola Gabriel,
eso suele pasar cuando se lia con los permisos. Hay un truco muy sencillo para restablecer los permisos y que te de acceso al formulario que has creado.
Desde el administrador busca la opciónde “Permisos” -> “Usuarios”. Edita el que tienes (posiblemente será el administrador) y lo guardas sin hacer cambios.
Haz lo mismo con “Permisos” ->”Roles”.
Una vez hecho, cierra la sesión y vuelve a abrirla. Ahora ya deberías ver el nuevo menu.
Tampoco te vendría mal limpiar la caché desde el administrador.

Saludos


Domusprime #

7 de Diciembre de 2009 a las 17:43

Hola,

Hemos perdido mucho tiempo de agregar un campo en el formulario predefinico del Magento, queremos que aparte de los datos de correo se pueda integrar un campo RUT que un validador de identificación unica por un algoritmo predefinido, para españa DNI, hemos buscado pero no sabemos exactamente que archivos tocar del magento, se agradece cualquier ayuda.
Gracias.


Nacho #

17 de Diciembre de 2009 a las 12:53

Gracias Sergio. Ha sido un dolor de cabeza encontrar un buen método para crear un formulario personalizado. Este post es simplemente perfecto. Te lo agradezco de verdad


Sergio Baixauli #

18 de Diciembre de 2009 a las 18:23

De nada hombre. No haqy de que.
@Domusprime, lo siento, ahora vamos un poco liados lanzando un par de tiendas en magento. En cuanto pueda te ayudo con lo tuyo.
Saludos!


fviaplana #

19 de Diciembre de 2009 a las 13:10

Hola Sergio, segui todos los pasos y repase que estuvieran bien. Me pasa como Gabriel y también segui los pasos que le comentabas y nada. Sigo sin ver la opción en ‘Configuración’ en el Admin Panel y tampoco visualizo el formulario en http://www.midominio.com/web/index.php/brochure. Sabes que puede pasar? La versión de magento instalada es la 1.3.1. Gracias.


Sergio Baixauli #

29 de Diciembre de 2009 a las 15:53

Hola fviaplana,
si has comprobado que el código es correcto y has probado a restablecer los permisos tal y como explico en uno de mis comentarios no sé que más puede ser.
Yo tuve el mismo problema, pero cuando ocurren cosas de ese tipo suelen ser por cosa de permisos y/o caché.
Inténtalo de nuevo.
1.- Restablece los permisos del usuario con el que te conectas
2.- Cierra sesión
3.- Borra la caché

Espero que te sirva.

Saludos


Sadeuz #

23 de Marzo de 2010 a las 19:01

Hola, sigo tus pasos al pie de la letra, pero cuando actualizo la cahe me tira un error fatal y no me carga mas la pagina :S. Ando con la version 1.4


ciriglezglez #

24 de Marzo de 2010 a las 12:12

Hola fviaplana y Sergio

He notado que el contenido del fichero app/etc/modules/Magentix_Brochure.xml no es el correcto. Lo esperado es:

true
local

Esto puede hacer que no le este funcionando a fviaplana

A mi, de momento, me está casi funcionando. Recibo los correos, pero los recibo vacios, no se por que.

He tocado el fichero brochure_form.xml, pero lo unico que me está funcionando de ese fichero es el subject, preo no el contenido… ¿Alguna sugerencia?


ciriglezglez #

24 de Marzo de 2010 a las 12:15

vaya, mi comentario anterior ha sido modificado (supongo que por algun parseador interno) en la parte de codigo que he puesto. El tema es que hay que indicar en ese fichero Magentix_Brochure.xml que el modulo está activado.


Sergio Baixauli #

6 de Abril de 2010 a las 08:27

@Sauez, lo siento pero no he probado este módulo con esta versión de Magento (1.4). En cuanto lo hagamos te aviso.
@ciriglezglez, efectivamente, el Wordpress parsea los comentarios, pero queda claro el cambio. Has revisado el que el formato del fichero esté en UTF-8?

Saludos


ciriglezglez #

6 de Abril de 2010 a las 09:11

Sergio, gracias por los comentarios.
Acertaste con la solución al problema: formato UTF-8 para el fichero de template de correo.


Nacho #

22 de Abril de 2010 a las 22:19

Hola!
Ya me serví hace meses de este post para crear un formulario personalizado en magento (de hecho te felicité por ello).
Ahora necesito añadir otro formulario personalizado adicional… Lo estoy intentando pero no lo consigo…
Lo que he hecho es nombrar al módulo Brochure2 y al contenedor Magentix2… En todas las partes del código he sustituido “Brochure” por “Brochure2″ y “Magentix por Magentix2″… incluidos los nombres de archivo… Pensé que funcionaría, pero no.
En el Admin no me sale mi Brochure2… Por supuesto he intentado varias veces lo de “reiniciar” los permisos de usuario y limpiar la caché, pero sin éxito…
¿Se te ocurre qué puede estar saliendo mal?

En cualquier caso, muchas gracias!
Salu2


Feliu #

23 de Abril de 2010 a las 17:05

A mi me paso lo mismo, pero segui las instrucciones de la web en frances que Onestic referencia y hay algunas diferencias respecto a su post. Si sigues las de la web en fracés al pie de la letra te tiene que funcionar correctamente. Almenos yo me encontre con ese caso.


PARTICIPA EN LA CONVERSACIÓN

Introduce tu información personal o utiliza tu cuenta de twitter o facebook para acceder

   



TEMASPOPULARES

.NET android atributos caja de cantidad cakephp comandos contact form control de inventario control de stock css diseño drupal extensión fixed product taxes flash flash banner footer forms in magento formulario de contacto gestión de atributos how to impuestos imágenes j2me magento mail multiplerates métodos de envío módulo de pago newsletter openrealty paypal plugins productos configurables productos simples qty box shipping cost ssh tablerates tax rates tema wordpress tienda en magento wordpress zencart zoom

CATEGORÍAS


C\ Trafalgar 13
46930 Quart de Poblet - Valencia - España

  • (+34) 961 139 313
  • info@onestic.com
  • (+34) 963 023 041
  • (+34) 622 858 391

Encuentrános en GoogleMaps

HABLEMOS...

No dudes en ponerte en contacto con nosotros. Hablamos tranquilamente, te damos nuestra opinión sobre tu proyecto y decidimos cómo te podemos ayudar.

CONTACTO



SIGUÉNOSEN:

Logo RSS
Logo TwitterTwitter