{"id":12816,"date":"2022-06-14T19:01:05","date_gmt":"2022-06-14T19:01:05","guid":{"rendered":"https:\/\/userpilot.com\/blog\/embed-loom-video\/"},"modified":"2025-05-19T11:25:54","modified_gmt":"2025-05-19T11:25:54","slug":"embed-loom-video","status":"publish","type":"post","link":"https:\/\/userpilot.com\/blog\/embed-loom-video\/","title":{"rendered":"How to Embed a Loom Video Into Your SaaS Product"},"content":{"rendered":"

Where can you embed a Loom video?<\/h2>\n

Most websites and platforms allow you to embed your Loom video, but in rare circumstances, this may not be possible.<\/p>\n

When embedding a video is not an option, we recommend using a GIF thumbnail, as it\u2019s accepted by most platforms.<\/p>\n

What are the main ways to embed a Loom video?<\/h2>\n

A number of different methods are available for automatically embedding Loom videos on your website, depending on the platform:<\/p>\n

    \n
  1. Direct integrations with Embedly, iFramely and Userpilot – <\/strong>There are common 3rd party services that Loom integrates with directly.<\/li>\n
  2. Loom Chrome extension<\/strong> – If you have the Loom Chrome Extension installed, you have the ability to convert your Loom link into embedded video players for select applications such as Github, Gmail, Jira, Salesforce, and more.<\/li>\n
  3. Loom embed SDK<\/strong> – Developers can use this tool to automatically convert Loom links into embedded video players.<\/li>\n
  4. Embed manually<\/strong>– Copy the code and paste it into your website or product to embed your loom video. This is applicable only if your site supports IFrame embed.<\/li>\n<\/ol>\n

    How to embed your Loom video on any webpage<\/h2>\n

    Once you create the Loom recording you want to use, you’ll need to click \u201cShare\u201d at the top right-hand corner of the screen.<\/p>\n

    \"loom-video-sharing-page\"<\/picture><\/figure>\n

    Select the \u201c Embed\u201d section from the available options, then choose either Responsive size or Fixed Size HTML code and click on the \u201cCopy Embed Code\u201d button.<\/p>\n

    \"loom-embed-code-page\"<\/picture><\/figure>\n

    Paste the code into your website text editor’s HTML block.<\/p>\n

    Once this is done, the Loom recording will be embedded into your webpage.<\/p>\n

    However, the downside is that you may need a developer\u2019s help when embedding a video with this option.<\/p>\n

    How to embed a Loom video in your product experience without a developer<\/h2>\n

    Embedding a video with the help of a developer can be costly and time-consuming.<\/p>\n

    The good news is that there are several product growth tools on the market that can help you integrate your microvideos<\/a> into different UI elements in less than a minute.<\/p>\n

    As mentioned earlier in the article, there are various use cases for in-app videos<\/a>. Here are the most common two options:<\/p>\n

    Embed a Loom video inside a modal<\/strong><\/h3>\n

    You can embed your Loom videos on a pop-up modal<\/a> triggered for specific events.<\/p>\n

    Have a look at Story Chief’s frictional welcome screen<\/a>. The welcome page is built on a modal with a Loom onboarding video<\/a> embedded into it.<\/p>\n

    \"storychief-welcome-screen-embed-videos\"<\/picture>
    Storychief\u2019s modal shows embedded tutorials to help users get started.<\/figcaption><\/figure>\n

    Embed a Loom video inside your resource center<\/strong><\/h3>\n

    Enriching your resource center with video tutorials<\/a> is always a great idea. Once integrated and clicked, the video will be played directly in the app.<\/p>\n

    Userpilot<\/a> has an always-on resource center where users can easily browse through knowledge base articles and video tutorials. Product videos are embedded in relevant sections and are played in-app to provide a seamless experience.<\/p>\n

    Here’s an example of how it works.<\/p>\n

    \"userpilot-resource-center-video-embed\"<\/picture>
    Play in-app video tutorials in the Userpilot<\/a> Resource Center.<\/figcaption><\/figure>\n

    Embed a Loom video using Userpilot – Step by step guide<\/h2>\n

    Any video can be embedded in your product within minutes, thanks to Userpilot<\/a>.<\/p>\n

    There are 2 ways to embed a video using Userpilot: embed code and direct integration between Userpilot and Loom.<\/p>\n

    Option1: Embed your Loom using code<\/h3>\n

    Step 1 – Select a video<\/strong><\/h4>\n

    Go to the video page you want to embed, click on the Share button and then click \u201cCopy Embed Code\u201d.<\/p>\n

    \"embed-loom-video\"<\/picture><\/figure>\n

    Step 2 – Create a UI pattern<\/strong><\/h4>\n

    Use the Chrome extension and select the type of UI pattern you would like your Loom video to be embedded in. You can embed Loom videos in your modals, slide-outs, and tooltips.<\/p>\n

    \"choose-ui-pattern-embed-loom-video\"<\/picture>
    Choose one of the UI Patterns offered by Userpilot<\/a>.<\/figcaption><\/figure>\n

    Step 3 – Embed the code<\/strong><\/h4>\n

    Hover the mouse pointer over the section you want to add your video and click on the ‘+’ button. Then select the \u201cVideo\u201d option from the panel.<\/p>\n

    \"modal-<\/picture><\/figure>\n

    Paste the embed code in the box that just popped up.<\/p>\n

    \"paste-loom-link\"<\/picture>
    Paste the Embed code in the box to display the video.<\/figcaption><\/figure>\n

    You’ll be able to see the video now in the UI element added.<\/p>\n

    Embed your Loom video directly using predefined integrations<\/h3>\n

    You can directly add a video by using Userpilot’s native integration with Loom.<\/p>\n

    Step 1 – Add a new block<\/strong><\/h4>\n

    Once you select the UI pattern (this can be a modal for example), add a new block and select \u201cEmbeds\u201d.<\/p>\n

    \"embed-video-on-a-modal\"<\/picture>
    Embed videos on your product modals using Userpilot<\/a>.<\/figcaption><\/figure>\n

    Step 2 – Select the integration<\/strong><\/h4>\n

    Select Loom from the list of integrations. Once this is set up, the video will be displayed directly in the app.<\/p>\n

    \"userpilot-loom-video-integration\"<\/picture>
    Embed Loom videos in one click thanks to Userpilot<\/a>\u2019s native integration with Loom.<\/figcaption><\/figure>\n

    Conclusion<\/h3>\n

    Creating and sharing Loom recordings is now easy!<\/p>\n

    With multiple options available, you can embed videos in the best way possible and allow customers to watch videos directly in your apps, without interrupting what they are doing and being redirected to another page.<\/p>\n

    Tools like Userpilot<\/a> make it easy to embed videos in one click, without input from a developer. And this ease of creating engaging experiences now extends to mobile. With mobile SDK, Userpilot helps you create targeted onboarding flows using UI patterns like slideouts and carousels, all without writing extra code.<\/span><\/p>\n

    Book a Userpilot demo<\/a> and learn more about how you can enhance your product experience by adding video tutorials in your UI patterns and educational resources.<\/p>\n","protected":false},"excerpt":{"rendered":"

    There are various ways to embed a Loom video into your product experiences. In the article, we discuss all of them and show you how to pick the best one that is most convenient for your SaaS product.<\/p>\n","protected":false},"author":19,"featured_media":12817,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"content-type":"","inline_featured_image":false,"footnotes":""},"categories":[488],"tags":[958,587,959,52,960,843,839],"class_list":["post-12816","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-user-engagement","tag-embed-videos","tag-microvideos","tag-onboarding-flows","tag-product-experience","tag-product-experiences","tag-saas-product","tag-video-onboarding"],"acf":[],"yoast_head":"\nHow to Embed a Loom Video Into Your SaaS Product<\/title>\n<meta name=\"description\" content=\"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Embed a Loom Video Into Your SaaS Product\" \/>\n<meta property=\"og:description\" content=\"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\" \/>\n<meta property=\"og:site_name\" content=\"Thoughts about Product Adoption, User Onboarding and Good UX | Userpilot Blog\" \/>\n<meta property=\"article:published_time\" content=\"2022-06-14T19:01:05+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-19T11:25:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1876\" \/>\n\t<meta property=\"og:image:height\" content=\"1228\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Userpilot Team\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Userpilot Team\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\"},\"author\":{\"name\":\"Userpilot Team\",\"@id\":\"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00\"},\"headline\":\"How to Embed a Loom Video Into Your SaaS Product\",\"datePublished\":\"2022-06-14T19:01:05+00:00\",\"dateModified\":\"2025-05-19T11:25:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\"},\"wordCount\":913,\"commentCount\":0,\"image\":{\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png\",\"keywords\":[\"embed videos\",\"microvideos\",\"onboarding flows\",\"product experience\",\"product experiences\",\"SaaS product\",\"video onboarding\"],\"articleSection\":[\"User Engagement\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\",\"url\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\",\"name\":\"How to Embed a Loom Video Into Your SaaS Product\",\"isPartOf\":{\"@id\":\"https:\/\/userpilot.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png\",\"datePublished\":\"2022-06-14T19:01:05+00:00\",\"dateModified\":\"2025-05-19T11:25:54+00:00\",\"author\":{\"@id\":\"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00\"},\"description\":\"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/userpilot.com\/blog\/embed-loom-video\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage\",\"url\":\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png\",\"contentUrl\":\"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png\",\"width\":1876,\"height\":1228,\"caption\":\"embed-loom-video-into-saas-product\"},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/userpilot.com\/blog\/#website\",\"url\":\"https:\/\/userpilot.com\/blog\/\",\"name\":\"Thoughts about Product Adoption, User Onboarding and Good UX | Userpilot Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/userpilot.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00\",\"name\":\"Userpilot Team\",\"url\":\"https:\/\/userpilot.com\/blog\/author\/_up_marketing\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Embed a Loom Video Into Your SaaS Product","description":"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/userpilot.com\/blog\/embed-loom-video\/","og_locale":"en_US","og_type":"article","og_title":"How to Embed a Loom Video Into Your SaaS Product","og_description":"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.","og_url":"https:\/\/userpilot.com\/blog\/embed-loom-video\/","og_site_name":"Thoughts about Product Adoption, User Onboarding and Good UX | Userpilot Blog","article_published_time":"2022-06-14T19:01:05+00:00","article_modified_time":"2025-05-19T11:25:54+00:00","og_image":[{"width":1876,"height":1228,"url":"https:\/\/userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png","type":"image\/png"}],"author":"Userpilot Team","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Userpilot Team","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/#article","isPartOf":{"@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/"},"author":{"name":"Userpilot Team","@id":"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00"},"headline":"How to Embed a Loom Video Into Your SaaS Product","datePublished":"2022-06-14T19:01:05+00:00","dateModified":"2025-05-19T11:25:54+00:00","mainEntityOfPage":{"@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/"},"wordCount":913,"commentCount":0,"image":{"@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage"},"thumbnailUrl":"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png","keywords":["embed videos","microvideos","onboarding flows","product experience","product experiences","SaaS product","video onboarding"],"articleSection":["User Engagement"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/userpilot.com\/blog\/embed-loom-video\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/","url":"https:\/\/userpilot.com\/blog\/embed-loom-video\/","name":"How to Embed a Loom Video Into Your SaaS Product","isPartOf":{"@id":"https:\/\/userpilot.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage"},"image":{"@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage"},"thumbnailUrl":"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png","datePublished":"2022-06-14T19:01:05+00:00","dateModified":"2025-05-19T11:25:54+00:00","author":{"@id":"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00"},"description":"Learn how to embed Loom videos into your SaaS product with embed code. Use Userpilot and embed videos without a developer.","inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/userpilot.com\/blog\/embed-loom-video\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/userpilot.com\/blog\/embed-loom-video\/#primaryimage","url":"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png","contentUrl":"https:\/\/blog-static.userpilot.com\/blog\/wp-content\/uploads\/2022\/06\/How-to-Embed-a-Loom-Video-Into-Your-SaaS-Product_06571d178b3ec6ec45c5b1fc29344fab_2000.png","width":1876,"height":1228,"caption":"embed-loom-video-into-saas-product"},{"@type":"WebSite","@id":"https:\/\/userpilot.com\/blog\/#website","url":"https:\/\/userpilot.com\/blog\/","name":"Thoughts about Product Adoption, User Onboarding and Good UX | Userpilot Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/userpilot.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/userpilot.com\/blog\/#\/schema\/person\/c23f142272c9525f442450e3db3b3d00","name":"Userpilot Team","url":"https:\/\/userpilot.com\/blog\/author\/_up_marketing\/"}]}},"_links":{"self":[{"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/posts\/12816","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/users\/19"}],"replies":[{"embeddable":true,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/comments?post=12816"}],"version-history":[{"count":3,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/posts\/12816\/revisions"}],"predecessor-version":[{"id":273157,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/posts\/12816\/revisions\/273157"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/media\/12817"}],"wp:attachment":[{"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/media?parent=12816"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/categories?post=12816"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/userpilot.com\/blog\/wp-json\/wp\/v2\/tags?post=12816"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}