Open a link via Modal Dialog in SharePoint

In this hint, I will show How to Open a SharePoint link via SharePoint Modal Dialog  (SP.UI.ModalDialog.showModalDialog).

My Scenario :

I have an Operation Site and I want to open the Central Administration Link at its Home Page as a Modal Dialog.


  • From Site Settings > Edit Page.

Edit Page

  • Click on Add web Part > From Media and Content > Add Script Editor or Content Editor if you are using SharePoint 2010.

Script Editor

  • Edit Snippet.

Edit Snippet

  • Add the following code :

< script >
function openDialog(pageUrl) {
var options = {
url: pageUrl,
title: 'Title of the Dialog',
allowMaximize: false,
showClose: true,
width: 500,
height: 500
SP.SOD.execute('sp.ui.dialog.js', 'SP.UI.ModalDialog.showModalDialog', options);
</ script >
<a href="#" onclick="openDialog('http://SharePointSite/Lists/WebEvents/NewForm.aspx');">Central Admin</a>


  • Click Ok > Stop Page Editing.
  • Click On the link that should be shown within a Modal Dialog.


Note : Modal Dialog can only be used to show internal Links within SharePoint, and If you tried to use external link like you will get the following error.

ModalDialog error

Note : You should be aware of SP.UI.ModalDialog.showModalDialog is not working with wiki page link, If you tried this you will get the following error :

Error : Sorry, something went wrong An unexpected error has occurred.

Wiki page with Modal Dialog.gif

SP.UI.ModalDialog.showModalDialog is working only with WepPart Page Link.

Enjoy 🙂


3 thoughts on “Open a link via Modal Dialog in SharePoint

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s