Hi @slvedva ,
Sure!!
Filtering status
To match to your use case, I took the same table from the blog post example and included a 'status' column, containing both 'OK' and 'missing' values:
I didn't need to add any additional action to the flow design, but I included a 'Filter query' in the Excel action, to return only those rows which status is ok:
Just for clarification, we are taking the column name ('Status'), using an equality operator ('eq') and setting the value that we want to use in this comparison, in order to return the records ('OK'). Be careful when writing this statement, as the characters are case sensitive and, as you will be working with strings, you must encapsulate your 'OK' into single quotes.
Styling the HTML table
To add style to the HTML table allocated in the email body, you will need to use some CSS. As a first step, click in this '</>' icon in your 'Send an email' action:
It will change your email body structure to a HTML notation:
Now you can add a style block on the beginning of your email body (highlighted in yellow), and insert your CSS formatting inside it (marked in red).
I don't know how comfortable you are with CSS, so here go some starter instructions:
- Your style tag will start with <style> and end with </style>
- In the email body, you can see some HTML elements, like <p> (paragraph) and <br> (line break). You can refer to these elements in your CSS to style them
- To style a HTML element, just write the element (without the '<>'), open curling brackets ('{}'), and enter the properties that you want to style
- Use one line per property and always finish the line with a semicolon
- In our example, we are styling some HTML elements that are not displayed in the email body. That's because they are table elements. 'table' matches to the whole table, 'th' matches to the table header (the column titles), 'td' matches to the table fields
Here is the whole style code that I used:
<style>
table{
background-color: #eee;
border: 2px solid black;
}
th{
background-color: #ccc;
}
td{
padding: 15px;
border: 1px solid black;
}
</style>
About the properties above:
- background-color will change my element background, setting it to a light gray. I'm using a hexadecimal color reference (#ccc and #eee), but CSS allows you to use RGB codes or even just type the name of default colors (like red or turquoise).
- border will set a visible border to my elements. I'm first assigning a thickness to it (1px or 2px), stating that it is solid (could be dashed or any other style) and assigning a black color.
- padding is used to add some internal space in the element. In my case, I'm adding 5px in each element, in order to make sure that the different table cells are not so close to each other.
Disclaimer: I'm a very bad artist, so the table is still with a bad design. The goal here is just to showcase how to use CSS in the emails 🙂
And here is the final result:
(1) The user received only the trainings that have a status equal to 'OK' and (2) the table has a formatting.
For additional reference to CSS properties, I recommend you to check these links:
https://www.w3schools.com/css/
https://developer.mozilla.org/en-US/docs/Web/CSS
Let me know if it works for you or if you need any additional help!
-------------------------------------------------------------------------
If this is the answer for your question, please mark the post as Solved.
If this answer helps you in any way, please give it a like.
http://digitalmill.net/
