@grapecity/gcpdfviewer - custom icons

Posted by: kza on 30 November 2020, 1:33 am EST

  • Posted 30 November 2020, 1:33 am EST

    Hi,
    is it possible to replace all icons in gcpdfviewer by custom icons?
  • Replied 1 December 2020, 7:35 pm EST

    Hi,
    To customize all the icons, we need add all Icons as custom icons and remove the default icons.
    To add the Icon, please use the following code snippet:

    var viewer = new GcPdfViewer("#host");
    viewer.addDefaultPanels();

    var toolbar = viewer.toolbar;
    var toolbarLayout = viewer.toolbarLayout;

    toolbar.addItem({
    key: 'open-page-2',
    icon: { type: "svg", content: '<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="24" height="24" viewBox="0 0 24 24"><path style="fill: #205F78;" d="M20.25 12l-2.25 2.25 2.25 2.25-3.75 3.75-2.25-2.25-2.25 2.25-2.25-2.25-2.25 2.25-3.75-3.75 2.25-2.25-2.25-2.25 2.25-2.25-2.25-2.25 3.75-3.75 2.25 2.25 2.25-2.25 2.25 2.25 2.25-2.25 3.75 3.75-2.25 2.25 2.25 2.25z"></path></svg>' },
    title: 'Open page 2',
    checked: false, enabled: false,
    action: function () {
    viewer.pageIndex = 2;
    },
    onUpdate: function (args) {
    return {
    enabled: viewer.hasDocument,
    checked: false
    }
    }
    });

    toolbarLayout.viewer.default.splice(0, 0, "open-page-2");
    viewer.applyToolbarLayout();


    We also raised a query to find out the easiest way with the internal tracking id DOC-2600 if there is any.

    Regards,
    Manish Gupta
  • Replied 6 December 2020, 4:47 pm EST

    Hi,
    The development team is working on this. We will update you as we get an update on this.

    Regards,
    Manish Gupta
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels