How to show only single custom category in category widget.

[kaushiki berter]

I have a requirement to show only one custom category  in category widget whenever knowledge base is clicked.

as highlighted only one category should be visible and rest should not display on the page.  I have created a custom category which should be visible on the page and rest oob ones should not be present on the screen. Kindly let me know what script I can add for this in widget. Your help will be really valuable for me as it is an important requirement. I am new to service portal your response will be very helpful for me. Thank you in advance!

.

[James Chun]

Hi @kaushiki berter,

Can you elaborate on why you are doing this?

Are you trying to block access to those articles under the OOB categories for the end users?

Or are you saying those categories should be removed completely?

Of course, the solution will vary depending on the why.

Cheers

[kaushiki berter]

Hi , my exact requirement is to create a new knowledge base, knowledge category and article in a custom portal.

Then whenever knowledge base widget is clicked from the home page of the portal then it should show overall 4 widgets in the page as shown in image. 

first widget should show all keyword in filter and when dropdown is selected then it should show only the custom knowledge base that is required for my portal.

Second widget should show only custom category as per the custom knowledge base.

Third widget should the top-rated article related to custom category.

fourth widget should show most viewed articles from the custom category.

I have to work on scripting part of these widgets.

As it is an urgent requirement and I am new to portal, your help will be highly appreciable.

[kaushiki berter]

for first widget which is responsible for showing the custom   knowledge base and contains filter as ALL-  i have used server side script as-

(function()
{
data.kbBreadCrumbsMsg = gs.getMessage("Knowledge Base");
// Get Knowledge Bases Associated to Portal.
var kbId = $sp.getParameter('kb_id');
var kbArr = [{id: null, title: gs.getMessage("All")}];
data.selectedIndex =0;
data.breadcrumb = [];
// Get Accessible Knowledge Bases Associated to Portal.
var kbIds = $sp.getKnowledgeBases();
data.kbs = kbIds.split(',');
if(data.kbs.length > 1){
data.kbBreadCrumbsMsg = gs.getMessage("All Knowledge Bases");
}
data.kb_knowledge_page = $sp.getDisplayValue("kb_knowledge_page")|| "kb_view";
var kb;
// Specify the sys_id of the knowledge base you want to display
var specificKbSysId = '0b28c9541bc76110f807fc851a4bcb22';
var gr = new GlideRecord("kb_knowledge_base");
if (gr.get(specificKbSysId)){
kb = gr.getDisplayValue("title");
var kbObj = {id: specificKbSysId, title: kb};
kbArr.push(kbObj);
if (kbId == specificKbSysId){
data.selectedIndex = 1;
data.kbName = kb;
}
}
data.kbArr = kbArr;
data.kbId=kbId;
}

)();

client side script as 

function($scope, $location,$rootScope, $timeout) {
/* widget controller */
var c = this;

if (c.data.selectedIndex == 0) //Populate kb_id as null when more onethan KB is associates with Portal and no KB is selected.
$location.search('kb_id', c.data.kbId);
// Update breadcrumbs with knowledge base name
if (c.data.kbId && c.data.kbs.length > 1) {
c.data.breadcrumbs = [{label: c.data.kbName, url: '#'}];
//Add "All Knowledge" link to breadcrumbs only when multiple KBs areassociated to portal.
c.data.breadcrumbs.unshift({label: c.data.kbBreadCrumbsMsg, url:
'?id='+ c.data.kb_knowledge_page});
} else
c.data.breadcrumbs = [{label: c.data.kbBreadCrumbsMsg, url: '#'}];
//Update breadcrumbs
$timeout(function() {
$rootScope.$broadcast('sp.update.breadcrumbs', c.data.breadcrumbs);
});
$scope.selectedKB = c.data.kbArr[c.data.selectedIndex];
//Refresh page by passing kb_id when KB is selected
$scope.changeKB = function (selectedKB) {
$timeout(function() {
if (selectedKB.hasOwnProperty("id")) {
$location.search({kb_id: selectedKB.id, sys_id: null, id:
c.data.kb_knowledge_page, kb_category: null});
}
});
}
}

css

.category-widget {
border: 1px solid $panel-inner-border;

.category-list {
.fa {
margin-right: 5px;
}
.l-h-1_6x {
line-height: 1.6em;
}
a {
width: 100%;
vertical-align: middle;
display: inline-block;
}
.list-group {
margin-bottom: 0;
}
.list-group-item {
padding: 0;
border: 0;
width: 100%;
}
.group-item {
padding: 10px 15px;
}
.group-item-default {
&:hover, &:focus {
background-color: darken($panel-default-heading-bg, 2%);
}
}
.group-item-primary {
&:hover, &:focus {
background-color: lighten($panel-primary-heading-bg, 40%);
}
}
.group-item-success {
&:hover {
background-color: lighten($panel-success-heading-bg, 3%)
}
}
.group-item-info {
&:hover, &:focus {
background-color: lighten($panel-info-heading-bg, 3%)
}
}
.group-item-warning {
&:hover, &:focus {
background-color: $panel-warning-heading-bg
}
}
.group-item-danger {
&:hover, &:focus {
background-color: lighten($panel-danger-heading-bg, 3%)
}
}

.sub-category-list {
.list-group-item {
background-color: inherit;
}
}

.list-bg-default {
border-left: 15px solid $panel-default-heading-bg;
}
.list-bg-primary {
border-left: 15px solid lighten($panel-primary-heading-bg, 43%);
}
.list-bg-success {
border-left: 15px solid lighten($panel-success-heading-bg, 6%);
}
.list-bg-info {
border-left: 15px solid lighten($panel-info-heading-bg, 6%);
}
.list-bg-warning {
border-left: 15px solid lighten($panel-warning-heading-bg, 3%);
}
.list-bg-danger {
border-left: 15px solid lighten($panel-danger-heading-bg, 6%);
}

.list-bg-default {
background-color: $panel-default-heading-bg;
}
.list-bg-primary {
background-color: lighten($panel-primary-heading-bg, 43%);
}
.list-bg-success {
background-color: lighten($panel-success-heading-bg, 6%);
}
.list-bg-info {
background-color: lighten($panel-info-heading-bg, 6%);
}
.list-bg-warning {
background-color: lighten($panel-warning-heading-bg, 3%);
}
.list-bg-danger {
background-color: lighten($panel-danger-heading-bg, 6%);
}
}
}
.panel-primary .badge {
background-color: $panel-primary-heading-bg;
color: white;
}
.panel-default .badge {
background-color: $panel-default-text;
color: white
}
.panel-success .badge {
background-color: $panel-success-text;
color: white;
}
.panel-info .badge {
background-color: $panel-info-text;
color: white;
}
.panel-warning .badge {
background-color: $panel-warning-text;
color: white;
}
.panel-danger .badge {
background-color: $panel-danger-text;
color: white;
}
.category-list .badge {
text-align: right;
}
.text-default {
color: $text-muted;
}
.select2-choice {
border-radius: 0px;
padding-left: 15px;
}

html

div ng-if="c.data.kbArr.length > 2" ng-class="{'hidden-xs' :
hideCategoryWidgetInXS}" class="panel panel-{{::options.color}}
category-widget no-border">
<div class="panel-primary panel-heading">
<h2 class="h4 panel-title" ng-bind="::c.options.title">
</h2>
</div>
<ul class="list-group category-list" role="list" aria-label="${Catalogs}">
<li role="listitem" class="list-group-item text-overflow-ellipsis"
ng-include="'kb-template.html'"></li>
</ul>
</div>
<script type="text/ng-template" id="kb-template.html">
<!-- 0b28c9541bc76110f807fc851a4bcb22 -->
<select class="sn-select-basic" ng-change="changeKB(selectedKB)"
ng-model="selectedKB" ng-options="kb.title for kb in c.data.kbArr |
filter: {id: '0b28c9541bc76110f807fc851a4bcb22'}"></select>
</script>

But now it is not even showing that widget as it is not working properly. Kindly help.