After you've got your Hangout app or extension running in the developer sandbox, to make it public for anyone to use, do the following:
- Verify your account at Chrome Web Store by going to Chrome Web Store Developer Dashboard and clicking the "Pay this fee now" link.
- Fill in the fields in the APIs Console by following the instructions at the APIs Console public fields.
Find your Hangout app ID.
Do this by copying the href value from the Enter a
Hangout link at the bottom of the APIs Console. The app ID is the
value assigned to the gadget ID, for example
gid=123456789012; copy this value for use in the next step.
- Create a Hangout button to start your app in a Hangout. To enable users to find your app or extension, create a Hangout button. Then place the button on your website. Users then click on the button to start a Hangout with your public application or extension running inside it.
After a user starts your app or extension, its entry will appear in the Active Apps list on the left of the screen. The description and icons for each entry come from the fields you fill out in the APIs Console.
Active Apps list
The side bar includes buttons for interacting with the Hangout and also lists active app entries. Users can enable an app by clicking its icon in the list. After an app has been enabled, clicking its icon will toggle the visibility of the app in the Hangout. Users can disable the app and remove it from the active list by clicking the X icon next to the app entry. Removed apps are added to the Recent apps list under the ... View more apps button.
Recent Apps list
If the user hovers on ... View more apps, the Recent Apps list will appear next to the Active Apps list.
An app entry is in the Recent Apps list if it was loaded by the user during the current or a previous Hangout, but is not currently loaded. The most recently added apps appear at the top of the list, and the number of entries is limited to a maximum of 20.
A user can remove apps from the list by clicking the trash bin shaped icon on the top right corner of an app's entry.
App and extension picker
If the user clicks the Add apps button, the app and extension picker will appear in the main area of the screen. The user can choose an application or extension from either the Featured or Recent tabs.
Each app has its own picker, which comprises two screens:
- The initial screen includes a 220px x 140px image and a title.
- When the user hovers over the app and extension picker, the 220px x 140px image is replaced by the description of the app, and an icon is added next to the title. The icon used is 32px x 32px for apps and 16px x 16px for extensions. The extension icon is smaller because the Hangout embeds it inside a puzzle piece image.
APIs Console fields
In order to make your app public, go to the APIs Console choose your Hangouts project, click Hangouts in the left menu, and supply the following information.
The URL to your Hangout gadget XML file.
The Hangouts API makes no distinction between an application and an extension; they are different in where they are placed in the Hangout.
- A Hangout application, which is also called main application, is positioned in the main, central area of the screen, above the row of participants, and is visible to all participants.
A Hangout extension is positioned along the right side of the
screen in a left-to-right language or along the left side in a
right-to-left language. If two or more participants
run the same extension, the extensions can share state with each other.
A user can distinguish an extension from a main application in the app and
extension picker by the appearance of the following puzzle piece, with
the extension's 16px x 16px icon shown inside it:
Additional OAuth scopes
Check this box if your application requires additional OAuth 2.0 scopes.
Application title, description and icons
You can specify multiple locales for the title, application description and icons.
For each locale that you wish to translate to, choose the locale, then fill in the application's title, description and icons for that locale. If you do not specify strings and icons for a given locale, participants from that locale will see the 'Default' values.
The name of your application.
This text is important because it will be seen by users who have never run your app. You should clearly describes what the app does.
|Image type||Example||Width (px)||Height (px)||Where the image is used|
|16x16||16||16||The full-color icon that represents your extension in the app and extension picker. When the user hovers over the app button, it changes from the black and white icon to this icon. This icon is not used by applications.|
|32x32||32||32||The full-color icon that represents your application in the Active Apps and in the Recent Apps lists, and in the app and extension picker.|
|220x140||220||140||The initial image that appears in the app and extension picker.|
To make your app public, you must check Make your application available to all users? checkbox and click Save.
Create OAuth 2.0 Client ID
If you haven't already, you must create an OAuth 2.0 client ID before your app goes public.