{"id":291,"date":"2018-08-27T23:22:46","date_gmt":"2018-08-27T23:22:46","guid":{"rendered":"http:\/\/www.projectimmerse.com\/?p=291"},"modified":"2020-06-17T08:29:54","modified_gmt":"2020-06-17T08:29:54","slug":"youtube-auto-loop-a-video","status":"publish","type":"post","link":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/","title":{"rendered":"Youtube Auto Loop a Video"},"content":{"rendered":"<p>I was working on adding a few features to a pet project &#8211; one of them was allowing users to add a youtube video to their profile page. In order to this though, we need to get familiarized with youtube and a few parameters we already know.<\/p>\n<p>A commonly known parameter is autoplay, if we set this to &#8220;1&#8221; &#8211; the youtube video will play automatically on an initial page load.<\/p>\n<p>The general structure is illustrated below, get familiar if you aren&#8217;t already &#8211; this is a pretty cool feature. <\/p>\n<p><!--more--><\/p>\n<p>Note that the following URL will have to be inserted into an iframe and the &#8220;embed&#8221; parameters is needed in order for this to work (well it may work anyway) but this ensures a proper URL for embedding youtube videos to your page.<\/p>\n<p>A basic youtube iframe embed.<\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\r\n&lt;iframe src=&quot;https:\/\/www.youtube.com\/embed\/VIDEO_ID_HASH_HERE&quot; frameborder=&quot;0&quot; height=&quot;400&quot; width=&quot;400&quot; allowfullscreen&gt;&lt;\/iframe&gt;\r\n\r\n\r\n<\/pre>\n<p>This is what it would look like with additional parameters appended to it. <\/p>\n<pre class=\"brush: jscript; title: ; notranslate\" title=\"\">\r\n\r\n&lt;iframe src=&quot;https:\/\/www.youtube.com\/embed\/VIDEO_ID_HASH_HERE?autoplay=1&amp;loop=1&amp;playlist=VIDEO_ID_HASH_HERE&quot; frameborder=&quot;0&quot; height=&quot;400&quot; width=&quot;400&quot; allowfullscreen&gt;&lt;\/iframe&gt;\r\n\r\n<\/pre>\n<p>The VIDEO_ID_HASH_HERE placeholder denotes the hash found on your youtube video. In this example, there are two placeholders. Don&#8217;t get confused, just use the same hash and you&#8217;re good. <\/p>\n<h2>Parameters Explained<\/h2>\n<ul>\n<li>loop=1, enable the video to loop automatically<\/li>\n<li>autoplay=1, enable the video to play on page load<\/li>\n<li>playlist=VIDEO_ID_HASH_HERE, where <video_id> is the youtube hash <\/li>\n<\/ul>\n<p>An important note, the playlist parameter is needed for the video to loop automatically. I wrestled with this for a while but found that both loop=1 and playlist=<video_id> are needed for the autolooping feature to work. <\/p>\n<p>Maybe the folks at youtube are working on changing this, but for now I think this is a pretty good treat. If you&#8217;re looking into utilizing their API, this is also an alternative method. I&#8217;ll be covering that particular topic in a future post. <\/p>\n","protected":false},"excerpt":{"rendered":"<p>I was working on adding a few features to a pet project &#8211; one of them was allowing users to add a youtube video to their profile page. In order to this though, we need to get familiarized with youtube and a few parameters we already know. A commonly known parameter is autoplay, if we &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Youtube Auto Loop a Video&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":1161,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[56],"tags":[],"class_list":["post-291","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programming-fundamentals"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Youtube Auto Loop a Video - Project Immerse<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Youtube Auto Loop a Video - Project Immerse\" \/>\n<meta property=\"og:description\" content=\"I was working on adding a few features to a pet project &#8211; one of them was allowing users to add a youtube video to their profile page. In order to this though, we need to get familiarized with youtube and a few parameters we already know. A commonly known parameter is autoplay, if we &hellip; Continue reading &quot;Youtube Auto Loop a Video&quot;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/\" \/>\n<meta property=\"og:site_name\" content=\"Project Immerse\" \/>\n<meta property=\"article:published_time\" content=\"2018-08-27T23:22:46+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-06-17T08:29:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png\" \/>\n\t<meta property=\"og:image:width\" content=\"750\" \/>\n\t<meta property=\"og:image:height\" content=\"750\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Alex Mercer\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Alex Mercer\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/\"},\"author\":{\"name\":\"Alex Mercer\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\"},\"headline\":\"Youtube Auto Loop a Video\",\"datePublished\":\"2018-08-27T23:22:46+00:00\",\"dateModified\":\"2020-06-17T08:29:54+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/\"},\"wordCount\":369,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/08\\\/looping-a-youtube-video.png\",\"articleSection\":[\"Programming Fundamentals\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/\",\"name\":\"Youtube Auto Loop a Video - Project Immerse\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/08\\\/looping-a-youtube-video.png\",\"datePublished\":\"2018-08-27T23:22:46+00:00\",\"dateModified\":\"2020-06-17T08:29:54+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/08\\\/looping-a-youtube-video.png\",\"contentUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/08\\\/looping-a-youtube-video.png\",\"width\":750,\"height\":750,\"caption\":\"Looping a Youtube Video\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/youtube-auto-loop-a-video\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Youtube Auto Loop a Video\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/\",\"name\":\"Project Immerse\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/#\\\/schema\\\/person\\\/c53f2864be524ee6fa08a7e4800dd1e5\",\"name\":\"Alex Mercer\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/alex-mercer-author-150x150.png\",\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/alex-mercer-author-150x150.png\",\"contentUrl\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/alex-mercer-author-150x150.png\",\"caption\":\"Alex Mercer\"},\"description\":\"Alex Mercer is a writer and contributor at Project Immerse, covering web design, WordPress, web development, SEO, digital strategy, emerging technology, and the evolving world of the web. His work focuses on practical ideas, useful tools, and approachable guidance that help creators, developers, and business owners build better digital experiences. Alex writes with a hands-on, curiosity-driven approach, exploring both established web practices and new technologies shaping how websites are designed, built, and discovered.\",\"sameAs\":[\"https:\\\/\\\/www.projectimmerse.com\"],\"url\":\"https:\\\/\\\/www.projectimmerse.com\\\/blog\\\/author\\\/projectimmerse\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Youtube Auto Loop a Video - Project Immerse","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:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/","og_locale":"en_US","og_type":"article","og_title":"Youtube Auto Loop a Video - Project Immerse","og_description":"I was working on adding a few features to a pet project &#8211; one of them was allowing users to add a youtube video to their profile page. In order to this though, we need to get familiarized with youtube and a few parameters we already know. A commonly known parameter is autoplay, if we &hellip; Continue reading \"Youtube Auto Loop a Video\"","og_url":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/","og_site_name":"Project Immerse","article_published_time":"2018-08-27T23:22:46+00:00","article_modified_time":"2020-06-17T08:29:54+00:00","og_image":[{"width":750,"height":750,"url":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png","type":"image\/png"}],"author":"Alex Mercer","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Alex Mercer","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#article","isPartOf":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/"},"author":{"name":"Alex Mercer","@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5"},"headline":"Youtube Auto Loop a Video","datePublished":"2018-08-27T23:22:46+00:00","dateModified":"2020-06-17T08:29:54+00:00","mainEntityOfPage":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/"},"wordCount":369,"commentCount":0,"image":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#primaryimage"},"thumbnailUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png","articleSection":["Programming Fundamentals"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/","url":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/","name":"Youtube Auto Loop a Video - Project Immerse","isPartOf":{"@id":"https:\/\/www.projectimmerse.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#primaryimage"},"image":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#primaryimage"},"thumbnailUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png","datePublished":"2018-08-27T23:22:46+00:00","dateModified":"2020-06-17T08:29:54+00:00","author":{"@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5"},"breadcrumb":{"@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#primaryimage","url":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png","contentUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2018\/08\/looping-a-youtube-video.png","width":750,"height":750,"caption":"Looping a Youtube Video"},{"@type":"BreadcrumbList","@id":"https:\/\/www.projectimmerse.com\/blog\/youtube-auto-loop-a-video\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.projectimmerse.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Youtube Auto Loop a Video"}]},{"@type":"WebSite","@id":"https:\/\/www.projectimmerse.com\/blog\/#website","url":"https:\/\/www.projectimmerse.com\/blog\/","name":"Project Immerse","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.projectimmerse.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.projectimmerse.com\/blog\/#\/schema\/person\/c53f2864be524ee6fa08a7e4800dd1e5","name":"Alex Mercer","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2026\/09\/alex-mercer-author-150x150.png","url":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2026\/09\/alex-mercer-author-150x150.png","contentUrl":"https:\/\/www.projectimmerse.com\/blog\/wp-content\/uploads\/2026\/09\/alex-mercer-author-150x150.png","caption":"Alex Mercer"},"description":"Alex Mercer is a writer and contributor at Project Immerse, covering web design, WordPress, web development, SEO, digital strategy, emerging technology, and the evolving world of the web. His work focuses on practical ideas, useful tools, and approachable guidance that help creators, developers, and business owners build better digital experiences. Alex writes with a hands-on, curiosity-driven approach, exploring both established web practices and new technologies shaping how websites are designed, built, and discovered.","sameAs":["https:\/\/www.projectimmerse.com"],"url":"https:\/\/www.projectimmerse.com\/blog\/author\/projectimmerse\/"}]}},"_links":{"self":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/291","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/comments?post=291"}],"version-history":[{"count":8,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/291\/revisions"}],"predecessor-version":[{"id":453,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/posts\/291\/revisions\/453"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/media\/1161"}],"wp:attachment":[{"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/media?parent=291"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/categories?post=291"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.projectimmerse.com\/blog\/wp-json\/wp\/v2\/tags?post=291"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}