{"id":21636,"date":"2014-07-15T15:01:37","date_gmt":"2014-07-15T07:01:37","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=21636"},"modified":"2025-04-04T02:00:23","modified_gmt":"2025-04-03T18:00:23","slug":"html-import","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/html-import\/","title":{"rendered":"How to Include One HTML File Inside Another Using HTML Import"},"content":{"rendered":"<p>HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to <strong>generate HTML dynamically<\/strong>. <strong>HTML Import<\/strong> is a new standard module that aims to make HTML more flexible.<\/p>\n<p>HTML Import allows us to include one HTML file into another HTML file. We can also access and reuse the content inside. This is an exciting new feature that may change the way we build HTML in (perhaps) the next decade.<\/p>\n<p>At the time of this writing, however, HTML Import is still in the Working Draft stage, and Chrome (v36 and above) is the only browser that supports it.<\/p>\n<p>Note that this feature is disabled by default. <strong>To enable HTML Import in Chrome, go to the<\/strong> <a rel=\"nofollow noopener\" target=\"_blank\" href=\"\/\/flags\">chrome:\/\/flags<\/a><strong> page, enable the \u201cEnable HTML Imports\u201d option, and then restart Chrome<\/strong>. Let\u2019s start experimenting with HTML Import.<\/p>\n<div class=\"ref-block ref-block--post\" id=\"ref-post-1\">\n\t\t\t\t\t<a href=\"https:\/\/www.hongkiat.com\/blog\/kit-language\/\" class=\"ref-block__link\" title=\"Read More: A look Into: The Kit Language\" rel=\"bookmark\"><span class=\"screen-reader-text\">A look Into: The Kit Language<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/kit-language.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-19295 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/kit-language.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">A look Into: The Kit Language<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tLet's say you were building prototypes for a website with HTML files. You have about 10 HTML pages...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>How to Use HTML Import<\/h2>\n<p>Including an HTML template is similar to how we include a stylesheet. We use the <code>&lt;link&gt;<\/code> tag, but instead of using <code>rel=stylesheet<\/code>, we use <code>rel=import<\/code>. For example, here I will include a template named <strong>template.html<\/strong> (with a few lines of dummy content added to it).<\/p>\n<pre>\r\n&lt;link rel=\"import\" href=\"template.html\"&gt;\r\n<\/pre>\n<p>Now, if you look at the web page through <strong>Chrome DevTools<\/strong> under the <strong>Network<\/strong> tab, you can see that the browser (Chrome) loads the <code>template.html<\/code>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg\" height=\"180\" width=\"500\" alt=\"HTML template network loading\"><\/figure>\n<p>Keep in mind that the content in the file that is imported is not instantly appended to the main HTML file. When you view the main HTML file, you will see nothing at the moment.<\/p>\n<h2>Reusing Content<\/h2>\n<p>To append the content in the file, we need to write a few lines of JavaScript. Normally, we may put a script within the <code>head<\/code> tag. But in this particular case, we may add the script within the body. Also, for the following script to work, we must put it after the <code>rel=import<\/code>. We need to ensure that the content in <code>rel=import<\/code> has been completely loaded by the browser before the script, so the script can recognize the elements, element\u2019s id, or the classes within that file.<\/p>\n<p>To begin, we select the template file with this code.<\/p>\n<pre>\r\nvar getImport = document.querySelector('link[rel=import]');\r\n<\/pre>\n<p>This will select all the <code>link<\/code> tags with <code>rel=import<\/code>. You may import multiple HTML files and want to select only a specific link tag, you can add an <code>id<\/code> to the link tag and select it using the <code>id<\/code> instead of <code>link[rel=import]<\/code>, as shown above.<\/p>\n<p>For example, assuming you import files like this:<\/p>\n<pre>\r\n&lt;link rel=\"import\" id=\"template-file\" href=\"template.html\"&gt;\r\n<\/pre>\n<p>You can replace the code with:<\/p>\n<pre>\r\nvar getImport = document.querySelector('#template-file');\r\n<\/pre>\n<p>Once the file is selected, we need to select which content we will append to the main file. If you have the content wrapped with an <code>id=\"content\"<\/code>, you can select the content this way.<\/p>\n<pre>\r\nvar getContent = getImport.import.querySelector('#content');\r\n<\/pre>\n<p>Now we can append the content within the <code>body<\/code> using the JavaScript <code>appendChild()<\/code> method.<\/p>\n<pre>\r\ndocument.body.appendChild(document.importNode(getContent, true));\r\n<\/pre>\n<p>The content should now appear in the main file.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/html-import\/appended-content.jpg\" height=\"300\" width=\"500\" alt=\"Appended content example\"><\/figure>\n<p><a href=\"https:\/\/hongkiat.github.io\/html-import\/\" class=\"su-button su-button-style-flat\" style=\"color:#FFFFFF;background-color:#2D89EF;border-color:#246ec0;border-radius:0px\" target=\"__blank\" rel=\"noopener nofollow\"><span style=\"color:#FFFFFF;padding:7px 20px;font-size:16px;line-height:24px;border-color:#6cadf4;border-radius:0px;text-shadow:none\"><i class=\"sui sui-external-link\" style=\"font-size:16px;color:#fff\"><\/i>  View demo <\/span><\/a>\n<a href=\"https:\/\/github.com\/hongkiat\/html-import\/\" class=\"su-button su-button-style-flat\" style=\"color:#FFFFFF;background-color:#2D89EF;border-color:#246ec0;border-radius:0px\" target=\"__blank\" rel=\"noopener nofollow\"><span style=\"color:#FFFFFF;padding:7px 20px;font-size:16px;line-height:24px;border-color:#6cadf4;border-radius:0px;text-shadow:none\"><i class=\"sui sui-external-link\" style=\"font-size:16px;color:#fff\"><\/i>  Download source<\/span><\/a><\/p>\n<h2>Final Thought<\/h2>\n<p>HTML Imports is useful for building a modular and maintainable web page. However, keep in mind that this method, using HTML Import, may not be suitable if SEO is important. <strong>The content is appended using JavaScript, which is invisible to search engine crawlers<\/strong>. Use HTML Import sparingly, only to add additional or secondary content to your web page.<\/p>","protected":false},"excerpt":{"rendered":"<p>HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML dynamically. HTML Import is a new standard module that aims to make HTML more flexible. HTML Import allows us to include one HTML file into another&hellip;<\/p>\n","protected":false},"author":113,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[506],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Append And Reuse HTML Docs With HTML Import<\/title>\n<meta name=\"description\" content=\"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML\" \/>\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.hongkiat.com\/blog\/html-import\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Include One HTML File Inside Another Using HTML Import\" \/>\n<meta property=\"og:description\" content=\"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/html-import\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2014-07-15T07:01:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-03T18:00:23+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg\" \/>\n<meta name=\"author\" content=\"Thoriq Firdaus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@tfirdaus\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Thoriq Firdaus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"How to Include One HTML File Inside Another Using HTML Import\",\"datePublished\":\"2014-07-15T07:01:37+00:00\",\"dateModified\":\"2025-04-03T18:00:23+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/\"},\"wordCount\":590,\"commentCount\":6,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-import\\\/html-template-network.jpg\",\"keywords\":[\"HTML\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/\",\"name\":\"Append And Reuse HTML Docs With HTML Import\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-import\\\/html-template-network.jpg\",\"datePublished\":\"2014-07-15T07:01:37+00:00\",\"dateModified\":\"2025-04-03T18:00:23+00:00\",\"description\":\"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-import\\\/html-template-network.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-import\\\/html-template-network.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-import\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Include One HTML File Inside Another Using HTML Import\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\",\"name\":\"Thoriq Firdaus\",\"description\":\"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.\",\"sameAs\":[\"https:\\\/\\\/thoriq.com\",\"https:\\\/\\\/x.com\\\/tfirdaus\"],\"jobTitle\":\"Web Developer\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/thoriq\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Append And Reuse HTML Docs With HTML Import","description":"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML","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.hongkiat.com\/blog\/html-import\/","og_locale":"en_US","og_type":"article","og_title":"How to Include One HTML File Inside Another Using HTML Import","og_description":"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML","og_url":"https:\/\/www.hongkiat.com\/blog\/html-import\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2014-07-15T07:01:37+00:00","article_modified_time":"2025-04-03T18:00:23+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg","type":"","width":"","height":""}],"author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"How to Include One HTML File Inside Another Using HTML Import","datePublished":"2014-07-15T07:01:37+00:00","dateModified":"2025-04-03T18:00:23+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/"},"wordCount":590,"commentCount":6,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg","keywords":["HTML"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/html-import\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/","url":"https:\/\/www.hongkiat.com\/blog\/html-import\/","name":"Append And Reuse HTML Docs With HTML Import","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg","datePublished":"2014-07-15T07:01:37+00:00","dateModified":"2025-04-03T18:00:23+00:00","description":"HTML is the standard language that forms a web page, but it is not easy to extend or maintain. We need another language as a layer to generate HTML","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/html-import\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-import\/html-template-network.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/html-import\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Include One HTML File Inside Another Using HTML Import"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807","name":"Thoriq Firdaus","description":"Thoriq is a writer for Hongkiat.com with a passion for web design and development. He is the author of Responsive Web Design by Examples, where he covered his best approaches in developing responsive websites quickly with a framework.","sameAs":["https:\/\/thoriq.com","https:\/\/x.com\/tfirdaus"],"jobTitle":"Web Developer","url":"https:\/\/www.hongkiat.com\/blog\/author\/thoriq\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-5CY","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21636","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/113"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=21636"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21636\/revisions"}],"predecessor-version":[{"id":73707,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21636\/revisions\/73707"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=21636"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=21636"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=21636"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=21636"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}