Jump to content






Photo

Learn how to Create Skins for Emby Theater

Posted by Luke , 21 November 2016 · 16287 views

By now, you've seen the images of how pretty Emby Theater is:

 

Posted Image

 

Posted Image

 

You can learn more about the app by reading the original announcement:

 

http://emby.media/co...ws-and-the-web/

 

But what about the skinning engine? How can we create our own skins? We're please to announce that it's very easy.

 

All You Need is a Little HTML

 

If you can do HTML and JavaScript, then you can build a skin for Emby Theater. It's that easy.

 

Just Fork the Default Skin

 

The default skin is open sourced on Github:

 

https://github.com/M...web-defaultskin

 

Just fork it, give it a new name, make your changes, and that's all there is to it. You can host your skin directly on Github, and users can easily install it within the app's settings. So fork away and start skinning. We're excited to see what you come up with.



  • SikSlayer, denz, Tranquil and 6 others like this



Do you know when this feature will be available for the regular web client?

Do you know when this feature will be available for the regular web client?

 

We can't offer any dates but the best way to get what you want faster is to help contribute by experimenting with building a skin in Emby Theater, without waiting for the regular web app to have everything you want.

If I get it right, I can't modify elements under "bower_components" folder because it's not in the default skin directory?

Going to have fun with this.

not going to bother with this now until I see what is happening with some of the UI decisions that are being made regarding custom artwork visibility in some sections. ie TV/Movie Genres

this looks very cool.... so i have some experience editing/modding skins and phpbb forums but have never "forked" before, as such i'm hoping for a bit of help regarding the instructions.... i downloaded the github package, but where do i place the folder so emby settings recognizes it as a skin? or is there more to it than that? thanks!

guess it helps reading the instructions carefully, ha ha.... anyway, was able to fork the skin and install it as a plugin, now comes the fun part, doing some editing/modding... the thing is, the plugin lost the user id / settings icon in the top right hand corner, circled in yellow, it's gone, any thoughts? thanks!

 

image.jpg

any way to add the github to notepad++ in order to edit/mod on the fly?

1. any way to add a custom.css file to a fork, which would override other css files, like the web app css tool?

 

2. any way to refresh app while open so changes will display, rather than having to close and reopen app? keymap?

guess it helps reading the instructions carefully, ha ha.... anyway, was able to fork the skin and install it as a plugin, now comes the fun part, doing some editing/modding... the thing is, the plugin lost the user id / settings icon in the top right hand corner, circled in yellow, it's gone, any thoughts? thanks!

 

image.jpg

 

not sure what else i can try to get this to work properly.... installing the forked skin plugin from the settings panel works fine, goes smoothly, but as soon as i back out of the settings the search bar and user icon / settings disappear from the top right hand corner as the forked skin is installed, as if i have signed out.... of course when this happens i can no longer use any app settings....

November 2019

S M T W T F S
     12
3456789
10111213141516
1718192021 22 23
24252627282930

Recent Comments