In Service Portal, we don't get the Copy permalink feature in the KB article that we have in a KB article in the normal desktop view. There are a lot of questions around the same in the community. I wanted to share what we have implemented it using two widgets and wanted to share that with other groups members. This could be further modified to make it a directive etc. but I am going with minimal version.

Steps to add a Copy Permalink Feature:

1. Go to Service Portal -> Widgets -> New

Name: Copy Permalink

Public Widget: True

Then use related link at the bottom of the form Open in Widget Editor

For the HTML Template, add the following code

<div class="panel panel-primary b">
  <div class="panel-heading">
    <h2 class="h4 panel-title" ng-bind="::options.title"></h2>
  </div>
  <div class="panel-body">
     <span ng-click="c.copyPermalink()">{{c.data.linkName}}</span>
  </div>
</div>

For the client side, add the following code

function($scope, $window, $rootScope,spUtil) {
  /* widget controller */
        var c = this;
        var serviceportalURL = c.data.instanceURL + "sp"; 
        // where sp is the service portal URL suffix
    c.data.URL = serviceportalURL + "?id=kb_article&sysparm_article=" + 
    c.data.article.number;

    c.copyPermalink = function() {
        var body = angular.element($window.document.body);
        var inp = angular.element('<input/>');
        inp.val(c.data.URL);
        body.append(inp);
        inp.select();
        try {
            var successful = $window.document.execCommand('copy');
            if (!successful) throw successful;
        } catch (err) {
            $window.prompt("Copy to clipboard: Ctrl+C, Enter", c.data.URL);
        }
    inp.remove();
        spUtil.addInfoMessage("Copied to clipboard");
    }
}

For the Server script, add the following code

(function() {
  /* populate the 'data' object */
  /* e.g., data.table = $sp.getValue('table'); */
    options.title = options.title || gs.getMessage("Permalink");
    data.linkName = gs.getMessage("Copy Permalink");
    data.instanceURL = gs.getProperty('glide.servlet.uri');
    data.article = {};
    var page_sysID = $sp.getParameter("sys_id");
    var article_number = $sp.getParameter("sysparm_article");
    var kbNumber;
    if(article_number) {
          data.article.number = article_number;
        } else if(page_sysID)   {
            var kb = new GlideRecordSecure('kb_knowledge');
            if(kb.get(page_sysID)) {
                data.article.number = kb.getDisplayValue("number");
            }
        }
})();

Save the changes and you can preview it look like

2. Go to Service Portal -> Pages -> Id equal to kb_article i.e. Knowledge Base page

Use the related link at the bottom open the page and add the widget that you created i.e. Copy Permalink the right hand side or wherever you want to add it.

The above widget basically use the URL and extracts the parameter sys_id of the URL to get the number or if we have the URL parameter sysparm_article it would use the number directly from there to create the permalink.

This solves the problem partly but there is another part to it. We need to have a page that covers the following scenarios below:

a. If there is a link like ?id=kb_article&sysparm_article=KB00000XX&sys_id=16f01f3bdb1c17843c4b3511ef9619cb or ?id=kb_article&sysparm_article=KB00000XX in the URL, the page in the portal should be the latest version based on the KB number.

b. if there is a link like ?id=kb_article&sys_id=16f01f3bdb1c17843c4b3511ef9619cb in the URL, the page in the portal should show that version of article.

Currently Kb_article page supports rendering when a sys id is provided. So here our next step begins:

3. Go to Service Portal -> Widgets -> KB Article Page

Clone this Widget and name it KB Article Page Custom or whatever name works for you.

Use the related link at the bottom to the open the widget in Widget Editor.

Go to Server script and replace the following line

articleGR.get($sp.getParameter('sys_id'));

with

if($sp.getParameter('sysparm_article')) {
    articleGR.addQuery('number', $sp.getParameter('sysparm_article'));
    articleGR.addQuery('workflow_state', 'published');
    articleGR.orderByDesc("version");
    articleGR.query();
    articleGR.next();
} else if ($sp.getParameter('sys_id')) {
    articleGR.get($sp.getParameter('sys_id'));
}

So the final version will look like this (screenshot of the change alone)

The code continues further and i have just taken the above screenshot of the area of the code that got changes in the custom cloned widget.

Save the widget changes.

4. Go to Service Portal -> Pages -> Id equal to kb_article i.e. Knowledge Base page

Use the related link at the bottom open the page and replace the main widget in the center column i.e. KB Article Page Custom with the one you created above KB Article Page Custom.

Save all your changes.

Now after you have made the above changes whenever you have sysparm_article in the URL the article shown will be the latest published version. The copy permalink on the right would copy the URL created with sysparm_article into the users clipboard.

The above code could be made more modular and also could be included as dependency.

The final version would look something like below:

On clicking Copy Permalink the URL would get copied to clipboard.