1. Home
  2. Knowledge Base
  3. Layouts
  4. Layout Designer
  5. How Do I Create an L-Bar Wrap with a TV Source / IPTV

How Do I Create an L-Bar Wrap with a TV Source / IPTV

An L-Bar Wrap layout allows you to play content around your TV source or IPTV when using LG webOS or Samsung SSP and Tizen smart displays.

The L Bar will be determined by your design. The most common type of L-Bar Wrap is the L Bar on the left side of the screen, with the TV source on the right side:

     

The L-Bar should be a PNG file with a transparency where the TV source will play as a layer behind it. If you have a series of L-Bars that you would like to rotate, a playlist can be created an added to the layout as a zone above the TV source.

The steps below will walk through guidance on creating a single L-Bar in a layout and a playlist that will rotate a series of L-Bar files.


Creating an L-Bar Image File for a Background

Photoshop is the best method for creating an L-Bar. However, if you do not have Photoshop, PowerPoint can be used to create the L Bar and Lunapic Free Online Photo Editor can be used to create the transparency for your TV source.

When creating the L-Bar, keep in mind the size of the zone that will be playing the TV source. You want to say close to the resolution of the video that is playing. For example, if my L-Bar will be the full 1920×1080 resolution, I’ll want to create my TV source area at a resolution of 1438×816.

Here’s a link to download a standard Photoshop L-Bar template: http://bit.ly/2zTrwte

Creating an L Bar Layout with a Single “L” Bar

1) From the Home page, click on Layouts

2) Click on the ‘Create New’ button and give your layout a name:

3) Click on the ‘Add Image’ icon from the toolbar:

4) Click on the ‘Upload Media’ tab to upload your PNG L-Bar image:

5) Once the image has been added to the layout, click on the ‘TV Source’ icon:

6) Once the TV Source zone has been added, move the zone over the PNG L-Bar and adjust the height and width of the zone to fit the transparent area. Click on the ‘TV Source’ link in the top left of the zone and use the ‘TV Source’ drop down in the toolbar to select the type of input:

7) One you have the TV Source zone where you want it, drag the zone layout below the PNG image in the toolbar. This will move the TV Source zone behind the PNG image:

8) Once you’re happy with your layout, click on the ‘Schedule’ icon at the bottom of the toolbar, or use the ‘Schedule’ icon from the Home page to schedule your layout to your player/smart display.

Ensure that you have your video source connected to the correct source input. Once content updates on the screen, you should see your source video playing in the zone that you’ve defined in the layout.

 

Creating an L-Bar Layout with a Playlist

1) From the Home page, click on ‘Playlists’.

2) Click on the ‘Create New’ button and give your playlist a name:

3) Use the ‘Upload Media’ tab to upload your L-Bar PNG files to the Asset Library. Once uploaded, click back on the “Assets’ tab and drag and drop your files into the timeline at the bottom of the page in the order you require (The playlist will save automatically):

4) From the Home page, click on ‘Layouts‘.

5) Click on the ‘Create New’ button and give your layout a name. Click ‘Save and go to Designer’ to open the Designer.

6) Click on the ‘Playlist’ icon on the toolbar:

7) Use the playlist zone to rename the zone (i.e. “L Bar Playlist”).

8) Use the ‘Playlist’ dropdown to select your playlist and use the Width and Height to set your playlist zone at full resolution: Width: 1920 and Height: 1080. Click ‘Apply’ to save those changes:

9) Once the playlist has been added to the layout, click on the ‘TV Source’ icon: 

10) Once the TV Source zone has been added, move the zone over the L-Bar playlist and adjust the height and width of the zone to fit the transparent area. Note: Adding a PNG image to the layout might help as a guide as you position the TV source zone.

Click on the ‘TV Source’ link in the top left of the zone and use the ‘TV Source’ drop down in the toolbar to select the type of input:

11) One you have the TV Source zone where you want it, drag the zone layout below the PNG playlist in the toolbar. This will move the TV Source zone behind the PNG playlist.

12) Once you’re happy with your layout, click on the ‘Schedule’ icon at the bottom of the toolbar, or use the ‘Schedule’ icon from the Home page to schedule your layout to your player/smart display.

Ensure that you have your video source connected to the correct source input. Once content updates on the screen, you should see your source video playing in the zone that you’ve defined in the layout.

 

Updated on January 26, 2019

Was this article helpful?

Related Articles

Need Help?
helpdesk@engagephd.com / 888.386.4545
CONTACT US / CHAT