{"id":18226,"date":"2013-09-27T18:01:01","date_gmt":"2013-09-27T10:01:01","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=18226"},"modified":"2024-09-03T18:16:26","modified_gmt":"2024-09-03T10:16:26","slug":"html-css-faster-emmet","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/","title":{"rendered":"Boost Your HTML & CSS Workflow with Emmet"},"content":{"rendered":"

As web developers, we\u2019re constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently work with HTML and CSS<\/a>. Today, we\u2019re exploring a tool that allows us to write these two essential web languages much faster \u2013 Emmet<\/a><\/strong>.<\/p>\n

Emmet is an extension of Zen Coding<\/a>, written purely in JavaScript. While this demonstration uses Sublime Text, Emmet is also available for many code editors<\/a>, including TextMate, Coda, Eclipse, Notepad++,<\/strong> and Adobe Dreamweaver<\/strong>.<\/p>\n

Installing Emmet<\/h2>\n

Head over to this page<\/a> to find and download Emmet for your code editor. If you\u2019re using Sublime Text, like I am, Emmet can be easily installed through Package Control<\/a>.<\/p>\n

\"Installing<\/figure>\n

Once installed, you may need to restart Sublime Text.<\/p>\n

Writing HTML with Emmet<\/h2>\n

Many modern editors offer similar built-in functionality. For example, in Sublime Text, simply writing <ul><\/code> and hitting the Tab<\/span> key automatically expands it into a complete unordered list with <li><\/code> elements.<\/p>\n

\"Expanding<\/figure>\n

You can also use Emmet to write div.class<\/code> to assign an HTML class to an element.<\/p>\n

\"Using<\/figure>\n

Emmet extends this functionality further, allowing you to write complex HTML structures more simply using abbreviations or aliases, similar to CSS. If you\u2019re familiar with CSS syntax, you\u2019ll adapt to Emmet quickly.<\/p>\n

The Emmet documentation<\/a> provides a comprehensive list of abbreviations and aliases, which can be overwhelming for first-time users. Here are some basic concepts that are essential to get you started:<\/p>\n

Child Elements<\/h3>\n

Emmet uses syntax similar to CSS. For instance, in CSS, a direct child selector is represented by the ><\/code> sign. In Emmet, this operator is also used to add child elements. For example:<\/p>\n

\"Adding<\/figure>\n

Sibling Elements<\/h3>\n

Sibling elements are at the same nesting level. In CSS, the plus +<\/code> sign is used to select sibling elements, and you can use it similarly in Emmet to add sibling elements.<\/p>\n

\"Adding<\/figure>\n

Assigning ID or Class<\/h3>\n

In CSS, you can select an element by its id attribute using the #<\/code> sign. With Emmet, #<\/code> is used to assign an ID attribute to an element. As shown earlier, you can also assign an HTML class in the same way. For example:<\/p>\n

\"Assigning<\/figure>\n

When no element is specified, Emmet defaults to <div><\/code>. To be more specific, declare the element type before the class or ID name, like so:<\/p>\n

\"Assigning<\/figure>\n

You can assign multiple classes to one element as follows:<\/p>\n

\"Assigning<\/figure>\n

Assigning Attributes<\/h3>\n

In CSS, square brackets are used to select attributes. This method can also be applied in Emmet to assign attributes to generated elements.<\/p>\n

\"Assigning<\/figure>\n

Multiplication<\/h3>\n

Emmet allows you to add multiple HTML elements using the asterisk (*)<\/code> sign, which can be a time-saver. For example, you can add an <h3><\/code> and four <h4><\/code> elements under a <section><\/code> element:<\/p>\n

\"Multiplying<\/figure>\n

Basic HTML Document<\/h3>\n

You can build the basic structure of an HTML document in no time with Emmet. Here\u2019s how to create a basic HTML5 structure:<\/p>\n

\"Generating<\/figure>\n

Lorem Ipsum<\/h3>\n

One of my favorite features of Emmet is generating Lorem Ipsum text. Sublime Text has a shortcut for generating this dummy text; simply write lorem<\/code> and hit Tab<\/span>, and it expands into 5 to 7 lines of Lorem Ipsum.<\/p>\n

Emmet takes this further, allowing you to specify the number of words. For example, to generate only three words, you can write lorem3<\/code>:<\/p>\n

\"Generating<\/figure>\n

You can specify the length of your Lorem Ipsum text accordingly.<\/p>\n

Using Emmet in CSS<\/h2>\n

You can also use Emmet to write CSS. Similar to HTML, it expands aliases into complete CSS properties and their values. For example, to add padding<\/code> with a value of 10px<\/code>, write p:10<\/code> and hit the Tab<\/span> key. Emmet will automatically expand it to padding: 10px<\/code>:<\/p>\n

\"Writing<\/figure>\n

To hide elements, you can use either the visibility<\/code> or display<\/code> property. With Emmet, you can write these properties as follows:<\/p>\n

\"Using<\/figure>\n

However, despite its advantages, I still prefer using the auto-complete feature in my code editor for CSS, as it\u2019s more convenient. Plus, memorizing these CSS aliases is a bit harder than for HTML. You can refer to the cheatsheet<\/a> for Emmet aliases in CSS as well as HTML here<\/a><\/strong>.<\/p>\n

Conclusion<\/h2>\n

Emmet is a brilliant tool and an essential one for web developers. The only downside is the learning curve for first-timers, but once you master it, it can significantly boost your productivity. You\u2019ll be writing HTML and CSS faster than ever before.<\/p>\n

Have you tried Emmet? Share your thoughts in the comments below.<\/p>","protected":false},"excerpt":{"rendered":"

As web developers, we\u2019re constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently work with HTML and CSS. Today, we\u2019re exploring a tool that allows us to write these two essential web languages much faster \u2013 Emmet. Emmet is an extension of Zen Coding, written…<\/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":[507,4501],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\nBoost Your HTML & CSS Workflow with Emmet - Hongkiat<\/title>\n<meta name=\"description\" content=\"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently\" \/>\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-css-faster-emmet\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Boost Your HTML & CSS Workflow with Emmet\" \/>\n<meta property=\"og:description\" content=\"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/\" \/>\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=\"2013-09-27T10:01:01+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-03T10:16:26+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.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=\"6 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-css-faster-emmet\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/\"},\"author\":{\"name\":\"Thoriq Firdaus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e7948c7a175d211496331e4b6ce55807\"},\"headline\":\"Boost Your HTML & CSS Workflow with Emmet\",\"datePublished\":\"2013-09-27T10:01:01+00:00\",\"dateModified\":\"2024-09-03T10:16:26+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/\"},\"wordCount\":704,\"commentCount\":38,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-css-faster-emmet\\\/install-emmet.jpg\",\"keywords\":[\"CSS\",\"CSS Tutorials\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/\",\"name\":\"Boost Your HTML & CSS Workflow with Emmet - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-css-faster-emmet\\\/install-emmet.jpg\",\"datePublished\":\"2013-09-27T10:01:01+00:00\",\"dateModified\":\"2024-09-03T10:16:26+00:00\",\"description\":\"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-css-faster-emmet\\\/install-emmet.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-css-faster-emmet\\\/install-emmet.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-css-faster-emmet\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Boost Your HTML & CSS Workflow with Emmet\"}]},{\"@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":"Boost Your HTML & CSS Workflow with Emmet - Hongkiat","description":"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently","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-css-faster-emmet\/","og_locale":"en_US","og_type":"article","og_title":"Boost Your HTML & CSS Workflow with Emmet","og_description":"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently","og_url":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2013-09-27T10:01:01+00:00","article_modified_time":"2024-09-03T10:16:26+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.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":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/"},"author":{"name":"Thoriq Firdaus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e7948c7a175d211496331e4b6ce55807"},"headline":"Boost Your HTML & CSS Workflow with Emmet","datePublished":"2013-09-27T10:01:01+00:00","dateModified":"2024-09-03T10:16:26+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/"},"wordCount":704,"commentCount":38,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.jpg","keywords":["CSS","CSS Tutorials"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/","url":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/","name":"Boost Your HTML & CSS Workflow with Emmet - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.jpg","datePublished":"2013-09-27T10:01:01+00:00","dateModified":"2024-09-03T10:16:26+00:00","description":"As web developers, we're constantly searching for tools to enhance our workflow and productivity. This post is dedicated to web developers who frequently","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-css-faster-emmet\/install-emmet.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/html-css-faster-emmet\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Boost Your HTML & CSS Workflow with Emmet"}]},{"@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-4JY","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/18226","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=18226"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/18226\/revisions"}],"predecessor-version":[{"id":72724,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/18226\/revisions\/72724"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=18226"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=18226"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=18226"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=18226"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}