CSS "Shortcuts": Hiding Interface Elements

Tutorials, technical documents and downloads

Advanced Customization

Rev. Oct. 15, 2016

Description

A list of CSS rules you can use to hide interface elements in WS.WebTV.

Tutorial requirements

• Basic CSS Knowledge.

Here you will find an extensive list of CSS rules you can use to hide elements from the WS.WebTV interface.

Where/How to include the CSS rules?

There are two possibilities:

1. The advanced one: By editing the CSS files of your current style. For this case, look for the rules inside the corresponding CSS file and "uncomment" them (it is not necessary to add them since they are already included).

2. The easy one: By entering the CSS rules into Configuration > General tab > "Additional HTML code" section.
Tab: Configuration, General
...
Configuration, General: Additional HTML code
To include one or more rules, into this section, start by adding <style> and </style> tags into the "<head> section HTML code" text area., then enter the rules whithin the <style> tags (and Save...). Example:
<style>
.videoPlayerArea .clipOptionBt.comments { display:none; } /* Hide "Comments" button */
.videoPlayerArea .clipOptionBt.like { display:none; } /* Hide "Like" button */
.videoPlayerArea .clipOptionBt.dislike { display:none; } /* Hide "Disike" button */
.videoPlayerArea .clipOptionBt.share { display:none; } /* Hide "Share" button */
</style>

Sample CSS rules... (applicable only to "V2" visual Theme)

Video Player area: Hiding option buttons...
.clipOptionsBarWrapper { display:none; } /* Hide all the buttons: comments, like, dislike and share */
.clipOptionsBarWrapper .clipOptionBt.comments { display:none; } /* Hide "Comments" button */
.clipOptionsBarWrapper .clipOptionBt.like { display:none; } /* Hide "Like" button */
.clipOptionsBarWrapper .clipOptionBt.dislike { display:none; } /* Hide "Disike" button */
.clipOptionsBarWrapper .clipOptionBt.share { display:none; } /* Hide "Share" button */

Video Player area: Hiding info...
.clipPublishStatsInfo { display:none; } /* Hide the whole bar (published by, date, views, rating) */
.clipPublishStatsInfo .publishInfo.by { display:none; } /* Hide "Published By" */
.clipPublishStatsInfo .publishInfo.date { display:none; } /* Hide the date */
.clipPublishStatsInfo .publishInfo.views { display:none; } /* Hide the views */
.clipPublishStatsInfo .statsInfo { display:none; } /* Hide the rating */

Sharing Area: Hiding social widgets...
.shareOptions.box { display:none; } /* Hide share area */
.shareOptions.box .socialWidgets { display:none; } /* Hide all social widgets */
.shareOptions.box .socialWidgets .socialWidget.facebook { display:none; } /* Hide the Facebook widget */
.shareOptions.box .socialWidgets .socialWidget.google { display:none !important; } /* Hide the Google Plus widget */
.shareOptions.box .socialWidgets .socialWidget.twitter { display:none; } /* Hide the Twitter widget */

Lists: Hiding the "stikers"...
.stickers { display:none !important; } /* Hide all stickers */
.stickers .stickerFeatured { display:none !important; } /* Hide the "Featured" sticker */
.stickers .stickerRestricted { display:none !important; } /* Hide the "Restricted" sticker */
.stickers .stickerPremium { display:none !important; } /* Hide the "Premium" sticker */

Video Browser: Hiding list elements...
.videoBrowser .clip .image { display:none; } /* Hide thumbnail */
.videoBrowser .clip .title { display:none; } /* Hide title */
.videoBrowser .clip .user { display:none; } /* Hide user */
.videoBrowser .clip .date { display:none; } /* Hide date */
.videoBrowser .clip .views { display:none; } /* Hide views */

Search/Lists: Hiding list elements...
.itemListWrapper.genericList .item .image { display:none; } /* Hide thumbnail */
.itemListWrapper.genericList .item .title { display:none; } /* Hide title */
.itemListWrapper.genericList .item .description { display:none; } /* Hide description */
.itemListWrapper.genericList .item .user { display:none; } /* Hide user */
.itemListWrapper.genericList .item .date { display:none; } /* Hide date */
.itemListWrapper.genericList .item .views { display:none; } /* Hide views */

Lists (Widgets): Hiding list elements...
.widget .item .image { display:none; } /* Hide thumbnail */
.widget .item .title { display:none; } /* Hide title */
.widget .item .description { display:none; } /* Hide description */
.widget .item .user { display:none; } /* Hide user */
.widget .item .date { display:none; } /* Hide date */
.widget .item .views { display:none; } /* Hide views */

Sample CSS rules... (applicable only to "Classic/Default" visual Theme)

Video Player area: Hiding option buttons...
.videoPlayerArea .clipOptionsBarWrapper { display:none; } /* Hide all the buttons: comments, like, dislike and share */
.videoPlayerArea .clipOptionBt.comments { display:none; } /* Hide "Comments" button */
.videoPlayerArea .clipOptionBt.like { display:none; } /* Hide "Like" button */
.videoPlayerArea .clipOptionBt.dislike { display:none; } /* Hide "Disike" button */
.videoPlayerArea .clipOptionBt.share { display:none; } /* Hide "Share" button */

Video Sharing Area: Hiding sharing buttons...
.clipShareArea { display:none; } /* Hide share area */
.clipShareArea .socialWidgets { display:none; } /* Hide all social widgets */
.clipShareArea .socialWidgets .socialWidget.facebook { display:none; } /* Hide the Facebook widget */
.clipShareArea .socialWidgets .socialWidget.google { display:none; } /* Hide the Google Plus widget */
.clipShareArea .socialWidgets .socialWidget.twitter { display:none; } /* Hide the Twitter widget */

Video info: Hiding info...
.clipInfoArea .clipStats { display:none; } /* Hide the whole bar (published, date, views, rating) */
.clipInfoArea .clipStats .publishedBy { display:none; } /* Hide "Published By" */
.clipInfoArea .clipStats .date { display:none; } /* Hide the date */
.clipInfoArea .clipStats .views { display:none; } /* Hide the views */
.clipInfoArea .clipStats .rating { display:none; } /* Hide the rating */

Hiding the Stikers...
.stickersOverlay { display:none !important; } /* Hide all stickers */
.stickersOverlay .stickerFeatured { display:none !important; } /* Hide the "Featured" sticker */
.stickersOverlay .stickerRestricted { display:none !important; } /* Hide the "Restricted" sticker */

Related Videos: Hiding list elements...
.sliderWrapper .clipListWrapper .clipList .clip .image { display:none; } /* Hide thumbnail */
.sliderWrapper .clipListWrapper .clipList .clip .title { display:none; } /* Hide title */
.sliderWrapper .clipListWrapper .clipList .clip .user { display:none; } /* Hide user */
.sliderWrapper .clipListWrapper .clipList .clip .date { display:none; } /* Hide date */
.sliderWrapper .clipListWrapper .clipList .clip .views { display:none; } /* Hide views */

Video Browser: Hiding list elements...
.browseVideosPanel .clipListWrapper .clipList .clip .image { display:none; } /* Hide thumbnail */
.browseVideosPanel .clipListWrapper .clipList .clip .title { display:none; } /* Hide title */
.browseVideosPanel .clipListWrapper .clipList .clip .user { display:none; } /* Hide user */
.browseVideosPanel .clipListWrapper .clipList .clip .date { display:none; } /* Hide date */
.browseVideosPanel .clipListWrapper .clipList .clip .views { display:none; } /* Hide views */

Search: Hiding list elements...
.genericItemListWrapper .itemList .item .image { display:none; } /* Hide thumbnail */
.genericItemListWrapper .itemList .item .title { display:none; } /* Hide title */
.genericItemListWrapper .itemList .item .description { display:none; } /* Hide description */
.genericItemListWrapper .itemList .item .user { display:none; } /* Hide user */
.genericItemListWrapper .itemList .item .date { display:none; } /* Hide date */
.genericItemListWrapper .itemList .item .views { display:none; } /* Hide views */

CSS "Shortcuts": Hiding Interface Elements | Advanced Customization | WS.WebTV Documentation | WebTV Solutions

Professional and affordable online video solutions

Installation and Maintenance

Configuration

Solving Login Problems

Statistics

Content Administration

‹Ext› Adv. Users Manag.

‹Ext› Store

Advanced Customization

Others

Advanced Customization