how to show instruction with image after install google workspace extension

We've published our Google Sheets add-on, but new users often don't know how to access the extension after installing it. Currently, this is what we show by default, but I'm not sure how to change it.

I've noticed that some add-ons include an image with instructions like this one. How can I achieve that? THIS IS WHAT I WANT.

Thanks!

Relevant docs:

• https://developers.google.com/apps-script/manifest
• https://developers.google.com/apps-script/manifest/editor-addons
• https://developers.google.com/workspace/add-ons/concepts/homepages

Gemini suggested a possible solution, but it conflicts with the manifect structure. Adding onInstallation to appsscript.json

{
  "manifestVersion": 2,
  "name": "My Addon",
  "description": "A sample addon that displays a custom message on installation.",
  "developerMetadata": {
    "supportsDomainWideInstallation": false
  },
  "oauthScopes": [
    "https://www.googleapis.com/auth/spreadsheets"
  ],
  "iconUrl": "https://www.example.com/icon.png",
  "onInstallation": {
    "type": "message",
    "message": "Thank you for installing My Addon!\n\nTo get started, follow these steps:\n1. Click on the addon icon in your Sheets sidebar.\n2. Select the 'Instructions' tab.\n3. Follow the instructions on the page.",
    "image": {
      "url": "https://www.example.com/instructions.png"
    }
  }
}

results in an error: "Invalid manifest, unknown fields: homepageUrl, onInstallation."

another option by LLM, added to manifest.json which is not the case i want. IT SHOW ON THE RIGHT HANDSIDE OF THE TOOLBAR. I WANNA ITSHOW ON THE EXTENSION MENU , AND SHOW A PICTURE AFTER INSTALLED JUST LIKE PICTURE 2.

"addOns": {
    "common": {
      "name": "XCelsior AI: GPT for Sheets",
      "logoUrl": "https://your-logo-url.com/logo.png",
      "useLocaleFromApp": true,
      "homepageTrigger": {
        "runFunction": "showPostInstallTip"
      }
    },

There are two types of addons:

• Editor addons
• Workspace addons

Editor addons usually work with creating menu items in Extensions menu > Add ons

Workspace addons, on the other hand, create a icon/button in the sidebar.

It seems a editor addon was created, but it was published as a workspace addon, giving you the interface instructions as shown in your screenshots. addOns key inside the manifest is used to configure a Workspace addon. Restructure your manifest to remove the addOns key and it's values and republish to the marketplace. If there are any specific marketplace settings, you may need to change that as well. Once marketplace recognises it as a editor addon, you should have the interface you're looking for.

As noted by no7dw in the comment below,

turn out it could be config on google cloud console-> enable APIs and service-> app configuration -> App integrations -> uncheck Google workspace add-on