Notification output formatting

Resolved grey4radar
(@grey4radar)

4 years, 4 months ago

Hi,

Is there a way I can change the format of the notification email to have a bit of spacing between all of the input answers and possibly a border around each one?

Here is an image of the default output next to what I would like to see (https://i.imgur.com/skgGIZ3.png).

Viewing 2 replies - 1 through 2 (of 2 total)

Plugin Support Patrick – WPMU DEV Support
(@wpmudevsupport12)

4 years, 4 months ago
Hi @grey4radar

I hope you are doing well.

The Email accepts HTML, so you can use a table structure:
https://www.w3schools.com/html/html_tables.asp
https://css-tricks.com/complete-guide-table-element/

But in this case, you will need to use the Macros for example:

Name – {name-1}

https://wpmudev.com/docs/wpmu-dev-plugins/forminator/#form-data

So the HTML would look like:
```
<table>
  <tr style="color: #fff; font-weight: bold; background: green;">
    <th style="padding: 12px;">Field</th>
    <th style="padding: 12px;">Data</th>
  </tr>
  <tr>
    <td style="padding: 12px;">Name:</td>
    <td style="padding: 12px;">{name-1}</td>
  </tr>
</table>
```
https://monosnap.com/file/fqDTW3396XwJ0PyD8bqV1v1SDlFC8G

https://monosnap.com/file/wm1rHZAXgc97F1KqIxzAiZM3NfNX02

Best Regards
Patrick Freitas
Thread Starter grey4radar
(@grey4radar)

4 years, 4 months ago
Hi Patrick,

That method is very labour intensive but works well.
I experimented with DIVS instead of TABLE layout and that works also.

My solution is:
```
<div style="background-color:navy; color:#ffffff; padding:0.25em 0.5em;">LABEL</div>
<div style="margin-bottom:2em; background-color:#d3d3d3; padding:0.25em 0.5em;">{radio-1}</div>

<div style="background-color:navy; color:#ffffff; padding:0.25em 0.5em;">LABEL</div>
<div style="margin-bottom:2em; background-color:#d3d3d3; padding:0.25em 0.5em;">{radio-2}</div>

<div style="background-color:navy; color:#ffffff; padding:0.25em 0.5em;">LABEL</div>
<div style="margin-bottom:2em; background-color:#d3d3d3; padding:0.25em 0.5em;">{radio-3}</div>
```
Thank you for your help.
- This reply was modified 4 years, 4 months ago by grey4radar.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Notification output formatting’ is closed to new replies.