HOW-TO:Change the episode thumbnail in Confluence
Skinning | Confluence | HOW-TO:Change the episode thumbnail in Confluence |
This tutorial will show how to change the episode thumbnail on the Info screen I, OSD M and Home screen. This is achieved by editing VideoFullScreen.xml and Home.xml. You'd want to do this because sometimes the thumbnails contain spoilers.
Changing the episode thumbnail to a TV Show poster on the OSD & Info screen
A. Open the file VideoFullScreen.xml and find the following code. It's easiest found by searching for [VideoPlayer.Content(Movies) | VideoPlayer.Content(LiveTV)]
<control type="image" id="1"><br /> <description>cover image</description> <left>20</left> <top>260r</top> <width>300</width> <height>230</height> <texture fallback="DefaultVideoCover.png">$INFO[Player.Art(thumb)]</texture> <aspectratio aligny="bottom">keep</aspectratio> <bordertexture border="8">ThumbShadow.png</bordertexture> <bordersize>8</bordersize> <visible>![VideoPlayer.Content(Movies) | VideoPlayer.Content(LiveTV)]</visible> </control
B. Replace $INFO[Player.Art(thumb)] with $INFO[Player.Art(tvshow.poster)]
This changes the episode thumbnail to a TV Show poster.
C. Change:
<top>260r</top> to <top>350r</top>
<height>230</height> to <height>330</height>
This will make the TV Show poster the same size as movie posters.
Changing the episode thumbnail to a TV Show poster on the Home screen
A. Open the file Home.xml and find the following code. It's easiest found by searching for <visible>VideoPlayer.Content(Episodes)
<visible>VideoPlayer.Content(Movies)</visible> <control type="image"> <description>Cover image</description> <left>20</left> <top>225</top> <width>180</width> <height>120</height> <aspectratio>scale</aspectratio> <texture fallback="DefaultVideoCover.png">$INFO[Player.Art(thumb)]</texture> <bordertexture border="8">ThumbBorder.png</bordertexture> <bordersize>5</bordersize> </control>
B. Change:
<top>225</top> to <top>45</top>
<width>180</width> to <width>120</width>
<height>120</height> <height>300</height>
<aspectratio>scale</aspectratio> to <aspectratio aligny="bottom">keep</aspectratio>
$INFO[Player.Art(thumb)] to $INFO[Player.Art(tvshow.poster)]
This will add the TV poster in the correct position.
Or just replace the above control section with this:
<control type="image"> <description>Cover image</description> <left>20</left> <top>45</top> <width>120</width> <height>300</height> <aspectratio aligny="bottom">keep</aspectratio> <texture fallback="DefaultVideoCover.png">$INFO[Player.Art(tvshow.poster)]</texture> <bordertexture border="8">ThumbBorder.png</bordertexture> <bordersize>5</bordersize> </control>
C. Find the following code. It's just below the above code.
<control type="label"> <description>TV Show Season Ep Label</description> <left>210</left> <top>265</top> <height>25</height> <width>1000</width> <label>$INFO[VideoPlayer.TVShowTitle] ($INFO[VideoPlayer.Season,$LOCALIZE[20373] , - ]$INFO[VideoPlayer.episode,$LOCALIZE[20359] ,])</label> <align>left</align> <aligny>center</aligny> <font>font12</font> <textcolor>white</textcolor> <shadowcolor>black</shadowcolor> </control> <control type="label"> <description>Title label</description> <left>210</left> <top>285</top> <height>30</height> <width>1000</width> <label>$INFO[Player.Title]</label> <align>left</align> <aligny>center</aligny> <font>font13_title</font> <textcolor>white</textcolor> <shadowcolor>black</shadowcolor> </control> <control type="label"> <description>Time Label</description> <left>210</left> <top>310</top> <height>30</height> <width>300</width> <label>$INFO[Player.Time]$INFO[Player.Duration,[COLOR=blue] / [/COLOR]]</label> <align>left</align> <aligny>center</aligny> <font>font12</font> <textcolor>white</textcolor> <shadowcolor>black</shadowcolor> </control>
D. Change every occurrence of <left>210</left> to <left>160</left>. This will move all the text a bit to the left so it matches how it looks when a movie is playing/paused.