
Hide playlist thumbnails from JW Player 6
Hi guys!
I would like to remove the thumbnails from the playlist sidebar.
I ve already tried to custom the itemImage element in my skin file but to no avail...
Any idea on how to do that?
Thanks.
Hi guys!
I would like to remove the thumbnails from the playlist sidebar.
I ve already tried to custom the itemImage element in my skin file but to no avail...
Any idea on how to do that?
Thanks.
I am not sure in how you are implementing your playlist; inline or via a JSON file.
Why not simply just leave the image from the playlist? Have you done this or tried?
(psst) It does works
I am using jw player 6.
I am not using Json files.
Just using the standard code in order to implement playlists:
jwplayer("myElement").setup({
playlist: [{
image: "/assets/sintel.jpg",
file: "/assets/sintel.mp4",
title: "Sintel Movie Trailer"
},{
image: "/assets/bunny.jpg",
file: "/assets/bunny.mp4",
title: "Big Buck Bunny Movie Trailer"
}]
});
What I am trying to do with playlists is more like "chapters indexing"
They are different chapters from the same video and I would like to index them on the right.
I have no use for multiple thumbnails which are going to be the same anyway and eat up a lot of real estate.
Hi, any updates on a text-only playlist option?
Not yet, but this can also be fixed if you make a custom skin. We have the sdk available here – http://developer.longtailvideo.com/trac/
Hi! I just bought the Pro version and using JW6 in WordPress.
Is there any update in the future for this? I also don't want any thumbnails in the playlist bar. Any ETA?
Has to be done with a custom skin.
Okay! Is there a guide how to do this for the WordPress plugin?
You just need to make the skin from the sdk available here – http://developer.longtailvideo.com/trac/
Then, you can upload it to your site, and link to the skin via shortcode.
Is there any further documentation on how to create a custom skin without playlist thumbnails? I downloaded the SDK from http://developer.longtailvideo.com/trac/ but did not find out how to solve this issue.
I took a look at your docs at http://www.longtailvideo.com/support/jw-player/28847/building-jw-player-skins/ but did not find anything there neither.
Thanks
FYI: I have got a premium JWPlayer version
You need to remove the images from the playlist xml.
Thanks for your support, but I have to say that there is not playlist.xml within my SDK.
bc.. sdks_jw6-plugin-sdk-3857.zip
File stucture within sdks_jw6-skin-sdk-3864sdksjw6-skin-sdkskinssix
bc.. contolbar/
display/
dock/
playlist/ <= no XML here
tooltip/
six.xml <= the only XML I found so far
Have I missunderstood something when reading this thread? Am I using the wrong SDK?
You are using the plugin sdk, you need the skin sdk.
Sorry, I downloaded the bc.. sdks_jw6-skin-sdk-3870
SDK. ( The plugins SDK was only a typo ), but the only *.xml files I found are:
bc.. * sdks_jw6-skin-sdk-3870sdksjw6-skin-sdkskinsfivefive.xml
* sdks_jw6-skin-sdk-3870sdksjw6-skin-sdkskinssix/six.xml
Modifying the six.xml playlist component did not work for me
bc.. <component name="playlist">
<settings>
<setting name="activecolor" value="bfbfbf"/>
<setting name="backgroundcolor" value="262626"/>
<setting name="fontcolor" value="999999"/>
<setting name="fontsize" value="11"/>
<setting name="fontweight" value="normal"/>
<setting name="overcolor" value="cccccc"/>
<setting name="titlecolor" value="cccccc"/>
<setting name="titleactivecolor" value="ffffff"/>
<setting name="titleovercolor" value="ffffff"/>
<setting name="titlesize" value="13"/>
<setting name="titleweight" value="normal"/>
</settings>
<elements>
</elements>
As you can see, I removed all "elements", but the image is still displayed.
Would be please be so kind and tell me where to look for the playlist part to remove the 'image' from.
You need to remove the playlist image png
I finally found out, what you probably meant by playlist image png, so I removed the
bc.. <element name="itemImage" src="..."/>
part from the skin.xml, which removed the thumbnail overlay, but did not remove the thumbnail itself.
The only way to avoid the video thumbnail being displayed, as far as I found out, is to remove the "image" from each playlist item entry, which results in no image preview being displayed for the videos any more.
Is there any possibility to set a preview image for ALL playlist items, without showing the thumbnails in the listbar?
That is not possible to do, I’m afraid.
I'm also trying to hide the thumbnails in the playlist. I've modified the skin and got that working. The images don't show up, but there still seems to be a large space for the images in the listbar, pushing the titles awkwardly to the left. Here's what I've put for the elements portion in the skin xml:
<elements>
<element name="divider" src="divider.png" />
<element name="item" src="item.png" />
<element name="itemImage" src="blactive.png" />
<element name="sliderCapBottom" src="cap.png" />
<element name="sliderCapTop" src="cap.png" />
<element name="sliderRail" src="rail.png" />
<element name="sliderRailCapBottom" src="railBottom.png" />
<element name="sliderRailCapTop" src="railTop.png" />
<element name="sliderThumb" src="thumb.png" />
<element name="sliderThumbCapBottom" src="thumbBottom.png" />
<element name="sliderThumbCapTop" src="thumbTop.png" />
</elements>
The "blactive.png" image is a 1x1 transparent png.
Any ideas on at least being able to center the item title in the playlist?
And any further plans to make this a feature in JW6 (as it was a feature in JW5)?
Thanks!
You should be able to make the images smaller width wise so they don’t show up.
Are you talking about the transparent PNG's I've added? Smaller than 1x1 pixel?
In the playlist, not the control bar.
Sorry, should have been more clear. I am making these changes in the playlist component:
<component name="playlist">
<settings>
<setting name="activecolor" value="bfbfbf" />
<setting name="backgroundcolor" value="262626" />
<setting name="fontcolor" value="999999" />
<setting name="fontsize" value="11" />
<setting name="fontweight" value="normal" />
<setting name="overcolor" value="cccccc" />
<setting name="titlecolor" value="cccccc" />
<setting name="titleactivecolor" value="ffffff" />
<setting name="titleovercolor" value="ffffff" />
<setting name="titlesize" value="13" />
<setting name="titleweight" value="normal" />
</settings>
<elements>
<element name="divider" src="divider.png" />
<element name="item" src="item.png" />
<element name="itemActive" src="blactive.png" />
<element name="itemOver" src="blactive.png" />
<element name="itemImage" src="blactive.png" />
<element name="sliderCapBottom" src="cap.png" />
<element name="sliderCapTop" src="cap.png" />
<element name="sliderRail" src="rail.png" />
<element name="sliderRailCapBottom" src="railBottom.png" />
<element name="sliderRailCapTop" src="railTop.png" />
<element name="sliderThumb" src="thumb.png" />
<element name="sliderThumbCapBottom" src="thumbBottom.png" />
<element name="sliderThumbCapTop" src="thumbTop.png" />
</elements>
</component>
Can I see a link?
The video is on a secure server now, but here's a screenshot of what the setup looks like.
http://edwozniak.com/screenshot
Thanks!
Sorry, I want an actual link to the implementation.