Resource icon

Using OpenLP Interface for Lyrics

Hello, in this guide I'll explain how to use the OBS-OpenLP Interface tool to display text from songs that you are presenting on OpenLP as subtitles in your stream.

Setting up OpenLP
Set up the tool
First, in OpenLP, go to Settings -> Manage Plugins and make sure to enable the Remote plugin. Next, download the tool and extract the files into a temporary folder. In OpenLP, go to Tools -> Open Data Folder.... In this folder, create a folder called stages and within that folder, create a folder called stream. Move the extracted files to the stream folder, as pictured in the following screenshot:

files.png


Get your stage IP address
Now you need to get your IP address from OpenLP to use in OBS. Go to Settings -> Configure OpenLP -> Remote and copy the Stage URL address:

remote.png


Setting up OBS
Setting up the Browser Source
The first thing you need to do in OBS is create a browser source as such:

add source.png


As the URL, use the IP that you just copied, but add "stream" to the end of it, as such: http://192.168.1.14:4316/stage/stream. Please note, your actual IP will likely be different than mine, but it should still end with "/stage/stream". Then, edit the browser source so that it takes up the full width of your screen (1920px if you're recording in 1080p and 1280px if you're recording in 720p), but only about 200px in height for two lines of subtitles, and about 400px for four lines of subtitles (if you are using 1.4.0 or later, you can set the height to fill the whole screen, seeing as you have layout controls through controls dock). Also, make sure to remove any custom CSS:

source settings.png


After clicking OK, make sure to move your subtitles to the bottom of the screen. You may see a black square, but that's a minor bug for now.

Setting up the Custom Browser Dock (Control)
Now that you have the Browser Source, you need to set up the Control dock. Add a custom browser dock by going to the menu:

custom dock menu.png


For your dock, you must use the IP address that you used above for the source, but add "control.html" to the end: http://192.168.1.14:4316/stage/stream/control.html:

custom dock.png


Once you've added the dock, dock it on the left side per my preference, or wherever you prefer. You'll see for now that there is no preview text yet:

blank dock.png


There is no preview because you have not displayed a live slide yet. We will do that now.

Displaying lyrics
Go to OpenLP, select a song, and make the first verse go live:

go live.png


Now, if you go to OBS, you will see that the preview is active. Change the counters next to the "Display next" buttons to set how many lines will be displayed at a time. You also probably want to set the "Auto-show on slide change." Now if you click the "Display next" button, you will see your subtitles in the Browser source.

final product.png


God bless you and please post here if you have any questions.
  • go live.png
    go live.png
    760.2 KB · Views: 969
Author
amirchev
Views
27,135
First release
Last update
Rating
5.00 star(s) 1 ratings

More resources from amirchev

Latest reviews

Excellent tool. God bless you!
Top