Buy Now
Sign in

How to edit the HTML of a form

Chas_L , January 17 2022, 08:51
C
Chas_L 49
January 17 2022, 08:51 #397761
Hopefully an easy question.
How do I edit the HTML of a form?
I need to change the width of the table it sends as it's 50/50 and I need to reduce it to 20/80.
Here is what I get in a standard message:
Cannot seem to find a simple way to access the form HTML.
Thanks
Chas
GreyHead 65
January 17 2022, 10:12 #397762
Hi Chas,
Is this the form itself - or the email you receive? It doesn't look right for either of these :-(
You can change the form styling using Custom CSS.
Bob
If you'd like to buy me a coffee or two, thank you very much
C
Chas_L 49
January 17 2022, 10:30 #397764
Hi Bob,
The image I posted shows how the message is received in Outlook. The source looks like this:
we have received the following message from the website:
<br><br>
<table width="100%" cellpadding="5" cellspacing="5" border="0" class="email_content_table" style="border:3px solid #e2e2e2; border-radius:7px;" class="ui table"><tr style="border:3px solid #e2e2e2;" class="email_content_tr">
<td width="50%" valign="middle" align="right" style="background-color:#fafafb; border:3px solid #e2e2e2;" class="email_content_td td_label">
<strong>Name</strong>
</td>
<td width="50%" valign="middle" align="left" class="email_content_td td_value">DILBERT</td>
</tr><tr style="border:3px solid #e2e2e2;" class="email_content_tr">
<td width="50%" valign="middle" align="right" style="background-color:#fafafb; border:3px solid #e2e2e2;" class="email_content_td td_label">
<strong>Email</strong>
</td>
<td width="50%" valign="middle" align="left" class="email_content_td td_value">Dilbert@underwater.co</td>
</tr><tr style="border:3px solid #e2e2e2;" class="email_content_tr">
<td width="50%" valign="middle" align="right" style="background-color:#fafafb; border:3px solid #e2e2e2;" class="email_content_td td_label">
<strong>Message</strong>
</td>
<td width="50%" valign="middle" align="left" class="email_content_td td_value">Hi there, is this a good enough messae for you?</td>
</tr></table>
What I need to do is edit the HTML of the form itself in Chronoforms, so I can change the way the email content is contained within the table of the message.
You can see the form on the site: https://chas-large.co.uk/index.php/contact
GreyHead 65
January 17 2022, 15:47 #397772
Hi Chas,
If you are using the basic Contact Form you can click Settings in the form Menu bar then scroll down to Admin Email and edit the email HTML there. You can use shortcodes like {data:field_name} to include the form data. (See the Shortcodes Cheatsheet from the 'book' icon at the right end of the form menu.
Bob
If you'd like to buy me a coffee or two, thank you very much
C
Chas_L 49
January 17 2022, 16:08 #397773
Hi Bob,
Thanks for that. Yes I can see the edit window, mine looks like this:
However, I can't see the HTML TABLE code there and even if I enable the WYSIWYG Editor I see this:
and if I click the <> to see the source code, I get this:
So I must assume the form has some form of basic template that contains the TABLE code, as seen in the source of the received email. Where do I edit that template? It's not part of the Joomla template as far as I can see. If I send a standard Joomla contact form email from the site, using the same default template, it's not frmatted with TABLE code, so this must be being introduced by Chronoforms.
Regards and thanks Chas.
GreyHead 65
January 17 2022, 16:56 #397774
 1
 Answer
Hi Chas,
You can replace the HTML there with whatever you want to include in the email.
Bob
If you'd like to buy me a coffee or two, thank you very much
C
Chas_L 49
January 17 2022, 17:16 #397776
AH! the light dawns! What you put there OVERRIDES the default that is in the {email_content} code, it must be encapsulated in your own code. That's not in the cheat sheet.
Thanks Bob,
can sort it now. Cheers.
BTW, suggestion. Can the cheat sheet be made downloadable elsewhere? switching it on and off and scrolling up and down when entering code, is cumbersome. Maybe suggest on the sheet that users copy them to a text file for easy reference?
Regards
Chas