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. (Last updated on: November 16, 2018).
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

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:

  1. 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:









  1. 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:




  1. 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:



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







Article ID: Published Date: Last Revised Date: Platform: Control:
8650 04/06/2018 11/22/2018 Dashboard Platform Dashboard SDK
Did you find this information helpful?
Add Comment
You must log in to leave a comment

Please sign in to access our KB

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

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