Status Badge Embed

Statuspal lets you easily embed a status banner and badge widget to display the status of your service/app directly in your website or HelpDesk site. This way your customers can quickly find out if there are ongoing outages or planned maintenance.

This is how the status banner looks in your website:

And here is how the status badge looks like when embedded in your site:

Configure Your Status Banner and Badge

In order to configure the status widget simply click on Status Widget on the sidebar of status page admin site

You will find a 3 steps instruction page detailing how to set up your status banner and/or badge.


Customize the Status Badge Colors

Customizing the colors displayed depending on the current status can be easily achieved though CSS:

<style>
  .sp-status .sp-status-badge.sp-status-ok        { background: darkgreen; }
  .sp-status .sp-status-badge.sp-status-scheduled { background: darkblue; }
  .sp-status .sp-status-badge.sp-status-minor     { background: darkorange; }
  .sp-status .sp-status-badge.sp-status-major     { background: darkred; }
</style>

Simply put the desired colors next to "background:", and make sure to add this style after the widget <script>.



You don't have a Status Page yet? go ahead and create one in seconds at Statuspal.io