{"id":22877,"date":"2024-09-10T08:31:44","date_gmt":"2024-09-10T15:31:44","guid":{"rendered":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/?p=22877"},"modified":"2024-09-10T10:29:32","modified_gmt":"2024-09-10T17:29:32","slug":"how-asynchronous-link-unfurling-increases-your-microsoft-teams-apps-visibility-and-adoption","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/how-asynchronous-link-unfurling-increases-your-microsoft-teams-apps-visibility-and-adoption\/","title":{"rendered":"Increase your Microsoft Teams app\u2019s visibility and adoption with asynchronous link unfurling"},"content":{"rendered":"<p>A key to viral growth for your Microsoft Teams app hinges on users sharing content from your app within group chats, meetings, and company-wide posts in Teams channels. Widespread sharing boosts engagement among your existing users and captures the attention of potential new users. As they see their coworkers benefiting from your app and enhancing productivity, they\u2019re more likely to install the app themselves, contributing to a virtuous cycle of adoption and usage across the entire organization.<\/p>\n<p>To amplify this cycle and improve user experience, an effective strategy is to boost the visibility and clickthrough rates of shared links from your app by leveraging link unfurling,<strong> now enhanced with asynchronous capabilities!<\/strong><\/p>\n<p style=\"text-align: center;\"><a href=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-demogif.gif\"><img decoding=\"async\" class=\"aligncenter wp-image-22881 size-full\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-demogif.gif\" alt=\"Link unfurling: enriching shared links with your app\u2019s content\" width=\"800\" height=\"450\" \/><\/a><em>Link unfurling: enriching shared links with your app\u2019s content <\/em><\/p>\n<p>Link unfurling enriches hundreds of thousands of links shared by Teams users daily by automatically adding an interactive content preview, showcasing your app\u2019s value and increasing the likelihood of users engaging with the link.<\/p>\n<p>With zero-install link unfurling, viewers can preview content without having installed your app, boosting discovery of its capabilities and motivating new users to click the link and install your app for deeper engagement with the content shared by their trusted colleagues.<\/p>\n<h2>New asynchronous capabilities make link unfurling more effective<\/h2>\n<p><strong><em>&#8220;Asynchronous link unfurling in Microsoft Teams has revolutionized how Atlassian apps deliver content. This feature enables users to experience smoother, faster conversations without delays from loading links, significantly boosting engagement and productivity within our Teams-integrated apps.\u201d<\/em> <\/strong><\/p>\n<p>\u2013 Muthukumar R., Principal Product Manager, Atlassian<\/p>\n<p>Link unfurling has greatly boosted app visibility, and new asynchronous features enhance its efficacy, eliminating the need for users to wait in the compose box for the link to unfurl before sending messages.<\/p>\n<p>Previously, users needed to wait for their link to unfurl in the message compose box prior to sending the message. Now, with asynchronous link unfurling, links automatically unfurl after the message has been sent, greatly increasing the number of links unfurling.<\/p>\n<p style=\"text-align: center;\"><img decoding=\"async\" class=\"aligncenter wp-image-22882 size-full\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-computer-screen-with-a-blue-rose-description-au.gif\" alt=\"Asynchronous link unfurling: unfurling a link in a sent message\" width=\"1920\" height=\"1080\" \/><em>Asynchronous link unfurling: unfurling a link in a sent message<\/em><\/p>\n<p>If you already have link unfurling built into your Teams app, asynchronous link unfurling abilities are enabled by default. So, sit back and enjoy a drink as you show your boss a bump in app visibility and installs without any additional development effort.<\/p>\n<p>If you have not enabled link unfurling yet, the good news is it is easy to implement improving your user experience and boosting your app\u2019s adoption today.<\/p>\n<h2>How to get started<\/h2>\n<h3>Determine what type of link unfurling you need<\/h3>\n<p>With link unfurling for Teams, flexibility is key. Whether your app requires authentication, installation or not, link unfurling allows you to provide a seamless experience for your app\u2019s users.<\/p>\n<p>How do we do it? When a user shares a link in Teams, we first check to see if we can match it to a Teams app to generate a specified preview for it and handle the authentication flow as needed by your app. If the link doesn\u2019t map to a Teams app, then we create a preview of your web site through basic or rich actionable previews.<\/p>\n<p>This illustration shows you a quick view of the different options available for utilizing link unfurling:<\/p>\n<p><img decoding=\"async\" width=\"1816\" height=\"951\" class=\"wp-image-22883\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1.png\" alt=\"A screenshot of a chat Description automatically generated\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1.png 1816w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1-300x157.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1-1024x536.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1-768x402.png 768w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/a-screenshot-of-a-chat-description-automatically-1-1536x804.png 1536w\" sizes=\"(max-width: 1816px) 100vw, 1816px\" \/> To learn more about how to implement link unfurling previews using your Teams app, see <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/link-unfurling?tabs=desktop%2Cdotnet%2Cadvantages#micro-capabilities-for-website-links\" target=\"_blank\" rel=\"noopener\">here<\/a>.<\/p>\n<h3>For Teams app developers: use zero-install link unfurling for your app<\/h3>\n<p>With zero-install link unfurling, whenever one of your links is shared in Teams, your app can automatically unfurl it, showcasing its value and capabilities directly within the conversation, even if the user hasn&#8217;t discovered or installed your app before.<\/p>\n<p>The zero-install link unfurling experience is governed by all Teams admin security policies, which means that if an app is blocked at the tenant level, zero-install link unfurling won\u2019t preview it.<\/p>\n<p>To utilize zero-install link unfurling with your app follow 3 main steps:<\/p>\n<ol>\n<li>Prepare your app, opt-in via manifest\n<ul>\n<li>Set the property supportsAnonymizedPayloads to true in the <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/resources\/schema\/manifest-schema#composeextensions\">manifest schema<\/a>.<\/li>\n<\/ul>\n<\/li>\n<li>Look for the new payload request\n<ul>\n<li>Set your app to handle the new invoke request composeExtension\/anonymousQueryLink in the manifest.\n<ul>\n<li>If your app doesn\u2019t require authentication, send back a response with type\u00a0<em>result<\/em>\u00a0and the unfurled card.<\/li>\n<li>If your app requires authentication, send back a response with type\u00a0as <em>auth\u00a0<\/em>and a welcome card.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<li><em>Create a welcome card (for apps requiring auth only)<\/em>\n<ul>\n<li>Create beautiful welcome cards showing users a preview of your app with placeholder fields that will populate on the card on sign-in, to get more users to discover and learn about your app even before they\u2019ve installed it.<\/li>\n<li>We recommend using\u00a0<a href=\"https:\/\/docs.microsoft.com\/en-us\/microsoftteams\/platform\/bots\/how-to\/authentication\/auth-aad-sso-bots\" target=\"_blank\" rel=\"noopener\">Single sign-on support for bots \u2013 Teams | Microsoft Docs<\/a>\u00a0to create the most light-weight, one-time sign-in experience for your users.<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<p><img decoding=\"async\" width=\"1024\" height=\"443\" class=\"wp-image-22884\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-microsoftteams-image-7.png\" alt=\"Image MicrosoftTeams image 7\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-microsoftteams-image-7.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-microsoftteams-image-7-300x130.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/image-microsoftteams-image-7-768x332.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>For more implementation details see <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/link-unfurling?tabs=desktop%2Cdotnet%2Cadvantages#zero-install-for-link-unfurling\">zero install for link unfurling<\/a>.<\/p>\n<h3>Don\u2019t have a Teams App? Create link previews for your website links<\/h3>\n<p>Even if you don\u2019t have a Teams app, it is easier than ever for you to show rich adaptive cards to unfurl previews of your links.\u00a0By leveraging\u00a0<a href=\"http:\/\/www.schema.org\/\" target=\"_blank\" rel=\"noopener\">schema.org<\/a>\u00a0and using a library of micro-capability templates, you can unfurl rich previews for your links in Teams, using the data you already specify.<\/p>\n<p>Simply specify schema.org metadata related to one of the following types on your website, and we\u2019ll use it show users a rich preview when they share your links in Teams.\u00a0\u00a0Here\u2019s an example of how this works:<\/p>\n<p><img decoding=\"async\" width=\"1024\" height=\"683\" class=\"wp-image-22885\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/example-of-enabling-link-previews-for-your-website.png\" alt=\"Example of enabling link previews for your website links\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/example-of-enabling-link-previews-for-your-website.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/example-of-enabling-link-previews-for-your-website-300x200.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/example-of-enabling-link-previews-for-your-website-768x512.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>We have created several <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/micro-capabilities-for-website-links?tabs=article#micro-capability-templates\">micro-capability templates<\/a> for you to start leveraging this feature.<\/p>\n<p><img decoding=\"async\" width=\"1024\" height=\"496\" class=\"wp-image-22886\" src=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/examples-of-templates-to-start-leveraging-link-unf.png\" alt=\"Examples of templates to start leveraging link unfurling\" srcset=\"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/examples-of-templates-to-start-leveraging-link-unf.png 1024w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/examples-of-templates-to-start-leveraging-link-unf-300x145.png 300w, https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-content\/uploads\/sites\/73\/2024\/09\/examples-of-templates-to-start-leveraging-link-unf-768x372.png 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>Get more information\u00a0<a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/link-unfurling?tabs=desktop%2Cdotnet%2Cadvantages#micro-capabilities-for-website-links\" target=\"_blank\" rel=\"noopener\">here<\/a>\u00a0on how to take advantage of these new previews for your website. To see what your website templates will look like in Teams, just paste a link in Teams and see it unfurl in real-time!<\/p>\n<h2>Start building today<\/h2>\n<p>You\u2019ve already put in the hard work of developing an incredible Teams app or website that your users love. Add link unfurling today to help them spread the good word and accelerate your growth by making your content easier to share and discover.<\/p>\n<h2>Next steps<\/h2>\n<ul>\n<li>Read the Technical documentation &#8211; <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/link-unfurling?tabs=desktop%2Cdotnet%2Cadvantages\">Add Link Unfurling to App Manifest &#8211; Teams | Microsoft Learn<\/a><\/li>\n<li>Try the Step-by-Step Guide &#8211; <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/sbs-botbuilder-linkunfurling?tabs=dev%2Cvs\">Guide to unfurl links in Teams app (13 Minutes to complete)<\/a><\/li>\n<li>Check out the samples &#8211; <a href=\"https:\/\/learn.microsoft.com\/en-us\/microsoftteams\/platform\/messaging-extensions\/how-to\/link-unfurling?tabs=desktop%2Cdotnet%2Cadvantages#code-sample\">Zero install link unfurling Samples<\/a><\/li>\n<\/ul>\n<p><em>Follow us on <a href=\"http:\/\/twitter.com\/microsoft365dev\">X (Twitter) \/ @Microsoft365Dev<\/a>, <a href=\"https:\/\/www.linkedin.com\/showcase\/microsoft365dev\/\">LinkedIn<\/a>, and subscribe to our <a href=\"https:\/\/www.youtube.com\/microsoft365developer\">YouTube channel<\/a> to stay up to date on the latest developer news and announcements.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Learn how to leverage link unfurling for your Microsoft Teams app, now enhanced with asynchronous capabilities.<\/p>\n","protected":false},"author":103201,"featured_media":22901,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[128],"tags":[355,195],"class_list":["post-22877","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-microsoft-teams","tag-asynchronous-link-unfurling","tag-link-unfurling"],"acf":[],"blog_post_summary":"<p>Learn how to leverage link unfurling for your Microsoft Teams app, now enhanced with asynchronous capabilities.<\/p>\n","_links":{"self":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/22877","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/users\/103201"}],"replies":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/comments?post=22877"}],"version-history":[{"count":0,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/posts\/22877\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media\/22901"}],"wp:attachment":[{"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/media?parent=22877"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/categories?post=22877"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/wp-json\/wp\/v2\/tags?post=22877"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}