Skip to main content

Is it possible to remove the time stamp on Notifications to show the date only?

I don’t think this information is needed and it looks a little messy on Overdue Notifications that lists multiple Courses: 

 

 

This would be great. From my testing, formatting options which you can apply when generating a course certificate doesn’t work for email notifications.

In the old Ideas Portal I had created an idea for having gexpiers_at_day] shorcode for course notifications, however it wasn’t selected by Docebo for migration to the new Ideas portal. Maybe we should try submitting it again.


@emermuldoon I agree! It would be great if the time stamp could be removed for the validity period. For example, if a course expires on a specific date, it technically expires on the exact time it was entered in the system or the time the person was enrolled.  In other words, if a course expires on 30Sep at 10:30 am UTC, they could be ‘late’ if they take it on 30Sep at 10:40 am UTC. 

The reports will capture that user as late 😟

Can the system just show the validity date, in that the due date depends on the time zone of the user? 


It would be nice to just broadly allow setting a date/time format in all of these using standard placeholder style since those dates aren't exactly pretty either. I get them for reports as that data can be easily update in excel, but notifications are much different.

Seems like a solid idea waiting to be posted :)


First of all, I completely agree that this is something that Docebo should allow us to control.

Because I’ve fiddling around with this, and for a while there I even thought I’d worked out some CSS that would mitigate this problem. I’ll share it below because I’m weirdly proud of it, even though it doesn’t really solve anything because Outlook is garbage and simply ignores a lot of CSS.

Maybe it will even be valuable to you, if your users are all using Gmail, for example.

<style>
.duedate {
font-weight: bold;
overflow: hidden;
overflow-y: hidden;
max-height: 2.2ex;
max-width: 12ch;
display: inline-flex;
}
</style>

<div>
<p>Hello lfirst_name],</p>
<p>You have been enrolled in the following courses:</p>
<ul>/items]
<li><strong>&course_name]</strong>.<br />This course should be completed by <span class="duedate">=expire_at]</span>
</li>
[/items]
</ul>
</div>

What’s going on here? The trick with .duedate { max-width } is finding a width that will safely accommodate the date without being so wide as to leave room for the timestamp afterwards. At first I was specifying this width using the em unit, before I learned of the ch alternative, which is perfect for this use case.

The max-width and display: inline-flex properties have the effect of wrapping the date over two lines (with the space between the date and time serving as a natural break point), while the overflow(-y) and max-height properties are set such that only the first line (i.e. the date) is shown.

Depending on your font-family, it could take you a bit of trial and error to get the right value for .duedate { max-height }. If it’s too low, your date will have be clipped along the bottom. If it’s too high, the top of the second line will be visible. I used the ex unit here because it’s relative to the x-height of the font being used (as opposed to the width). You’ll likely want to pay particular attention to this when testing.


Reply