{"id":37515,"date":"2017-07-25T18:01:11","date_gmt":"2017-07-25T10:01:11","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=37515"},"modified":"2022-07-17T21:57:56","modified_gmt":"2022-07-17T13:57:56","slug":"image-cropping-jquery-plugin-cropper","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/","title":{"rendered":"Crop and Resize Images With This Simple jQuery Plugin"},"content":{"rendered":"<p><strong>Dynamic image cropping<\/strong> is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for <strong>handling images<\/strong>.<\/p>\n<p>One such plugin is <strong><a target=\"_blank\" href=\"https:\/\/fengyuanchen.github.io\/cropper\/\" rel=\"noopener\">Cropper<\/a><\/strong>, a free open-source image cropping solution that handles <strong>zooming<\/strong>, <strong>cropping<\/strong>, and even <strong>saving images<\/strong>.<\/p>\n<p class=\"note\"><strong>Read Also:<\/strong> <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/code-optimization-jquery-best-practices\/\" rel=\"noopener\">Six jQuery Best Practices for Improved Performance<\/a><\/p>\n<p>This project is <strong>available <a target=\"_blank\" href=\"https:\/\/github.com\/fengyuanchen\/cropper\" rel=\"noopener\">on GitHub<\/a><\/strong> with some <em>very<\/em> lengthy documentation with dozens of custom features.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg\" width=\"538\" height=\"431\" alt=\"cropper features\"><\/figure>\n<p>Cropper gives you (the developer) complete control over every aspect of the interface. You can work with <strong>30+ different options<\/strong> and <strong>20+ custom methods<\/strong> built into the Cropper plugin.<\/p>\n<p>It\u2019s <strong>fully touch-sensitive<\/strong>, so it works on all mobile devices and supports the scroll wheel\/trackpad for zooming in & out of photos. Users can <strong>flip<\/strong>, <strong>rotate<\/strong>, <strong>scale<\/strong>, and <strong>reposition<\/strong> photos anywhere on the canvas before cropping.<\/p>\n<p>The Cropper plugin <strong>requires a copy of jQuery<\/strong> and it <strong>comes with two files<\/strong>: a CSS stylesheet and the JavaScript plugin library. Just add these files to your page and it should be good to go!<\/p>\n<p>Remember, this tool comes with <em>a lot<\/em> of features. The <a target=\"_blank\" href=\"https:\/\/github.com\/fengyuanchen\/cropper\" rel=\"noopener\">online documentation<\/a> can help but you\u2019ll need to get your hands dirty <strong>setting up an image upload field yourself<\/strong> to learn it all. Their sample code just <strong>outputs everything to the console<\/strong> and looks something like this:<\/p>\n<pre>\r\n$('#image').cropper({\r\n  aspectRatio: 16 \/ 9,\r\n  crop: function(e) {\r\n    \/\/ Output the result data for cropping image.\r\n    console.log(e.x);\r\n    console.log(e.y);\r\n    console.log(e.width);\r\n    console.log(e.height);\r\n    console.log(e.rotate);\r\n    console.log(e.scaleX);\r\n    console.log(e.scaleY);\r\n  }\r\n});\r\n<\/pre>\n<p>But, you should really take a peek at the <strong><a target=\"_blank\" href=\"https:\/\/fengyuanchen.github.io\/cropper\/\" rel=\"noopener\">live demo<\/a><\/strong> to see how this all works.<\/p>\n<p>You can find <strong>live output data of the X\/Y coordinates<\/strong>, along with the <strong>image dimensions<\/strong> near the top. Cropper also includes an <strong>upload feature<\/strong> where the user can select an image from their computer and start cropping right in the browser.<\/p>\n<p>Live thumbnails <strong>update in the corner<\/strong>, so you can see what the end result looks like before saving. Alter the <strong>aspect ratio<\/strong>, the <strong>output quality<\/strong>, the <strong>default crop position<\/strong>, and a whole bunch more.<\/p>\n<figure><a target=\"_blank\" href=\"https:\/\/fengyuanchen.github.io\/cropper\/\" rel=\"noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/02-cropper-demo-previews.jpg\" alt=\"Cropper plugin demo\" width=\"1123\" height=\"718\"><\/a><\/figure>\n<p class=\"note\"><strong>Read Also:<\/strong> <a target=\"_blank\" href=\"https:\/\/www.hongkiat.com\/blog\/js-image-comparison-sliders\/\" rel=\"noopener\">5 Free Image Comparison Slider Scripts<\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for handling images. One such plugin is Cropper, a free open-source image cropping solution that handles zooming, cropping, and even saving images. Read Also: Six jQuery Best Practices for&hellip;<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3393],"tags":[911],"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.5) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Crop and Resize Images With This Simple jQuery Plugin - Hongkiat<\/title>\n<meta name=\"description\" content=\"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for\" \/>\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\/image-cropping-jquery-plugin-cropper\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Crop and Resize Images With This Simple jQuery Plugin\" \/>\n<meta property=\"og:description\" content=\"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/\" \/>\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=\"2017-07-25T10:01:11+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-17T13:57:56+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg\" \/>\n<meta name=\"author\" content=\"Jake Rocheleau\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jake Rocheleau\" \/>\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.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/\"},\"author\":{\"name\":\"Jake Rocheleau\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\"},\"headline\":\"Crop and Resize Images With This Simple jQuery Plugin\",\"datePublished\":\"2017-07-25T10:01:11+00:00\",\"dateModified\":\"2022-07-17T13:57:56+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/\"},\"wordCount\":329,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/image-cropping-jquery-plugin-cropper\\\/cropper-features.jpg\",\"keywords\":[\"jQuery\"],\"articleSection\":[\"Toolkit\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/\",\"name\":\"Crop and Resize Images With This Simple jQuery Plugin - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/image-cropping-jquery-plugin-cropper\\\/cropper-features.jpg\",\"datePublished\":\"2017-07-25T10:01:11+00:00\",\"dateModified\":\"2022-07-17T13:57:56+00:00\",\"description\":\"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/image-cropping-jquery-plugin-cropper\\\/cropper-features.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/image-cropping-jquery-plugin-cropper\\\/cropper-features.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/image-cropping-jquery-plugin-cropper\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Crop and Resize Images With This Simple jQuery Plugin\"}]},{\"@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\\\/966b2daea15283b4145e71aa98a82c2a\",\"name\":\"Jake Rocheleau\",\"description\":\"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers\",\"sameAs\":[\"https:\\\/\\\/www.hongkiat.com\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/jake\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Crop and Resize Images With This Simple jQuery Plugin - Hongkiat","description":"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for","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\/image-cropping-jquery-plugin-cropper\/","og_locale":"en_US","og_type":"article","og_title":"Crop and Resize Images With This Simple jQuery Plugin","og_description":"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for","og_url":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2017-07-25T10:01:11+00:00","article_modified_time":"2022-07-17T13:57:56+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg","type":"","width":"","height":""}],"author":"Jake Rocheleau","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Jake Rocheleau","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/"},"author":{"name":"Jake Rocheleau","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a"},"headline":"Crop and Resize Images With This Simple jQuery Plugin","datePublished":"2017-07-25T10:01:11+00:00","dateModified":"2022-07-17T13:57:56+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/"},"wordCount":329,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg","keywords":["jQuery"],"articleSection":["Toolkit"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/","url":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/","name":"Crop and Resize Images With This Simple jQuery Plugin - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg","datePublished":"2017-07-25T10:01:11+00:00","dateModified":"2022-07-17T13:57:56+00:00","description":"Dynamic image cropping is easier than ever thanks to libraries such as jQuery. The codebase is easy to use and the community has thousands of plugins for","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/image-cropping-jquery-plugin-cropper\/cropper-features.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/image-cropping-jquery-plugin-cropper\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Crop and Resize Images With This Simple jQuery Plugin"}]},{"@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\/966b2daea15283b4145e71aa98a82c2a","name":"Jake Rocheleau","description":"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers","sameAs":["https:\/\/www.hongkiat.com"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/jake\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-9L5","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37515","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\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=37515"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37515\/revisions"}],"predecessor-version":[{"id":60503,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/37515\/revisions\/60503"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=37515"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=37515"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=37515"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=37515"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}