Add “Send Link” with URL in hoverpanel / callout

Question

I want to create a custom action within the hover panel / callout in my document libraries, not in the search results.

Standard:

What I've got so far:

I click onto "Sende Link" and Outlook is opening. But I also want to write into the body the link to the item. Ideas how to get this?

Here my script (I placed it into a script editor for testing) for changing the hover panel / callout, but the it is not clickable:

<script>
SP.SOD.executeFunc("callout.js", "Callout", function () {
  var itemCtx = {};
  itemCtx.Templates = {};
  itemCtx.BaseViewID = 'Callout';
  // Define the list template type
  itemCtx.ListTemplateType = 101;
  itemCtx.Templates.Footer = function (itemCtx) {
    // context, custom action function, show the ECB menu (boolean)
    return CalloutRenderFooterTemplate(itemCtx, AddCustomAction, true);
  };
  SPClientTemplates.TemplateManager.RegisterTemplateOverrides(itemCtx);
});

function AddCustomAction (renderCtx, calloutActionMenu) {      
  // Add your custom action
  var editPropUrl = renderCtx.CurrentItem.FileRef;
  var preUrl = _spPageContextInfo.siteAbsoluteUrl;

  calloutActionMenu.addAction (new CalloutAction ({
    text: "Sende Link",
    tooltip: 'This is your custom action',
    onClickCallback: function() 
    {  

       var strTest = buildMailTo('', 'Link zum Dokument', 'Hier der Link zum Dokument \n\n' + preUrl + editPropUrl);
       window.location(strTest);

       console.log('Callback from custom action'); }
  }));
}

function buildMailTo(address, subject, body, preUrl, editPropUrl) {
    var strMail = 'mailto:' + encodeURIComponent(address)
                   + '?subject=' + encodeURIComponent(subject)
                   + '&body=' + encodeURIComponent(body);
    return strMail;
}

</script>

If I go into the line with the link and press return, it recognizes a link and makes one, but I want to get it as a link right from the start.

Ideas?

Answer 1

I kind a got now what I want.

I got the link in the mail without the option to click directly on it.
But after I sent the mail the link is a real hyperlink.

Click on the hoverpanel action and mail:

After sending the Mail:

Here the script:

<script>
SP.SOD.executeFunc("callout.js", "Callout", function () {
  var itemCtx = {};
  itemCtx.Templates = {};
  itemCtx.BaseViewID = 'Callout';
  // Define the list template type
  itemCtx.ListTemplateType = 101;
  itemCtx.Templates.Footer = function (itemCtx) {
    // context, custom action function, show the ECB menu (boolean)
    return CalloutRenderFooterTemplate(itemCtx, AddCustomAction, true);
  };
  SPClientTemplates.TemplateManager.RegisterTemplateOverrides(itemCtx);
});

function AddCustomAction (renderCtx, calloutActionMenu) {      

  // Custom Action Send Mail
  var editPropUrl = renderCtx.CurrentItem.FileRef;
  editPropUrl = editPropUrl.replace(/ /g, '%20');

  var preUrl = _spPageContextInfo.siteAbsoluteUrl;

  calloutActionMenu.addAction (new CalloutAction ({
    text: "Sende Link",
    tooltip: 'Sende einen Link zur Datei',
    onClickCallback: function() 
    {  

       var strTest = buildMailTo('', 'Link zum Dokument', 'Hier der Link zum Dokument \n\n' + preUrl + editPropUrl + '\n\n Grüße');
       window.location(strTest);

    }
  }));
}

function buildMailTo(address, subject, body, preUrl, editPropUrl) {
    var strMail = 'mailto:' + encodeURIComponent(address)
                   + '?subject=' + encodeURIComponent(subject)
                   + '&body=' + encodeURIComponent(body);
    return strMail;
}

</script>

So I am happy with this now.

Shared also a blogpost in english and german now.

Answer 2

I don't think it is possible to create a mailto-link with a predefined body that has HTML in it.

I did some searching: It is not possible, See this question on SO