We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to add the custom icon, change the link text and hide the Copy button in GetLink dialog

Platform: Dashboard Platform |
Control: Dashboard SDK

Customizing GetLink dialogue window

To add the custom icon in the dashboard viewer for Get Link, customize the text in Get Link Dialog and remove the Copy button features, follow the given steps:

Add the custom icon for Get Link in dashboard viewer

To add the custom icon in the dashboard viewer through its banner, use the ‘beforeDashboardIconRendered’ event as shown in the following code snippet:



            .e-dbrd-banner-customIcon{           // here the new class for custom icon either through font icon or your icon image.
                      font-family: 'dashboardviewer_font'; //Or your own font if you prefer.
                      color: #6d6e70;
                    padding: 11px;
                   width: 40px;
                  height: 40px;
                  cursor: pointer;
                float: right;
                 margin-right: 2px;
                color: red;
              content: 'II';
              font-size: 18px;


<script type="text/javascript"> 
    $(function (e) { 
            Serviceurl: "", // service URL 
            dashboardPath: "", // Dashboard file path
            beforeDashboardIconRendered: function (args) { 
                var headerIcons=args.iconsinformation; 
                headerIcons.push(({classname : "e-dbrd-banner-customIcon e-dbrd-hoverable e-dbrd-bannerIcon",removeClass:"e-dbrd-banner-icons e-dbrd-hoverable",name: "", role: ""}));  // add a new custom icon in the Dashboard banner 
                     } , 
                onBannerIconClick: CustomIcon  


The following screenshot illustrates the result of the above code snippet:









Custom icon added dashboard in viewer

To show the customized link text in Get Link dialog


Add the following code snippet to change the link text which will appear in the Get Link dialog.


function CustomIcon(args){ 
        var dashboardObj = $("#dashboard").data("ejDashboardViewer"); 
        $('#' + dashboardObj._id).find('.e-share-text').val("test link");  // add your custom link in the highlighted text. Which appear on the Dialog popup.  


Get Link pop-up with modified text can be shown as:


Change the Get Link text



To remove the Copy button in the Get Link dialog


Follow the steps to hide the copy button in Get Link pop-up.


Dashboard Embedded using Dashboard Platform SDK:

In Index.html file,

                display: none !important; // hide the link icon  








The following screenshot illustrates the result of the above code snippet:

Removed the copy button in Get link window



Dashboard in Dashboard Server:


Add the following code snippet in the Index.cshtml of the Dashboard Server, which is available at the below location:


C:\Syncfusion\Dashboard Server\DashboardServer.Web\Views\FileRender\Index.cshtml 


# get_item_link .get-link-body #item-link-copy{  
        display: none !important;  
# get_item_link .get-link-body #item-link{  
         width: 97% !important;  
         border-radius: 4px !important;   











The following screenshot illustrates the result of the above code snippet:

A screenshot of a cell phone

Description generated with very high confidence







You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile