Overlaying logos¶
Flussonic offers two ways to overlay a logo to a video stream with Flussonic Media Server:
- Using the embed.html web player. The player adds a transparent layer with your image on top of the video stream. This method doesn't generate additional load on the server and works well if you want to embed a video on a website.
- Using the transcoder. Transcoder burns the logo image into the video stream so the logo can't be hidden or removed from the video. It's a computationally expensive process. This method is suitable for video streams transmitted to set-top boxes.
Adding a logo to a video stream using the embed.html web player¶
You can add a logo to a video stream using the embed.html web player in two ways:
You can see the logo in the live stream and the DVR player.
In the Flussonic UI¶
- In the Media > Streams, open the stream settings by clicking on the stream name.
- In the Output tab, find the Logo section.
- Upload the logo by clicking Select > Add New and selecting the logo image. You can upload several images.
-
Optional: Adjust the image size and its position in the video using these parameters:
- size:
height
,width
in pixels - position in the video:
left
,top
,right
,bottom
in offset in pixels
- size:
-
Select the required image by ticking the radio button next to it.
-
Save the settings by clicking OK > Save.
-
Check that the player displays the logo.
In the Flussonic configuration file¶
You can also overlay a logo with the web player in the configuration file. To do that, follow these steps:
- Upload the logo image using the
Flussonic-API: PUT /streamer/api/v3/logos/{name}
method. - Open the
flussonic.conf
configuration file. - In the stream settings, add the
logo
directive and specify the logo filename in thepath
parameter, starting with@
. -
Optional: Adjust the image size and its position in the video using these parameters:
- size:
height
,width
in pixels - position in the video:
left
,top
,right
,bottom
in offset in pixels
- size:
-
Check that the player displays the logo.
stream example {
input udp://239.0.0.1:1234;
logo path=@logo.png height=100 width=100 left=0 top=0;
}
In this example:
path
is the logo file name, starting with@
.- (Optional)
height
,width
specify the size of the logo image in pixels. If you specify one of these parameters, then the other scales proportionally. To display the logo in its original size, omit these parameters. - (Optional)
left
,top
,right
,bottom
specify the position of the logo image by offset in pixels. For example, to display the logo in the bottom right corner, specify the following values:right=0, bottom=0
. Don't use theleft
andright
, or thetop
andbottom
parameters together.
Adding a logo to a video stream using the transcoder¶
When using the transcoder to overlay a logo on a video stream, the image is burned into the video track. It is displayed on any device and recorded in the DVR archive.
stream example {
input udp://239.0.0.1:1234;
transcoder vb=2048k logo=/storage/logo.png@10:10 ab=128k;
}
Here, 10:10
are the coordinates of the image, offset from the top left corner of the screen.
To place a logo in another part of the screen, you need to use a more complex notation. See the following examples:
- To place a logo in the center, use the following configuration:
stream example {
input udp://239.0.0.1:1234;
transcoder vb=2048k logo=/storage/logo.png@(main_w-overlay_w-10)/2:(main_h-overlay_h-10)/2 ab=128k;
}
- To place a logo in the bottom left corner, use the following configuration :
stream example {
input udp://239.0.0.1:1234;
transcoder vb=2048k logo=/storage/logo.png@10:(main_h-overlay_h-10) ab=128k;
}
- To place a logo in the top right corner, use the following configuration:
stream example {
input udp://239.0.0.1:1234;
transcoder vb=2048k logo=/storage/logo.png@(main_w-overlay_w-10):10 ab=128k;
}
- To place a logo in the bottom right corner, use the following configuration:
stream example {
input udp://239.0.0.1:1234;
transcoder vb=2048k logo=/storage/logo.png@(main_w-overlay_w-10):(main_h-overlay_h-10) ab=128k;
}
Learn more in the section Transcoder Settings.