Take a break! Theme component

What is it?

After a discussion about moderators about spending an extended amount of time on the screen, I decided it’ll be best to remind staff members(and non-staff!) to frequently take a break from the forums after looking at it for a long time. New update: It also works on non-staff and can be toggled on and off via theme settings.

What does it do?

This theme component shows an alert message after the member is on the forums for x amount of seconds. So 30 minutes would be 1800 seconds until the message is shown. This component has 4 main settings that let you customize your message and change the time until the message is shown.


It’s PROVEN to help you if you take a break from the screen. This is especially for moderators and admins who sometimes spend the night doing staff work! This component is a great reminder to take a break if you’re moderating or looking at the forums for too long. This component also helps for those who can’t stop replying, posting, etc. It’s always good to take a break!


Here’s a quick preview video(Sorry the webpage took so long to load)

Since changing the settings in theme creator is currently broken, you can download this component on your instance and try changing the message and the time!


Should I change something? Critical feedbacks are welcome!


Maybe there should be an option to show it to users, too (not only staff). As a regular user I would be fascinated to see that the forum admins care about users’ health :slight_smile:


Hi @Chaboi_3000,

neat idea, we talked of something similar with @sam recently.

My main criticism is the code, it should be vastly improved, I can provide guidance if you are willing to improve it.

Few ways to improve it:

Let me know if you need more help, happy to review more.

I’m a little bit concerned we can’t disable it on per user basis, as I would never use this. But we don’t have per user setting in theme components ATM. So I don’t see any good/easy solution here.

Maybe a good solution would be to have a pair of groups/message, that would make it slightly more configurable.


Added an option for normal users. (Default is off for normal users)

Fixed. Sorry about that.

I haven’t checked discourse for a while. I’ll go over it tomorrow. I’ll also check on the other ones too. I’ll message you if I have trouble with any on them. Thanks :slight_smile:


Is it reasonable to migrate this theme component to the new javascript files? If so, is there a guide on how to do this?


Fixed. I’m still wondering about the differences between javascript files and the standard html, css, and js.

1 Like

Thanks. I’ll try adding some QOL features when I get some time :slight_smile:


Impressive! I never knew it could be changed for different uses myself! It’s awesome to hear that it’s helping. Answering unanswered threads is definitely something that’s always encouraged anywhere regardless of what the forum is used for. Thanks for sharing! :slight_smile:


Does it interrupt the users while creating a new post??
Is it possible to serve ads via this component?

I haven’t set it to prevent it from popping up when a user is typing :pensive: (Though it will not close the editor). You can definitely use this component for ads, but I recommend this solution as it is more optimized for advertising:

1 Like

Sorry for the bump but I have some suggestions, possibly make it configurable by the user in settings, be able to change the colour and instead of like the X have two buttons, one with a social media platform like YouTube that the user can change and one with it saying I’m fine or something that’s changeable by the admin

But it is possible at all to add HTML to the text? Would be really nice if so. (and maybe in that case an extra option for frequency… like show every “nth” day only).

You can definitely edit the source code and change the HTML to fit your needs.

I am already using the official ad plugin. I am asking if it’s possible to pop up ads when the site loads up just like in the below link. Does it run google Adsense code?


By default it’s only meant to display normal text. If you burrow in the source code and change it, you can definitely display an AD.

1 Like

@Pravi, if you want, you can fork the repository and take a look at the head-tag.html file in the component(This is where the popups and everything is done) and customize it to fit your preferences. The showModal is called here. You’d probably want to play around with the code :slight_smile:

1 Like