javascript - Add custom button to gmail inbox with chrome extension - Stack Overflow

admin管理员组

文章数量:1420213

I'm trying to develop a chrome extension to interact with an email inside gmail inbox. Currently I'm using page action to show the icon of the extension and when user clicks on the icon, the plugin assumes the opened page is an email inside gmail inbox and it interacts with the email.

But it seems to be better if I can add a button to gmail web interface instead of the page action icon like below (notice the add button added by a plugin called todoist).

One way to do this is to observe html in other buttons provided by gmail, and injecting a new button with the content script. But the classes used in elements in gmail seems to be have no verbal meaning and not sure the classes change dynamically. For example to define an icon, the html is like below.

<div class="ase T-I-J3 J-J5-Ji"></div>

Injecting may not work if the classes are changing dynamically. Also the button structure may change if the user changes different themes. (Or may be they are always the same and I can continue injecting)

Is there a standard way to do this? Or else, a stable way to inject the button?

Note: Contextual gadgets is not a solution as I want to get the attachment.

I'm trying to develop a chrome extension to interact with an email inside gmail inbox. Currently I'm using page action to show the icon of the extension and when user clicks on the icon, the plugin assumes the opened page is an email inside gmail inbox and it interacts with the email.

But it seems to be better if I can add a button to gmail web interface instead of the page action icon like below (notice the add button added by a plugin called todoist).

One way to do this is to observe html in other buttons provided by gmail, and injecting a new button with the content script. But the classes used in elements in gmail seems to be have no verbal meaning and not sure the classes change dynamically. For example to define an icon, the html is like below.

<div class="ase T-I-J3 J-J5-Ji"></div>

Injecting may not work if the classes are changing dynamically. Also the button structure may change if the user changes different themes. (Or may be they are always the same and I can continue injecting)

Is there a standard way to do this? Or else, a stable way to inject the button?

Note: Contextual gadgets is not a solution as I want to get the attachment.

• javascript
• html
• google-chrome
• google-chrome-extension
• gmail

Share Improve this question Follow edited Jun 20, 2020 at 9:12 CommunityBot 111 silver badge asked Aug 8, 2015 at 3:14 Sampath LiyanageSampath Liyanage 4,89622 gold badges3131 silver badges4141 bronze badges 2

• 1 indeed the classes and ids m change very regularly and you wil have to spend time constantly patching it. the gmail page changes often. – Zig Mandel Commented Aug 8, 2015 at 4:12
• The button divs have an act attribute which might contain a relatively permanent action ID. – woxxom Commented Aug 8, 2015 at 11:02

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You should use gmail.js add_toolbar_button method using this you can add a custom button in Gmail inbox.

gmail.tools.add_toolbar_button('content_html', function() {
  // Code here
}, 'Custom Style Classes'); 

There are various helper methods through this you can easily build an extension top on Gmail Inbox.

You can also use InboxSDK to inject buttons in Gmail. Code snippet:

InboxSDK.load(1, 'YOUR_APP_ID_HERE').then(function(sdk){
  sdk.Compose.registerComposeViewHandler(function(poseView){
    console.log("pose view exists!");
  });
});

I know this question is 4 years old but this tool could be useful for someone who is looking for a solution to inject buttons in gmail.

本文标签： javascriptAdd custom button to gmail inbox with chrome extensionStack Overflow