How to use an ootb widget specifically for a topic page within the new version of Employee Service Center?

Yusuf3
Tera Contributor

Hi,

Our customer has been using a filtered Simple List widget in Service Portal to publish their knowledge articles which are in "Urgent News" category. Basically, the widget shows 5 entries from kb_knowledge.list filtered by category and valid to values. 

Within the new version of Employee Center, we have multiple topics on the mega menu and each topic page has ootb widgets. Whenever something is published to a specific topic page, the content appears in widget of that topic page, not others. For example a video.

The question, how can I use the Simple List widget (or others) especially for one topic page?

7 REPLIES 7

Rob Sestito
Mega Sage

Hello,

I think I am following you with what you are trying to do, but need to ask a question to try and clarify a bit more.

Are you saying, that when you connect an article to a child topic, that article is being displayed in both the child topic and parent topic pages?

For example: I have a child topic called Payroll & Taxes - which is connected to Payroll & Compensation - which that is connected to Ask HR (our parent topic).

find_real_file.png

When I go into Payroll & Taxes, I have several different articles connected as Connected Content:

find_real_file.png

When I go to both Payroll & Taxes topic page, I see all these articles connected. If I go one page back (up), I see the same articles attached:

find_real_file.png

find_real_file.png

find_real_file.png

Articles are displayed on both topic pages, due to the taxonomy connection they have when being connected.

Is this what you are trying to avoid?

If I am way off, I apologize!

Thanks,

-Rob

ChrisBurks
Mega Sage

Many of the OOB widgets have options.
Once you place a widget on the page you can use the Edit icon (pencil) when on the page designer or if on the rendered page you can use Ctrl + Right-click on the widget area then choose Instance Options to configure the widget.

For example the Simple List widget in order to display only the knowledge articles based on category (kb_category) I would open up the options for that widget instance and set a filter on it to match.

find_real_file.png

 

find_real_file.png

 

For the Simple List widget or any widget that uses the Condition Filter as an option I think opening it in the Platform UI is an easier configuration.

find_real_file.png

However, not all OOB widgets will have options. Sometimes you have to look at what the widget is looking for. Sometimes the widget looks for parameters set on the URL such as sys_id parameter, a table parameter, maybe both or more.

But it depends on the widget.

 

 

Yusuf3
Tera Contributor

@ChrisBurks and @Rob Sestito ,

 

Thanks for your answers, but these are not the thing I am looking for.

 

Let me explain more, basically we have default placed widgets on the new portal (Employee Service Center) and from the Mega Menu widget we can go across all the topics. All those taxonomy topics use the same page which is called "emp_taxonomy_topic". When we want to publish anything for a specific topic page, we can manage that in Content Publishing and the content will appear only on the chosen page. But when I add a new widget to a specific topic page, let's say "Payments", the widget appears on all topic pages because they have a common page. You can see an example below.

 

So, the question is how can we add new widgets to specific topic pages? Do we have to clone and modify or is there any different way?

 

Thanks.

 

IT Topic Page

find_real_file.png

HR Topic Page

find_real_file.png

Ah I see. You want different widgets to appear based on what topic is being displayed.

On way of doing this is creating a widget that embeds the different OOTB widgets. And have the created widget display the desired widget based on the topic that is picked.

Below is some pseudo code/example

HTML template

<div class="panel panel-body">

    <div ng-if="data.topic == 'first_topic'">
      <sp-widget widget="data.ootb_widget_1"></sp-widget>
    </div>

    <div ng-if="data.topic == 'second_topic'">
      <sp-widget widget="data.ootb_widget_2"></sp-widget>
    </div>

</div>

 

Server script

function(){
    //here I am assuming that the topic is a parameter on the url
    //it could be the displa value or a sys_id. Adjust as needed
    data.topic = $sp.getParameter('topic');

    //OOTB widget might need options to display. Here create those options
    //how many props depend on the ootb widget
    var specificOptions = {
         prop1: "option value",
         prop2: "option value"
    }

    data.ootb_widget_1 = $sp.getWidget('ootb_widget_id', specificOptions);


    var specificOptions2 = {
         prop1: "option value",
         prop2: "option value"
    }
 
    data.ootb_widget_2 = $sp.getWidget('ootb_widget_id', specificOptions2);
    

}

 

That's a rough basic example not tested but should give you an idea of one possible way of doing what you need.