Changing tab title on focus and blur

Learning by stealing

I stumbled upon the webpage (https://ag-prop.com) of a digital studio from Berlin and (beyound beeing very impressed by the page itself) was very intrigued about something I noticed leaving the tab with the page open and looking on something else in a different tab - the tab title changed and showed an emotin now.

A must-have in my opinion for every webpage, so I looked how to implement for a Hugo webpage and found a very clean solution. Just include these 4 lines in your HTML header and enjoy:

<script>
window.onfocus = function () { document.title = {{ .Page.Title }}; }
window.onblur = function () { document.title = '🥺you went?'; }
</script>