{"_id":"561805217f74330d00dfd887","parentDoc":null,"project":"5588b8a2f6c18d0d005bba03","user":"5588b847f6c18d0d005bba01","version":{"_id":"5588b8a2f6c18d0d005bba06","project":"5588b8a2f6c18d0d005bba03","__v":16,"createdAt":"2015-06-23T01:38:42.696Z","releaseDate":"2015-06-23T01:38:42.696Z","categories":["5588b8a3f6c18d0d005bba07","5588e9689cfea70d00371df3","5588f5921163180d00b64704","561598b121e9110d0078025a","5616f1c9d170d00d00189306","5616f5c3a410c90d00c6121e","561803dcf8c9632100ac7592","563667280441020d0000e9eb","5642570d9417b40d00c0fcd3","57bf5f02efe0050e00d50bd5","57f53fb368a53b2000e03f0f","57f55187440418170086325a","582e3afa72fd270f0006926d","5841faa973967b0f004b4a2b","58db348aa32c8419002433bb","5a31c9409a6f2000125c079f"],"is_deprecated":false,"is_hidden":false,"is_beta":false,"is_stable":true,"codename":"","version_clean":"1.0.0","version":"1.0"},"__v":8,"category":{"_id":"563667280441020d0000e9eb","__v":3,"pages":["5636695ed209b50d0031e072","56427cbff2d7740d00130c8b","5694aaca953b810d008f9164"],"project":"5588b8a2f6c18d0d005bba03","version":"5588b8a2f6c18d0d005bba06","sync":{"url":"","isSync":false},"reference":false,"createdAt":"2015-11-01T19:25:28.285Z","from_sync":false,"order":5,"slug":"appendix","title":"Other"},"updates":[],"next":{"pages":[],"description":""},"createdAt":"2015-10-09T18:19:13.961Z","link_external":false,"link_url":"","githubsync":"","sync_unique":"","hidden":false,"api":{"results":{"codes":[]},"settings":"","auth":"required","params":[],"url":""},"isReference":false,"order":0,"body":"When a user pastes a link in Mixmax, it gets turned into a link using Mixmax's default link resolver integration. The preview is generated using Open Graph meta tags found in the website's `<head>` tag:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<meta property=\\\"og:title\\\" content=\\\"\\\" />\\n<meta property=\\\"og:image\\\" content=\\\"\\\" />\\n<meta property=\\\"og:description\\\" content=\\\"\\\" />\\n\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nThumbnail images must png, jpg, or gif. Images must also be at least 120px wide and 60px tall.\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Example\"\n}\n[/block]\nSo the following link preview:\n[block:image]\n{\n  \"images\": [\n    {\n      \"image\": [\n        \"https://files.readme.io/DnYNAxCMTo6ZDE1q0XDd_Screen%20Shot%202015-10-09%20at%2011.16.02%20AM.png\",\n        \"Screen Shot 2015-10-09 at 11.16.02 AM.png\",\n        \"581\",\n        \"133\",\n        \"#9e6b4a\",\n        \"\"\n      ]\n    }\n  ]\n}\n[/block]\nis generated by the following open graph tags:\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<meta property=\\\"og:title\\\" content=\\\"Free unlimited email tracking, scheduling, polls, and surveys for Gmail | Mixmax\\\" />\\n<meta property=\\\"og:image\\\" content=\\\"https://mixmax.com/images/microsites/features/entrepreneurs-compose.png\\\" />\\n<meta property=\\\"og:description\\\" content=\\\"Send engaging emails with instant scheduling, free unlimited email tracking, polls, and surveys right in Gmail.\\\" />\\n\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]\nMixmax fetches the website using the user agent `Mixmax-LinkPreview 1.0 (+https://sdk.mixmax.com)`\n[block:api-header]\n{\n  \"type\": \"basic\",\n  \"title\": \"Advanced\"\n}\n[/block]\nIf you'd like a custom preview for Mixmax only (so you don't need to change your existing open graph tags), you can use these special tags. These will be preferred over Open Graph tags.\n[block:code]\n{\n  \"codes\": [\n    {\n      \"code\": \"<meta property=\\\"mixmax:title\\\" content=\\\"\\\" />\\n<meta property=\\\"mixmax:image\\\" content=\\\"\\\" />\\n<meta property=\\\"mixmax:description\\\" content=\\\"\\\" />\",\n      \"language\": \"html\"\n    }\n  ]\n}\n[/block]","excerpt":"","slug":"your-websites-link-preview-in-mixmax","type":"basic","title":"Website preview in Mixmax"}

REST API: Access your Mixmax data

Build a Mixmax Slash Command or Enhancement

Build a Mixmax Sidebar

Embed Mixmax into your website

Other

Website preview in Mixmax

When a user pastes a link in Mixmax, it gets turned into a link using Mixmax's default link resolver integration. The preview is generated using Open Graph meta tags found in the website's `<head>` tag: [block:code] { "codes": [ { "code": "<meta property=\"og:title\" content=\"\" />\n<meta property=\"og:image\" content=\"\" />\n<meta property=\"og:description\" content=\"\" />\n", "language": "html" } ] } [/block] Thumbnail images must png, jpg, or gif. Images must also be at least 120px wide and 60px tall. [block:api-header] { "type": "basic", "title": "Example" } [/block] So the following link preview: [block:image] { "images": [ { "image": [ "https://files.readme.io/DnYNAxCMTo6ZDE1q0XDd_Screen%20Shot%202015-10-09%20at%2011.16.02%20AM.png", "Screen Shot 2015-10-09 at 11.16.02 AM.png", "581", "133", "#9e6b4a", "" ] } ] } [/block] is generated by the following open graph tags: [block:code] { "codes": [ { "code": "<meta property=\"og:title\" content=\"Free unlimited email tracking, scheduling, polls, and surveys for Gmail | Mixmax\" />\n<meta property=\"og:image\" content=\"https://mixmax.com/images/microsites/features/entrepreneurs-compose.png\" />\n<meta property=\"og:description\" content=\"Send engaging emails with instant scheduling, free unlimited email tracking, polls, and surveys right in Gmail.\" />\n", "language": "html" } ] } [/block] Mixmax fetches the website using the user agent `Mixmax-LinkPreview 1.0 (+https://sdk.mixmax.com)` [block:api-header] { "type": "basic", "title": "Advanced" } [/block] If you'd like a custom preview for Mixmax only (so you don't need to change your existing open graph tags), you can use these special tags. These will be preferred over Open Graph tags. [block:code] { "codes": [ { "code": "<meta property=\"mixmax:title\" content=\"\" />\n<meta property=\"mixmax:image\" content=\"\" />\n<meta property=\"mixmax:description\" content=\"\" />", "language": "html" } ] } [/block]