Building Your First Enhancement using the SDK

Monday, Nov 30th, 2015

Mixmax is a communications platform that brings professional communication & email into the 21st century.

This post is part 4 in an engineering blog series about building on top of the Mixmax SDK. See part 1, part 2, and part 3.

Mixmax is a powerful email platform that brings the power of the web to your email authoring experience. Our Enhancements bring complex workflows - scheduling a meeting, creating a survey, formatting a code sample - directly to the email without ever leaving your compose window.

Today we’re going to solve another excruciating painpoint around email workflow. One that we’ve all felt every day, and wasted countless hours working around… Embedding a hilarious GIF in your email. That’s right, we’re going to make a Mixmax Enhancement that makes it really easy to search for and embed an animated GIF in your email. Like the previous parts of the blog series building a Slash Command and Link Resolver, we’re continuing with the Giphy theme. This time we’re building the full-on Mixmax Enhancement.

Fortunately, we’ve open sourced some code to help you get started. Here are the steps:

  1. Ensure that you have git and node (>=0.12) installed on your system
  2. Check out the open source Giphy Mixmax command by running git clone https://github.com/mixmaxhq/giphy-mixmax-app
  3. Inside the directory, run npm install and then npm start. You shouldn’t see any errors and it should say [nodemon] starting `node server.js`
  4. Restart Chrome in a special temporary mode so the self-signed HTTPS urls. See here.
  5. Verify it works by visiting https://localhost:8910/editor in your browser.
  6. Go to Mixmax Integration Settings
  7. Click Add Enhancement and enter the following values. (note that Giphy is already built-in, so we’re calling it My Giphy)
    NameValue
    NameMy Giphy
    Icon TooltipMy Giphy Picker
    Editor URLhttps://localhost:8910/editor
    Resolver API URLhttps://localhost:8910/api/resolver
    Activate API URL(leave blank)

    Adding Giphy Enhancement to the Mixmax Integrations page

Now refresh Gmail, open a new Mixmax compose window, hover over the Enhancement picker and find “My Giphy” at the top. Search for and insert your favorite GIF!

Use cases:

  • anyone at your company can click Internal Knowledgebase in the Enhancement menu to bring up your company’s knowledge base support system, and then insert a link for a customer
  • anyone at your company can click File Ticket in the Enhancement menu to bring up a new support ticket form, and then inserts a public link to it in your email
  • any Mixmax user can find your company’s brand in the Enhancement menu and access your product catalog, and then insert a link in their email to share with friends

Interested in working on an email platform of the future? Email us at careers@mixmax.com and follow us @Mixmax.