Building the Giphy app using the Mixmax SDK
Monday, Apr 13th, 2015
Mixmax is a communications platform that brings professional communication & email into the 21st century.
Update 10/22/15: The technical information in this post is outdated. See newer post about building this.
The Mixmax SDK allows you to extend the Mixmax platform so users can embed your content inside their email. The Mixmax SDK current offers two types of integrations:
- An “app” that is accessible using the app picker menu. When user selects your app, Mixmax shows your custom URL. Your editor can then inject content into the Mixmax message.
- A “text hook” that allows your app to inject content when the user types specific content. It will call a service URL you provide and replace the user’s text in the editor with your content.
In this post, we’ll focus on the former - Mixmax SDK “apps” - and will discuss text hooks in a later blog post.
If you have Mixmax for Gmail, you’ve already used Mixmax apps. That’s because Mixmax already comes with many great apps: Availability, Q&A Survey, PDF Slideshow, etc. There are many more on the way - we love making apps!
Let’s dive in to the anatomy of a Mixmax app. The entry point for a Mixmax app is the mixmax.json file. It looks like this
When a user clicks the app’s icon, Mixmax will load the app’s “editor” URL in a new browser window. When the user is finished selecting content for your app (e.g. by clicking a “Done” button that you provide), your editor interface use the HTML5 postMessage API to send an object back to Mixmax using the following boilerplate code:
Mixmax will then immediately POST the same payload back to your resolver URL, along with the Mixmax user making the request. To simulate this call using the open source Giphy app running locally, run:
That URL should simply return HTML as a string that will get added to the email. So in the Giphy app’s case, it simply returns:
The HTML is then inserted into the Mixmax email so your users can enjoy. Want to build an app? Reach out to us at email@example.com and let us know what you’d like to build.