Show only print button in header

Technical Support
1

Which product are you using?
PDF.js Express Version

I want to customize the header so that only the print icon is visible.

Note: I tried disabling all icons except the print icon but it didn’t work.

I thought of it this way:

const newButton = {
                    type: 'actionButton',
                    img: 'icon-header-print-line',
                    title: 'action.print',
                    onClick: () => {
                        alert('Printing!');
                    },
                    dataElement: 'printButton',
                }

                    instance.UI.setHeaderItems((header) => {
                    const items = header.update([]); //erase all items
                    header.push(newButton)
                    }

But I don’t know how to show printModal ???

Thanks!!!

3

Hello, I’m Ron, an automated tech support bot :robot:

While you wait for one of our customer support representatives to get back to you, please check out some of these documentation pages:

Guides:APIs:Forums:

4

Hey there,

You’re super close! You can open the print modal with instance.UI.print()

  const newButton = {
    type: 'actionButton',
    img: 'icon-header-print-line',
    title: 'action.print',
    onClick: () => {
        instance.UI.print()
    },
    dataElement: 'printButton',
  }

  instance.UI.setHeaderItems((header) => {
    const items = header.update([]); //erase all items
    header.push(newButton)
  }

Thanks,
Logan

1 Like