Show the Share Action on your Page Layouts

A question I received a couple of days ago was if it would be possible to display the share action on a page like the action in the context menu of that page.

Show image

Solution

The solution for this is really simple, all you need to do is creating a hyperlink on the page layout and use a JavaScript function call in the href attribute for the click event.

1
<a href="javascript:sharePage()" title="Share page">Share this page</a>

The function behind this call looks like this:

1
function sharePage() {
2
  EnsureScriptFunc("sharing.js", "DisplaySharingDialog", function () {
3
    var webUrl = _spPageContextInfo.webAbsoluteUrl;
4
    var listId = _spPageContextInfo.pageListId;
5
    var itemId = _spPageContextInfo.pageItemId;
6
    if (typeof webUrl !== "undefined" && typeof listId !== "undefined" && typeof itemId !== "undefined") {
7
      DisplaySharingDialog(webUrl, listId, itemId.toString());
8
    }
9
  });
10
}

This function doesn’t require a lot of code. You’ll just need to be sure that the DisplaySharingDialog function is available, and pass through the following parameters:

• The current URL of the site;
• The list ID of the current page;
• The item ID of the current page. As you can see in the code, these things can be resolved from the _spPageContextInfo object.