Com configurar Contact Form 7 amb WP Mail SMTP a WordPress

Actualitzat el 2026-10-23 06:01:37 21 visites

Contact Form 7 és un plugin gratuït que et permet crear i gestionar formularis de Contacte per a WordPress.

info Perquè Contact Form 7 funcioni, és essencial tenir instal·lat i configurat el plugin WP Mail SMTP. Pots seguir la guia del següent manual Manual: Configurar el plugin per a l'enviament de correu (WP Mail SMTP) a WordPress.

Instal·lació del plugin

Primer, accedirem al WordPress i instal·larem el plugin Contact Form 7. Per a això, ens dirigirem a 'Plugins' -> 'Afegeix nou plugin':

Buscarem el plugin al cercador superior:

Un cop instal·lat, farem clic a activar:

Creació dels formularis

Per afegir o editar un formulari farem clic a la icona 'Contacte' i al botó 'Afegeix nou'.

Li posarem un nom al formulari i el guardarem:

La pàgina «Editar formulari de contacte» està dividida en quatre seccions.

Formulari – Personalitza la teva plantilla de formulari de contacte HTML amb una varietat d'opcions de camp com text, correu electrònic, caselles de selecció, etc. També pots escriure HTML personalitzat al quadre de personalització del formulari.
Correu electrònic – Personalitza la plantilla de correu electrònic i la configuració utilitzada per als correus electrònics de notificació.
Missatges – Personalitza els missatges que es mostren després d'accions específiques. Per exemple, pots configurar un missatge únic perquè es mostri després que algú enviï un formulari de contacte.
Ajusts addicionals – Especifica fragments per habilitar funcions addicionals com el mode només per a subscriptors, el mode de demostració o l'omissió de correu. També permet la creació de codi que s'ha d'executar abans o després d'accions específiques.

Pestaña Formulari

Pots utilitzar els diversos botons preestablerts per generar els codis abreviats de les etiquetes, d'entrada de dades, per a un formulari més utilitzat.

Text – Crea una etiqueta de formulari per a una sola línia de text. Els camps de text són útils per a noms, cognoms i altres recortes basats en text que no requereixin múltiples línies.
Correu electrònic – Crea una etiqueta de formulari per a una adreça de correu electrònic.
URL – Crea una etiqueta de formulari per a una URL.
Telèfon – Crea una etiqueta de formulari per a un número de telèfon.
Número – Crea una etiqueta de formulari per a un número. A diferència dels camps d'entrada de «text» o «àrea de text», els camps de «número» només permeten dígits numèrics.
Data – Crea una etiqueta de formulari per a una data.
Àrea de text – Crea una etiqueta de formulari per a una àrea de text. A diferència del camp d'entrada normal de «text», un camp d'«àrea de text» permet múltiples línies de text. Són ideals per introduir el cos del missatge.
Menú desplegable – Crea una etiqueta de formulari per a un menú desplegable.
Caselles de selecció – Crea una etiqueta de formulari per a caselles de selecció.
Botons de selecció – Crea una etiqueta de formulari per als botons de selecció.
Acceptació – Crea una etiqueta de formulari per a una casella de validació.
Qüestionari – Crea una etiqueta per crear un qüestionari de preguntes i respostes.
Arxiu – Crea un camp per a la pujada d'arxius.
Enviar – Crea una etiqueta de formulari per a un botó d'enviament.

Cadascun dels tipus d'entrada de dades ha d'estar entre etiquetes '''<label>''' y '''</label>'''. Per exemple:

<label> Títol
     [entrada_de_datos] </label>

El camp 'Títol' serà el títol/encapçalat que veurà l'usuari per sobre del camp d'entrada de dades.

El camp '[entrada_de_datos]' és el codi que ens proporcionen cadascuna de les etiquetes anteriors.

Per exemple, si volem afegir al nostre formulari un camp d'entrada de text, farem clic a 'text':

Ens aparirà una finestra amb les següents opcions de configuració (cada etiqueta té diferents opcions, pots revisar la guia de cada etiqueta):

Tipus de camp: Podem triar si és obligatori omplir el camp.
Nom: Aquest és el nom intern que disposem per identificar el camp a la configuració del formulari.
Valor per defecte: El valor que es mostrarà al camp si l'usuari no el canvia. Es mostra com un text i si l'usuari el vol modificar haurà d'eliminar-lo manualment.
Utilitzar el text com a marcador de posició del camp: El text que veurà l'usuari al camp si no es modifica. Es mostra com a text, però desapareixerà en fer clic al camp o en introduir un nou valor.
Aquest camp requereix el nom de l'autor: Aquesta etiqueta identifica un camp on l'usuari ha d'introduir el seu nom i serà processat pel sistema de filtratge Akismet (en cas de tenir-lo configurat) per determinar si les dades del formulari són Spam o no.
Atribut de ID: Li assigna un ID al camp. S'utilitza per assignar estils per mitjançant de codi CSS.
Atribut de classe: Li assigna una classe al camp. S'utilitza per assignar estils per mitjançant de codi CSS.

Un cop configurats els camps, farem clic a inserir:

Ens crearà l'entrada de dades que haurem de posar entre etiquetes '''<label>''' y '''</label>'''. Podem assignar-li un títol/encapçalat a l'etiqueta:

<label> Cognoms:
     [text* apellidos]</label>

Pestaña Correu Electrònic

En aquesta pestanya definirem la plantilla que s'utilitzarà a l'hora d'enviar el correu electrònic quan l'usuari faci clic al botó d'enviar.

Per defecte, s'envia el correu electrònic al compte de l'administrador de la web, des del compte [email protected].

L'assumpte és: 'Nom_del_sitio' + l'assumpte que hagi posat l'usuari al formulari.

En fer clic al botó respon, un cop ens arribi un correu, respondrem al compte que hagi introduït l'usuari. I el cos del missatge seran les dades que s'han introduït als diversos camps del formulari.

A la part superior ens apariran els noms dels camps del formulari per poder configurar la plantilla, són les variables que contindran els diversos valors/inputs que hagi introduït l'usuari.

Si tinguéssim camps on pujar arxius, ens apariran les etiquetes a l'apartat 'Arxius adjunts'.

info Haurèm de guardar els canvis fets al formulari perquè s'actualitzin les etiquetes

Per exemple, la següent configuració en aquesta pestanya, es rebrà amb el següent format:

Pestaña Missatges

Aquesta pestanya permet personalitzar els missatges que rep l'usuari segons l'estat del formulari: si s'ha enviat, si no s'ha pogut enviar, si hi ha hagut un error..:

Pestaña Ajusts Addicionals

Des d'aquesta pestanya, podem personalitzar funcions addicionals, com l'omissió de l'enviament de correu, el mode només subscriptors o l'execució de funcions personalitzades en moments concrets de l'execució del formulari.