Custom CSS on Public Site

To further customize your CablecastPublicSite, you can use custom CSS.

CSS stands for Cascading Style Sheets. CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work. It can control the layout of multiple web pages all at once.

Disclaimer

Modifying your PublicSite Custom CSS files can result in unexpected behavior. Its only recommended you edit the CSS files if you (or someone else) has experience with CSS formatting.

Modifying your CSS

1. Access your primary server that has the Cablecast Web UI on it. Typically this is your main automation server, (Or, if you have Video On-demand, your VOD server).
2. Navigate to C:\TRMS\Web\CablecastPublicSite
3. Your custom CSS files will be listed as custom-X.css (Where X is your channel ID if you have multiple channels).

Previewing your changes

Once you save your Custom CSS, You may also have to clear your web browser cache files to see the changes.

Common Changes

Cablecast cannot be held responsible for any negative performance changes made by modifying your css to use the following changes/tweaks. These are been base-level tested, but not extensively. Use at your own risk, and perform your own testing upon changing.

Word Wrapping

Sometimes if you have long show titles, your PublicSite will wrap the text and break it in the middle of a word. To resolve this, we can change the a element to use "break-word" instead of "break-all". Add the following to each custom-xx.css file you want to have this change:

a
{
word-break: break-word;
overflow-wrap: break-word;
word-wrap: break-word;
}

Change "Watch" livestream button text

Sometimes you want your livestream "Watch" button to say something else, like, "Watch Live" or "Watch Online". You can make this happen with the following CSS change:

.btn-watch {
position: relative;
}
.btn-watch:after {
content: "Watch Online";
left: 0;
right: 0;
position: absolute;
background-color: #2fb566;
}