{"id":19274,"date":"2014-02-10T15:01:26","date_gmt":"2014-02-10T07:01:26","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=19274"},"modified":"2023-11-15T19:46:47","modified_gmt":"2023-11-15T11:46:47","slug":"less-css-new-features","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/","title":{"rendered":"3 LESS CSS Features You Should Know"},"content":{"rendered":"<p>It\u2019s been a while since <a href=\"https:\/\/www.hongkiat.com\/blog\/less-color-functions\/\">our last discussion on LESS CSS<\/a>. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it more powerful as a CSS Pre-processor.<\/p>\n<p>There have been a bunch of new additions to it, and in this post, we are going to walk you through 3 of my new favorite features: Referencing External File, Extend, Merging Property, <strong>which can help us write better CSS.<\/strong> Let\u2019s take a look.<\/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\/less-basic\/\" class=\"ref-block__link\" title=\"Read More: LESS CSS \u2013 Beginner\u2019s Guide\" rel=\"bookmark\"><span class=\"screen-reader-text\">LESS CSS \u2013 Beginner\u2019s Guide<\/span><\/a>\n<div class=\"ref-block__thumbnail img-thumb img-thumb--jumbo\" data-img='{ \"src\" : \"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/less-basic.jpg\" }'>\n\t\t\t\t\t\t\t<noscript>\n<style>.no-js #ref-block-post-15230 .ref-block__thumbnail { background-image: url(\"https:\/\/assets.hongkiat.com\/uploads\/thumbs\/250x160\/less-basic.jpg\"); }<\/style>\n<\/noscript>\n\t\t\t\t\t\t<\/div>\n<div class=\"ref-block__summary\">\n<h4 class=\"ref-title\">LESS CSS \u2013 Beginner\u2019s Guide<\/h4>\n<p class=\"ref-description\">\n\t\t\t\t\t\tCSS Pre-processors have now become a staple in web development. They enhance plain CSS with programming features such...\t\t\t\t\t\t<span>Read more<\/span><\/p>\n<\/div>\n<\/div>\n<h2>File Import<\/h2>\n<p>First of all, let\u2019s take a look at how LESS CSS handles external files with the <code>@import<\/code> rule.<\/p>\n<p>Some people may split their stylesheet into multiple files, rather than putting it all in one pot. Then they import them with the <code>@import<\/code> rule into another stylesheet, so that the <strong>Mixins<\/strong> (as well as the <strong>Variables<\/strong>) from those files can be reused in that other file.<\/p>\n<pre>\r\n @import \"external.less\"; \r\n<\/pre>\n<p>The problem is that LESS will compile all the Mixins from these external files, so we would end up with multiple style rules that define the same thing.<\/p>\n<p>Take a look at the following example: We have two LESS files called <em>style.less<\/em> and <em>external.less<\/em>. We import <em>external.less<\/em> into <em>style.less<\/em>. Then, we have a <code>.square<\/code> mixin in <em>external.less<\/em> to define the style for square boxes. Within <em>style.less<\/em>, we use the mixin like so.<\/p>\n<pre>\r\n @import \"external\";\r\n \r\n .box {\r\n .square;\r\n }\r\n<\/pre>\n<p>This will produce the following result in CSS. The style-rules from the <code>.square<\/code> mixin are generated as well \u2013 which is not ideal.<\/p>\n<pre>\r\n.square {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  background-color: red;\r\n}\r\n\r\n.box {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  background-color: red;\r\n}\r\n\r\n<\/pre>\n<p>In version 1.5, LESS introduced <code>(reference)<\/code>, which can be used to instruct LESS to use the import file only for reference, and not to output the content.<\/p>\n<p>Put the <code>(reference)<\/code> instruction this way:<\/p>\n<pre>\r\n @import (reference) \"external\";\r\n<\/pre>\n<p>Compile the LESS stylesheet, and now the <code>.square<\/code> is not output.<\/p>\n<pre>\r\n.box {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  background-color: red;\r\n}\r\n\r\n<\/pre>\n<h2>Extend<\/h2>\n<p>The <em>Extend<\/em> method is pure awesomeness. Technically, it <strong>groups selectors that share the same style-rules<\/strong>, resulting in <strong>cleaner and more organized CSS<\/strong>. When we build a website, at some points, we could end up having some selectors with closely similar style-rules, like below:<\/p>\n<pre>\r\n.box {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  border: 1px solid black;\r\n  background-color: transparent;\r\n}\r\n\r\n.box2 {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  border: 1px solid black;\r\n  background-color: red;\r\n}\r\n\r\n<\/pre>\n<p>This is redundant and does not follow best practices, which suggest grouping the same styles together. Sass, in this case, is known for its <code>@extend<\/code> directive to do this job. In LESS, we can do a similar thing with <code>&:extend()<\/code>, introduced in version 1.4.<\/p>\n<p>Given the above example, we can do:<\/p>\n<pre>\r\n@import (reference) \"external\";\r\n\r\n.box {\r\n  &:extend(.square);\r\n  background-color: transparent;\r\n}\r\n\r\n.box2 {\r\n  &:extend(.square);\r\n  background-color: red;\r\n}\r\n\r\n<\/pre>\n<p>When compiled to regular CSS, the above code will produce:<\/p>\n<pre>\r\n.square, .box, .box2 {\r\n  width: 100px;\r\n  height: 100px;\r\n  margin: 0 auto;\r\n  border: 1px solid black;\r\n}\r\n\r\n.box {\r\n  background-color: transparent;\r\n}\r\n\r\n.box2 {\r\n  background-color: red;\r\n}\r\n\r\n<\/pre>\n<h2>Merging Property<\/h2>\n<p>Another cool new feature is <strong>Merging Property<\/strong>. This feature applies to CSS properties that accept multiple values, like <strong>transform, transition, and box-shadow<\/strong>. And as the name implies, it will merge values that belong to the same property. Let\u2019s check out this example below.<\/p>\n<p>As you probably already know, the <a href=\"https:\/\/www.hongkiat.com\/blog\/css3-box-shadows-effects\/\">CSS3 Box Shadow<\/a> property accepts multiple shadow values. By using this Merging Property, you can build shadow effects easily and make them more manageable.<\/p>\n<p>Here we create two mixins: <code>.inner-shadow<\/code> and <code>.outer-shadow<\/code> \u2013 I guess the names are self-explanatory.<\/p>\n<pre>\r\n.inner-shadow {\r\n  box-shadow: inset 10px 10px 5px #ccc;\r\n}\r\n\r\n.outer-shadow {\r\n  box-shadow: 10px 10px 5px #ccc;\r\n}\r\n\r\n<\/pre>\n<p>Notice that we add a <code>+<\/code> sign at the end of the property\u2019s name. This <code>+<\/code> sign is required for this feature to work. Then, we can use these mixins, as follows:<\/p>\n<pre>\r\n.box {\r\n  .inner-shadow;\r\n  .outer-shadow;\r\n}\r\n\r\n.box2 {\r\n  .inner-shadow;\r\n}\r\n\r\n.box3 {\r\n  .outer-shadow;\r\n}\r\n\r\n<\/pre>\n<p>This code will give us the following result.<\/p>\n<pre>\r\n.box {\r\n  box-shadow: inset 10px 10px 5px #ccc, 10px 10px 5px #ccc;\r\n}\r\n\r\n.box2 {\r\n  box-shadow: inset 10px 10px 5px #ccc;\r\n}\r\n\r\n.box3 {\r\n  box-shadow: 10px 10px 5px #ccc;\r\n}\r\n<\/pre>\n<h2>Final Thought<\/h2>\n<p>These 3 new features \u2013 Referencing External File, Extend, Merging Property \u2013 have motivated me to use LESS more. With them, we can write better and more manageable CSS. I\u2019m looking forward to more cool new capabilities that LESS will offer in upcoming versions.<\/p>","protected":false},"excerpt":{"rendered":"<p>It\u2019s been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it more powerful as a CSS Pre-processor. There have been a bunch of new additions to it, and in this post, we are going to walk you&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":[3392,352],"tags":[507,1980],"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.7) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>3 LESS CSS Features You Should Know - Hongkiat<\/title>\n<meta name=\"description\" content=\"It&#039;s been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it\" \/>\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\/less-css-new-features\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"3 LESS CSS Features You Should Know\" \/>\n<meta property=\"og:description\" content=\"It&#039;s been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/\" \/>\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-02-10T07:01:26+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-11-15T11:46:47+00:00\" \/>\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=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"3 LESS CSS Features You Should Know\",\"datePublished\":\"2014-02-10T07:01:26+00:00\",\"dateModified\":\"2023-11-15T11:46:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/\"},\"wordCount\":571,\"commentCount\":10,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"keywords\":[\"CSS\",\"Less\"],\"articleSection\":[\"Coding\",\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/\",\"name\":\"3 LESS CSS Features You Should Know - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"datePublished\":\"2014-02-10T07:01:26+00:00\",\"dateModified\":\"2023-11-15T11:46:47+00:00\",\"description\":\"It's been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/less-css-new-features\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"3 LESS CSS Features You Should Know\"}]},{\"@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":"3 LESS CSS Features You Should Know - Hongkiat","description":"It's been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it","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\/less-css-new-features\/","og_locale":"en_US","og_type":"article","og_title":"3 LESS CSS Features You Should Know","og_description":"It's been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it","og_url":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2014-02-10T07:01:26+00:00","article_modified_time":"2023-11-15T11:46:47+00:00","author":"Thoriq Firdaus","twitter_card":"summary_large_image","twitter_creator":"@tfirdaus","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Thoriq Firdaus","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"3 LESS CSS Features You Should Know","datePublished":"2014-02-10T07:01:26+00:00","dateModified":"2023-11-15T11:46:47+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/"},"wordCount":571,"commentCount":10,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"keywords":["CSS","Less"],"articleSection":["Coding","Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/","url":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/","name":"3 LESS CSS Features You Should Know - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"datePublished":"2014-02-10T07:01:26+00:00","dateModified":"2023-11-15T11:46:47+00:00","description":"It's been a while since our last discussion on LESS CSS. Today, LESS CSS has reached version 1.5, and it has been evolving with new features that make it","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/less-css-new-features\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"3 LESS CSS Features You Should Know"}]},{"@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-50S","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19274","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=19274"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19274\/revisions"}],"predecessor-version":[{"id":70291,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/19274\/revisions\/70291"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=19274"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=19274"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=19274"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=19274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}