Problem

From a modern page, you have linked a ShortPoint element to another page and you have selected the light-box option, but after saving the page and clicking the linked element, the browser navigates to the new page without opening the light-box.


Reason

In modern SharePoint, a user's click is being intercepted before it gets to ShortPoint. So by default, in modern pages, the SharePoint platform sends you to a new page before our code gets the chance to respond to the users click.


Solution

Please follow the steps below to fix the issue:


1. Open ShortPoint's modern Themebuilder on your site


2. In Themebuilder, navigate to Utilities > Custom Javascript


3. Copy the Javascript code below

/* Begin lightbox in modern page fix */
!function() {
  function ecallback(e) {
    var target = e.target;
    
    if (target.className.indexOf('shortpoint') > -1 ) {
      
      var n = 6, parent = target, linkFound = false;
      while (n > 0) {
        if (parent instanceof HTMLAnchorElement) {
          n = 0;
          linkFound = true;
          break;
        }

        parent = parent.parentElement;
        --n;
      }

      if (linkFound) {
        var shortpointData = null;
        while (!shortpointData) {
          shortpointData = parent.dataset.shortpoint;
          parent = parent.parentElement;
        }
      }
      
      if (shortpointData) {
        var txt = "{" + decodeURIComponent(shortpointData) + "}";
        var json = JSON.parse(txt);

        var type = Object.keys(json)[0];
  
        if (json[type].linking == 'lightbox') {
          shortpoint.$.magnificPopup.open({
            items: {
            src: json[type].link,
          },
            type: "iframe"
          });

          e.preventDefault();
          e.stopPropagation();
          return false;
        }
      }
    }
  }
  
  window.addEventListener("click", ecallback, true)
}();
/* End lightbox in modern page fix */


4. Paste it in the Custom Javascript textarea, see the screenshot below


5. Click Publish


The issue should now be resolved.