Library > Skin

Skin

A skin is displayed as a background on which video, image, and ticker play. CMS server provides some templates (skins) for you to create attractive presentations easily. You can also create your own skins either online via CMS' management user interface or offline on your computer. In this section, we will introduce how you can manage Skins in LIBRARY > Skin page.

Select a group first and you can manage the Skin that is assigned to this group.

Files & Folders

Add a New Skin

  1. Click Add New SkinAdd New Skin; then the system will open the online Skin Editor.
  2. You can create a completely new skin from scratch or click Open a Template Open a Template to modify configurations based on an existing skin file.
  3. Fill in the Name and Description.
  4. Add a resolution. Click Add Resolution in Resolution window at the upper left corner and you will see a pop-up window. Please select a resolution in the drop-down menu and choose a screen orientation.
    Note

    The skin only applies to those resolutions that you pre-edit by CAYIN Skin Editor. So we suggest you to edit all possible resolutions, in case you need to use the skin in different situations with different screen resolutions.

  5. Click Save; then you will see one resolution is shown in the Resolution window. You can also see an area with a black background that matches with the resolution you choose. You can repeat step 3 if you need to add more resolutions.
  6. Edit the background and each zone
    Now, you can start to edit the background and each zone. At the bottom left corner, you will see a small window containing all zones and background options.
  7. You can change the background color for your skin. Just click on the Background icon and choose the color you want. You can also import your own background image.
  8. Then choose which zones you want to edit. For example, if you want to edit a multimedia zone, please click the checkbox in front of Multimedia-1 in the Zone window and you will see the Multimedia-1 zone being enabled enabled. Then drag and drop an area on the background image. When it is done, you can see an area with a multimedia icon in it. If you want to disable a zone, just click the icon enabled again, and the zone will be grayed out.
    Note

    For Multimedia, Image, Ticker and HTML/Flash zones, you cannot start the setting with zone 2. You must finish configuring zone 1 before you can move on to zone 2.

  9. For Clock settings, please enable the clock zone first and click the clock option Clock option. Then you can see all available clocks. Select a clock design and a suitable size and click CLOSE. Then place the clock zone at any location you want.
  10. If you want to adjust the size of each zone, just click the zone you want to adjust and move your cursor to the edge of that zone. When you see the arrow, please left click your mouse and drag to the size you want. You can also type the coordinate value in the columns on the upper side toolbar to change the zone size. If you want to move a specific zone, just drag and drop the zone to the place you want.
  11. If you add more than one resolution to this skin, please select other resolutions from the upper left Resolution window and start over the configuration process.
    Note

    You may find in some zoom ratios, the quality of the background image seems not good. The image preview window is for reference only. It will not affect the final quality of published skin files.

  12. After completing all configurations, click Save or Save as to save your skin file (.csk).
    Note

    If you use "Open a Template" to edit this skin and want to keep the original skin file, you need to click Save as. The original skin will be completely replaced by this new skin if you click Save in this case.

The following table summarizes the main functions of the toolbar.

Icon Name Introduction
Zoom in/Zoom out Enlarge or reduce the view of a skin
1:1 Display the skin in the actual size
Fit Fit a skin to the screen
Align Top/ Bottom/ Left/ Right Arrange selected zones to align top, bottom, left or right with each other. Click a zone first and press Ctrl to select other zones.
Position Adjust the coordinate value of the upper left corner of the selected zone
Width/Height Adjust the size of each zone you add in the skin
Back to Top

Manage Existing Skins

Preview Skin

  1. Move your mouse over the Skin that you want to preview. Then you will see a magnifier iconMagnifier icon.
  2. Click the Preview icon; then you will see a pop-up window with detailed information of this Skin.
Preview Image You can see the larger image of this skin. If the skin file (.csk) contains both portrait and landscape layouts, you will also see both portrait and landscape preview images here. The system will mark the suitable one with a blue frame based on the current screen settings.
Skin Name the skin's name
Resolution A skin file can include multiple resolutions. The resolution with an asterisk (*) is the one matches the current screen resolution.
Zone Information You can check the type and size of each zone included in this skin.

Edit Skin

  1. Move your mouse over the Skin that you want to edit. Then you will see a pencil iconPencil icon.
  2. Click the Edit icon; then you will open the online Skin Editor and start to modify the skin.
  3. After you complete editing, click Save or Save as to save the changes.

Delete Skin

  1. Move your mouse over the Skin that you want to delete. Then you will see a trash can iconTrash can icon.
  2. Click the Delete icon; then you can delete the skin from the CMS server.
Back to Top

Upload Skins

You can upload your own skin file to the CMS server.

  1. Click the Upload Skins , Upload Skins Upload button, and you will see a pop-up window.
  2. Click Browse to select the file; then click Upload.
  3. After you upload a skin successfully, you will see that it is shown in the LIBRARY > Skin page.
Back to Top

Export Skins

You can export skins, save them in your PC, and then upload to other SMP players or CMS servers. You can also open those skin files and modify them in Skin Editor.

  1. Click Export Export iconand you will see all skins are shown in the pop-up window.
  2. Please select those skins you want to export and click Export.
    Note

    You can export a Skin to a CSK file or multiple Skins to a CSKS file. The CSKS file can be uploaded to another SMP player or CMS server, but cannot be opened by CAYIN Skin Editor for further modification.

Back to Top

Online Resources

CAYIN may release new skins from time to time. Click Online ResourcesOnline Resources, and you will find more skins here. If you delete any default skins, you can still download them again from Online Resources.

In the upper right corner of the window, you will see the sorting function. You can sort Skins alphabetically by the Skin name or sort by upload date. Just click Skin Name or Upload Date to do it.

Each skin contains the following information and functions:

Skin Preview You can view the skin preview image here. Click Magnifier icon and you can see the detailed information of this skin.

If you see the downloaded icon below the preview image, it means this skin already exists in the CMS server. Please note that you can only see this icon when you connect to Online Resource directly from a CMS server, not from other entrances.
Name the skin's name
Date the upload date
Downloads how many times this clock has been downloaded
Resolutions the size(s) of this skin
Download
  • Save to PC: Select this function; then you can save the skin file (.csk) to your computer and upload it to CMS server later.
  • Save to CMS: Select this function; then you can save the skin directly into this CMS server (LIBRARY > Skin).
Back to Top