Max Selwyn
ServiceNow Employee

Custom Now Assist skills are powerful—but only if users can access them where they work. This guide walks you through embedding a custom skill directly into a form (using the Requested Item form as an example) with UI Macros, UI Formatters, Script Includes, and the Now Assist Skill Kit. By the end, your skill will run with a single button click, embedded right where agents need it. (This guide assumes you've already created your custom skill; if not, create it first before starting.) 

 

Step 1.  

  1. Navigate to your skill and go to deployment settings, and select the UI action option.  
  2. If you have no created it yet, check the box and select a table (the table doesn’t matter, as the UI action is created but not set to active) 
  3. Click “link to UI Action” 
  4. On the UI Action form, copy the script in the script field. 

Step 2.  

  1. Open an existing Script Include or create a new one.  
  2. Create a new function and paste the script into your function 
  3. In the example the new function begins with “knowledgeNASK: function(){“ 
  4. You can modify the script as needed for your desired output, in my example I set the sysId to a specifc KB article I wanted to reference for my output 
  5. MaxSelwyn_0-1783541922549.png 

 

Step 3.  

  1. Navigate to System UI -> UI Macros  
  2. Create a new record 
  3. Paste the example script into the XML field
  4.  
<j:jelly xmlns:j="jelly:core" xmlns:g="glide"> 
    <j:set var="uid" value="${gs.generateGUID()}" /> 
    <div> 
        <span>Max's custom skill content below:</span><br /> 

        <!-- set button ID and element--> 
        <button type="button" class="btn btn-primary" style="margin:8px 0;" onclick="return runSkill(this, 'answer_box_${uid}');"> 
            Run Skill 
        </button> 

        <!-- hide box until we get result --> 
        <div id="answer_box_${uid}" style="display:none; 
               border:1px solid #ccc; background:#f8f9fa; 
               padding:10px; margin-top:10px; 
               width:100%; max-width:900px; 
               height:300px; overflow-y:auto; 
               white-space:pre-wrap; font-family:monospace; font-size:13px;"> 
        </div> 
    </div> 
 
    <script> 
        function runSkill(btnEl, boxId) { 
            var box = document.getElementById(boxId); 
            if (!box) return false; 
            box.style.display = 'block'; 
            box.textContent = 'Please wait...'; 
            if (btnEl) { 
                btnEl.disabled = true; 
                btnEl.textContent = 'Loading...'; 
            } 
            var ga = new GlideAjax(YOUR_SCRIPT_INCLUDE_NAME); 
            ga.addParam('sysparm_name', 'knowledgeNASK'); 

            //set result from script include to the box 
            ga.getXMLAnswer(function(answer) { 
                box.style.display = 'block'; 
                box.textContent = (answer); 
                if (btnEl) { 
                    btnEl.disabled = false; 
                    btnEl.textContent = 'Run Skill'; 
                } 
            }); 
            return false;
        } 
    </script> 
</j:jelly> 

5. Make sure to update your script include and function name in the example script 

6. Example script “var ga = new GlideAjax(YOUR_SCRIPT_INCLUDE_NAME);” 

7. On your script include form, copy the “API Name” field and place it in quotes 

8. E.g. the example would be “var ga = new GlideAjax('global.maxGlobalUtils');” 

 

9. MaxSelwyn_1-1783541922550.png

 

 10. The function name, line 30 in the above screenshot, should match the “sysparm_name” parameter in your GlideAjax 

11. E.g “ga.addParam('sysparm_name', 'knowledgeNASK');” matches the function name on line 30.  

12. Optionally, you can update the XML with any additional styling you chose 

13. Save your UI Macro 

 

Step 4.  

  1. Navigate to System UI -> Formatters 
  2. Create a new record 
  3. Give your formatter a meaningful name 
  4. In the formatter field, enter the name of your UI Macro followed by “.xml” 
  5. MaxSelwyn_2-1783541922551.png

     

     
  6. MaxSelwyn_3-1783541922552.png

     

     
  7. Select your desired table 
  8. Ensure the “type” field is set to “formatter” 
  9. Save your UI Formatter 

Step 5.  

  1. Navigate to your selected table’s form 
  2. In the banner frame (top gray bar) right click and select Configure -> Form DesignMaxSelwyn_4-1783541922553.png

     

     
  3. In the Form Design new window, drag your formatter to your desired location on the form, in the example I created a new section for my formatter 
  4. MaxSelwyn_5-1783541922554.png

     

     
  5. Save your changes and navigate back to your form 

Step 6.  

  1. Test it out by selecting the “Run Skill” button (or the whatever you renamed it to) 
  2. MaxSelwyn_6-1783541922557.png

     

     
  3. You should see the waiting message while the skill runs 
  4. MaxSelwyn_7-1783541922557.png

     

     
  5. And then the results from your script. In this example, the KB article in my script gives a recipe for a vanilla cake 
  6. MaxSelwyn_8-1783541922558.png

 

Views expressed are my own and do not represent ServiceNow, my team, partners, or customers. 

Version history
Last update:
3 hours ago
Updated by:
Contributors