Support » Plugin: Contact Form 7 » Use html code in the body message

  • Hi, if I use html code in the body message (Mail settings – I switch on the option “Use HTML content type”), when click the submit button, nothing happens.
    This is my message body code:

    <table width=”100%” border=”0″>
    <tr>
    <td height=”46″ colspan=”7″ align=”center” bgcolor=”#CCCCCC”><h2>Ficha de Inscrição</h2></td>
    </tr>
    <tr>
    <td width=”13%” height=”46″ align=”left” bgcolor=”#CCCCCC”>Acção</td>
    <td colspan=”6″>[Curso1]</td>
    </tr>
    <tr>
    <td align=”left” bgcolor=”#CCCCCC”>Data inicial</td>
    <td width=”10%”>[Dataini1]</td>
    <td width=”7%” align=”center” bgcolor=”#CCCCCC”>Data Final</td>
    <td width=”18%” bgcolor=”#FFFFFF”>[Datafim1]</td>
    <td width=”6%” align=”center” bgcolor=”#CCCCCC”>Local</td>
    <td width=”4%” align=”center” bgcolor=”#FFFFFF”>[Local1]</td>
    <td width=”42%” bgcolor=”#FFFFFF”> </td>
    </tr>
    <tr>
    <td height=”34″ bgcolor=”#CCCCCC”> </td>
    <td colspan=”6″> </td>
    </tr>
    <tr bgcolor=”#CCCCCC”>
    <td height=”36″ colspan=”7″ align=”center” bgcolor=”#CCCCCC”><h2>Dados do participante</h2></td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Nome</td>
    <td colspan=”6″>[your-name]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Email</td>
    <td colspan=”6″>[your-email]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Telefone fixo</td>
    <td>[telefone]</td>
    <td bgcolor=”#CCCCCC”>Telemóvel</td>
    <td colspan=”4″>[telemovel]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Habilitações</td>
    <td colspan=”6″>[habilit1]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Cargo</td>
    <td colspan=”6″>[cargo]</td>
    </tr>
    <tr>
    <td height=”40″ bgcolor=”#CCCCCC”>Acções frequentadas/ Experiencia</td>
    <td colspan=”6″>[experiencia]</td>
    </tr>
    <tr>
    <td height=”34″ bgcolor=”#CCCCCC”> </td>
    <td colspan=”6″> </td>
    </tr>
    <tr bgcolor=”#CCCCCC”>
    <td height=”36″ colspan=”7″ align=”center”><h2>Dados para facturação</h2></td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Nome Entidade</td>
    <td colspan=”6″>[entidade]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Morada</td>
    <td colspan=”6″>[morada]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Código postal</td>
    <td colspan=”3″>[codpostal]</td>
    <td bgcolor=”#CCCCCC”>NIF</td>
    <td colspan=”2″ bgcolor=”#FFFFFF”>[nif]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Nome interlocutor</td>
    <td colspan=”6″> [interlocutor1]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Email</td>
    <td colspan=”3″>[emailint1]</td>
    <td bgcolor=”#CCCCCC”>Telefone</td>
    <td colspan=”2″> [telfint1]</td>
    </tr>
    <tr>
    <td height=”34″ bgcolor=”#CCCCCC”> </td>
    <td colspan=”6″> </td>
    </tr>
    <tr bgcolor=”#CCCCCC”>
    <td height=”36″ colspan=”7″ align=”center”><h2>Dados para pagamento</h2></td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Tipo inscrição</td>
    <td colspan=”3″>[Tipo_insc1]</td>
    <td colspan=”2″ bgcolor=”#CCCCCC”>Nº participntes</td>
    <td bgcolor=”#FFFFFF”>[participantes1]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Valor Base (€)</td>
    <td colspan=”3″> [valor1]</td>
    <td colspan=”2″ bgcolor=”#CCCCCC”>Valor + Iva (€)</td>
    <td bgcolor=”#FFFFFF”>[valor2]</td>
    </tr>
    <tr>
    <td height=”42″ bgcolor=”#CCCCCC”><p>Nome Participantes</p></td>
    <td colspan=”6″>[partnome1]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Código beneficiário</td>
    <td colspan=”3″>[cod_parc1]</td>
    <td colspan=”2″ bgcolor=”#CCCCCC”>Data inscrição</td>
    <td bgcolor=”#FFFFFF”>[data_insc]</td>
    </tr>
    <tr>
    <td bgcolor=”#CCCCCC”>Aceito as condições</td>
    <td colspan=”6″>[concordo]</td>
    </tr>
    </table>

    I need solve this urgently, please can you help me?
    Regards
    Teresa

Viewing 7 replies - 1 through 7 (of 7 total)
  • Hey Terocha,

    Firstly a couple of questions, are you sending this through the form on your website, or sending it through the backend in the mail configuration tab?

    Additionally, your code only fails to use the proper document stucture, html, head, body. Even email clients utiize these headers when building html emails.

    Regards,
    -B

    • This reply was modified 5 years, 4 months ago by Lewis Elborn.
    • This reply was modified 5 years, 4 months ago by Lewis Elborn. Reason: Additional Info
    Thread Starter terocha

    (@terocha)

    Hi, Beaniie
    I send this through the form on my website.
    I thought that wasn´t necessary put all the html structure.
    Do i must include the header and the body sections?
    Thank you for your support.
    Regards
    Teresa

    Thread Starter terocha

    (@terocha)

    I add all the structure html but the problem remains…

    @terocha,

    IMO headers are always necassary unless instructed otherwise. Sadly, you cannot send HTML Markup through the form from the front end to my knowledge as it would be a huge security risk. The Option to enable HTML is for responses from the server to the user, I.e Auto responders etc.

    You may be able to find a way around this online, but it would seem more hassle than it’s worth and I wouln’t reccomend it.

    If you want to style your email so that when you receive it its well presented, you can insert the HTML within the Mail tab in CF7, then add your shortcodes where needed, this way when the user populates data it will find it’s way into the HTML template you have laid out then get sent.

    Regards,
    -B

    • This reply was modified 5 years, 4 months ago by Lewis Elborn.
    • This reply was modified 5 years, 4 months ago by Lewis Elborn.
    Thread Starter terocha

    (@terocha)

    Hi Beaniie,

    Thank you for you anwser. But the html code that i writed is precisely within the Mail tab in CF7. However i use javascript code when i fill some fields, do you think is that the reason because when click submit button, nothing happens?
    Regards
    Teresa

    I was having this same problem, I added HTML to the message body and I checked the checkbox that said to enable the HTML…still didn’t work. But I solved the problem. Here is what I did…

    You need to set up the message area just like an HTML document. So you have to put the following tags where required.
    <html>
    <head></head>
    <body>
    This is where your contact form 7 tags go.
    </body>
    </html>

    Once these tags were added, the html appeared in my email. Here is my sample code (partially edited for privacy)
    ———————————————–

    <html>
    <head></head>
    <body>
    <p>From: [your-name] <[your-email]></p>
    
    <p>Here is the submitted information:</p>
    <strong>Name:</strong> [your-name]<br />
    <strong>Phone:</strong> [tel-627]<br />
    <strong>Email:</strong> [your-email]<br />
    <strong>Services Interested in:</strong> [checkbox-36]<br />
    <strong>Approx Length (in feet):</strong> [number-68]<br />
    <strong>Approx Width (in feet):</strong> [number-507]<br />
    <strong>Additional Info:</strong> [textarea-361]<br />
    
    -- 
    <p>This e-mail was sent from a contact form</p>
    </body>
    </html>

    @cquinndesign + 1 for proper document structure! 🙂

    @terocha From what I can understand from what your saying is that your form fails to send entirely when the user clicks submit. This could be a number of things and without seeing a live link to the problem I won’t be of much help sadly but I can suggest a few troubleshooting tips.

    Firslty, if your using a recaptcha remove it and check to see if the form sends. (Sometimes recapatcha can be a bit troublesome.)

    Secondly, open up the console, in your browser and send your form, does your form post at all?

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Use html code in the body message’ is closed to new replies.