Electron and macOS: how to customize the 'About <app>' display panel that pops up when user clicks the 'About <app>' menuItem?

Question

When writing an Electron app, the macOS build provides an "About " menu item as the first item of the first menu 1 . When this is clicked, a small panel pops up displaying app name, version, and copyright if available 2 .

How to customize the contents rendered in the panel?

The Electron menuItem role docs only mentions:

 `about` - Map to the `orderFrontStandardAboutPanel` action.

The apple docs on orderFrontStandardAboutPanel don't provide any insight.

See screenshots, including an example of a customized display panel (via GIMP):

Answer 1

This is not nearly as pretty as what you want, but if you just want to customize the simple built-in About Panel for macOS, Electron does let you customize the text.

You simply call app.setAboutPanelOptions

  /*
    Here's how the "About" dialog is displayed: (applies to macOS only)

    <app icon>
    <applicationName>
    <applicationVersion> (<version>)
    <credits>
    <copyright>
   */
  app.setAboutPanelOptions({
    applicationName: "Name", 
    applicationVersion: "App Version",
    version: "Version",
    credits: "Credits",
    copyright: "Copyright"
  });

Answer 2

I use 'About This App' Window for Electron Apps lib. Simple, easy to implement.

Apparently it is possible to completely customize the content through the use_inner_html option but I haven't had a need to do that so can't speak to how well it works.