Possibility to blank custom stage view

Like many others I'm starting to use a custom stage view as an OBS feed for displaying bible/lyrics to video streams. The downside I've found however is that stage views do not blank in the way the main view does and therefore creates additional work in that someone needs to baby sit the OBS feed and duplicate the show/blank commands that the person controlling OpenLP is already doing.

Probably what would be really ideal is the ability to use custom views for the main view also, eg. like this http://xxx.xxx.x.xx:4316/main/Bible-CL instead of http://xxx.xxx.x.xx:4316/stage/Bible-CL



  • Hi, blanking sceeen can be done via javascript. There is a thread with sample code somewhere around.

  • If you want to blank the display completely whenever the main view is emptied, you need to change the function “pollServer” inside of the file “stage.js”

    pollServer: function () {
        function (data, status) {
          if (OpenLP.currentItem != data.results.item ||
            OpenLP.currentService != data.results.service) {
            OpenLP.currentItem = data.results.item;
            OpenLP.currentService = data.results.service;
          else if (OpenLP.currentSlide != data.results.slide) {
            OpenLP.currentSlide = parseInt(data.results.slide, 10);
          if(data.results.display || data.results.blank || data.results.theme) {
          else {
          // NEW CODE ENDS HERE

    In the OpenLP API there are three options for the three types of blanking the screen (display, blank, theme). If any of these are active, it hides the complete page. Otherwise it is displayed.

  • Does this apply only to the new version of openLP or will this work on version 2.4 as well?

    I have added the code to “stage.js” file but it doesn't seem to do anything.

  • edited April 2022

    Hello! I would like this as well, the posted solution above seems to be for the old API (v1?), and i cant get it to work using the new 2.9.4 version with API.v2.

    I have searched all of the wiki's for API's and such and cant find the same solution modified for api v2.

    (Dont know the programming language well enough to understand the replacement for the "pollServer-function")

    I guess it could be somewhere in this function?

    updateSlide: function() {
      // Show the current slide on top. Any trailing slides for the same verse
      // are shown too underneath in grey.
      // Then leave a blank line between following verses
      $("#verseorder span").removeClass("currenttag");
      $("#tag" + OpenLP.currentTags[OpenLP.currentSlide]).addClass("currenttag");
      var slide = OpenLP.currentSlides[OpenLP.currentSlide];
      var text = "";
      // use title if available
      if (slide["text"]) {
        text = slide["text"];
      } else {
        text = slide["Title"];
      // use thumbnail if available
      if (slide["img"]) {
        text += "<br /><img src='" + slide["img"].replace("//thumbnails//", "//thumbnails//") + "'><br />";
      // use notes if available
      if (slide["slide_notes"]) {
        text += '<br />' + slide["footer"];
      // "slide_notes"
      text = text.replace(/\n/g, "<br />");
      text = "";
      if (OpenLP.currentSlide < OpenLP.currentSlides.length - 1) {
       for (var idx = OpenLP.currentSlide + 1; idx < OpenLP.currentSlides.length; idx++) {
        if (OpenLP.currentTags[idx] != OpenLP.currentTags[idx - 1])
          text = text + "<p class=\"nextslide\">";
        if (OpenLP.currentSlides[idx]["text"]) {
          text = text + OpenLP.currentSlides[idx]["text"];
        } else {
          text = text + OpenLP.currentSlides[idx]["title"];
        if (OpenLP.currentTags[idx] != OpenLP.currentTags[idx - 1])
          text = text + "</p>";
          text = text + "<br />";
  • Could anyone help with the solution for this in version 2.9.5 please? I need the stage view to go blank in OBS as soon as the main view does. The code above only seems to work for earlier versions.


  • You can catch changes of the display mode via the websockets api: https://gitlab.com/openlp/wiki/-/wikis/Documentation/websockets

    Below I have expanded on the example provided on the wiki.

    const host = window.location.hostname;
    const websocket_port = 4317;
    ws = new WebSocket(`ws://${host}:${websocket_port}`);
    ws.onmessage = (event) => {
        const reader = new FileReader();
        reader.onload = () => {
            const state = JSON.parse(reader.result.toString()).results;
            if (state.blank) {
                // Run code to blank your stage view here
            else {
                // Run code to unblank your stage view here
  • Hello ninjakiwi, 

    Thanks for the prompt response! You're a star! I am guessing the file to edit is the stage.js. But as I am not very well versed in programming, I need a bit more help. Could you kindly give me the code that runs to blank the stage?

  • edited December 2022

    Hi KCG,

    I'm working on the same thing you are apparently. I took ninjakiwi's code and got this to work but only for the Blank button, theme and desktop do not blank out. I'm just a beginner and know just enough to try things without knowing exactly what's going on, so I give you even fewer guarantees than usual when copying code off the internet :)

    This is a snippet of my stage.js that is working for me:

    OpenLP.myTwelve = data.twelve;
    const state = JSON.parse(reader.result.toString()).results;
            //added ninja code here
            if (state.blank || state.theme || state.display) {
              // Run code to blank your stage view here
            } else {
            //end ninja code
            if (
              OpenLP.currentItem != data.item ||
              OpenLP.currentService != data.service
            ) {

    If I get any further I'll update.

    EDIT: Found the other states. Added to the original code above.

  • Hey Kristin!!!

    Thanks a million for this, I finally got it working!

  • Wow! I also got it working now, exactly as i want it to! Thank you so much for your help!!

    @ninjakiwi, @KCG, @Kristin

    Blessing and have a happy new year!

  • Thanks a lot and be blessed!

    How is it possible to show only the song text in the stage view?


  • You need to change your stage.html to hide divs you don't want and stage.css to style the html you do want.

    Here's mine currently if you want a starting point. https://github.com/North-Country-Chapel/openlp/tree/main/lowerthird

    Under stage.html the <!-- --> comments out a div so they don't show up. So this example will not show the clock but will show the notes:

     <!-- <div id="clock"></div> -->
          <div id="notes"></div>

    The CSS under #currentslide is the most relevant and you'll want to change that to whatever position/fonts/colors/sizes are appropriate for you. Check out Chrome or Firefox inspector to experiment with theCSS.

    My stage.js is altered to not show video and image thumbnails and titles but the titles still flashing up there because I'm not good at rendering and DOM. You might need to add file types to this line if you use other file types you want hidden:

    if (
          ["mp4", "png", "gif", "jpg", "jpeg", "wmv", "pptx", "pdf"].some((char) =>

    Hope this helps.

  • Thank you for the files.

    Is it possible to hide also the bible verses?

  • edited January 17

    That's beyond me. My hack only works because the images/videos use their filenames as the text. Bible verses don't have anything distinctive like that to work with.

    Edit for future searchers: I have updated stage.js to use the plugin type so it should work in most situations. It's still a little quirky about certain refreshes.

  • Hi @Kristin ,

    I have been using this for a while now and it's been great! I was just wondering if it is possible to include the Song title or the Bible verse in the Custom Stage. I thought it could be done by the inclusion of the following div in the stage html

     <div id="notes"></div>

    However it seems to be blank when I inspect it in the browser. Any ideas?

Sign In or Register to comment.