{"id":21555,"date":"2019-07-03T18:17:20","date_gmt":"2019-07-03T10:17:20","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=21555"},"modified":"2019-07-01T21:33:32","modified_gmt":"2019-07-01T13:33:32","slug":"customize-soundcloud-audio-player-toneden","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/","title":{"rendered":"How to Customize SoundCloud Audio Player"},"content":{"rendered":"<p>Audio streaming have been around on the Internet <a href=\"https:\/\/en.wikipedia.org\/wiki\/Streaming_media\" target=\"_blank\">since 1990<\/a> and there are not numerous popular audio streaming platforms to choose from now. One of the most popular is SoundCloud which has some distinct advantages over its competitors including being easy to embed.<\/p>\n<p>While the embedded player is very user friendly and responsive \u2014 you can put it on the sidebar, on a post or a homepage \u2013 you can limited when it comes to <a href=\"https:\/\/www.hongkiat.com\/blog\/web-audio-player\/\">customizing the player<\/a>. You can only change the color and size before sharing or embedding it.  If you want to put the player in your web page with whole new design, then you may like <a href=\"https:\/\/www.toneden.io\/player\" target=\"_blank\">ToneDen<\/a>.<\/p>\n<p><strong>ToneDen<\/strong> is a javascript library build for customizing SoundCloud audio player. The player is responsive, customizable and extensible. You can change the skin, enable the keyboard event or choose to display the player with a single track only or full with playlist. In this post, I will guide you to the basic installation and optimization. Let\u2019s get started!<\/p>\n<p class=\"note\"><strong>Recommended Reading: <\/strong><a href=\"https:\/\/www.hongkiat.com\/blog\/web-audio-player\/\">How To Create A Sleek Web Audio Player<\/a><\/p>\n<h2>1. Installing the player<\/h2>\n<p>To get customized SoundCloud player, you don\u2019t need any embedded script from SoundCloud site. All you have to do is just define an element with unique id then add the required script.<\/p>\n<p>For example, I want to add one of my favorite users from SoundCloud, <a href=\"https:\/\/soundcloud.com\/reginaspektor\" target=\"_blank\" rel=\"nofollow\">Regina Spektor<\/a>, to my site. The first thing that I\u2019m going to do is create a <code>div<\/code> with unique id, say <code>player<\/code>, like so.<\/p>\n<pre>\r\n&lt;div id=\"player\"&gt;&lt;\/div&gt;\r\n<\/pre>\n<p>Then I add the following required javascript before the closing tag of <code>body<\/code>:<\/p>\n<pre>\r\n&lt;script&gt;\r\n   (function() {\r\n      var script = document.createElement('script');\r\n\r\n      script.type = 'text\/javascript';\r\n      script.async = true;\r\n      script.src = 'http:\/\/sd.toneden.io\/production\/toneden.loader.js'\r\n\r\n      var entry = document.getElementsByTagName('script')[0];\r\n      entry.parentNode.insertBefore(script, entry);\r\n   }());\r\n\r\n   ToneDenReady = window.ToneDenReady || [];\r\n   ToneDenReady.push(function() {\r\n      \/\/ This is where all the action happens:\r\n      ToneDen.player.create({\r\n         dom: '#player',\r\n         urls: [\r\n            'https:\/\/soundcloud.com\/reginaspektor'\r\n         ]\r\n      });\r\n   });\r\n&lt;\/script&gt;\r\n<\/pre>\n<p>The first function is basically to call javascript library of ToneDen. Just leave everything as it is, and if you want to host the source on your own server, get it <a href=\"https:\/\/codeload.github.com\/ToneDen\/Player\/zip\/refs\/heads\/master\" target=\"_blank\">here<\/a>.<\/p>\n<p>In the second function, this is where you should reference all resources. To display the player, give the <code>dom<\/code> the same id as we define before. And to call the audio source, I just need to add the <code>urls<\/code> with the user url that I want. If you need only selected audio tracks, then include the audio urls like so:<\/p>\n<pre>\r\nurls: [\r\n   'https:\/\/soundcloud.com\/reginaspektor\/samson',\r\n   'https:\/\/soundcloud.com\/reginaspektor\/us',\r\n   'https:\/\/soundcloud.com\/reginaspektor\/alltherowboats',\r\n]\r\n<\/pre>\n<p>That\u2019s it! Now I got my beautiful SoundCloud player:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg\" alt=\"play demo\" width=\"500\" height=\"410\"><\/figure>\n<h2>2. Customizing the player<\/h2>\n<p>As mentioned, you can customize the ToneDen player if you don\u2019t like the default option. To customize it, just include the related API in the second function. Head over to the <a href=\"https:\/\/github.com\/ToneDen\/Player\" target=\"_blank\">API documentation<\/a> page for more detail.<\/p>\n<p>The following snippet is a demo of using simple API like <code>skin<\/code> to change the player color, <code>single<\/code> for changing the UI looks to be minimalistic and <code>visualizerType<\/code> to show a different type of visualization.<\/p>\n<pre>\r\nToneDenReady = window.ToneDenReady || [];\r\nToneDenReady.push(function() {\r\n   \/\/ This is where all the action happens:\r\n   ToneDen.player.create({\r\n      dom: '#player',\r\n      urls: [\r\n         'https:\/\/soundcloud.com\/reginaspektor\/samson',\r\n         'https:\/\/soundcloud.com\/reginaspektor\/us',\r\n         'https:\/\/soundcloud.com\/reginaspektor\/alltherowboats',\r\n      ],\r\n      single: true,\r\n      skin: 'dark',\r\n      visualizerType: 'bars'\r\n   });\r\n});\r\n<\/pre>\n<p>Our player now should look like this:<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/minimalistic-player.jpg\" alt=\"minimalistic player\" width=\"500\" height=\"110\"><\/figure>\n<p>If you want to have multiple players on the page, easily create some more <code>ToneDen.player.create<\/code> like so:<\/p>\n<pre>\r\nToneDenReady.push(function() {\r\n        ToneDen.player.create({\r\n            dom: '#player1',\r\n            urls: [\r\n                'https:\/\/soundcloud.com\/giraffage'\r\n            ]\r\n        });\r\n        ToneDen.player.create({\r\n            dom: '#player2',\r\n            urls: [\r\n                'https:\/\/soundcloud.com\/teendaze'\r\n            ]\r\n        });\r\n        ToneDen.player.create({\r\n            dom: '#player3',\r\n            urls: [\r\n                'https:\/\/soundcloud.com\/beat-culture'\r\n            ]\r\n        });\r\n    });\r\n<\/pre>\n<h2>Final Thought<\/h2>\n<p>With just some additional code, now you can create your own version of the SoundCloud player. The  thing I like most from this library is its minimalistic design and easy customization. You can also integrate this player to your WordPress blog with some easy tutorial in the bottom of ToneDen <a href=\"https:\/\/www.toneden.io\/player\" target=\"_blank\">page<\/a>. Have fun!<\/p>","protected":false},"excerpt":{"rendered":"<p>Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the most popular is SoundCloud which has some distinct advantages over its competitors including being easy to embed. While the embedded player is very user friendly and responsive \u2014 you&hellip;<\/p>\n","protected":false},"author":136,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3392],"tags":[4396],"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.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>How to Customize SoundCloud Audio Player - Hongkiat<\/title>\n<meta name=\"description\" content=\"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the\" \/>\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\/customize-soundcloud-audio-player-toneden\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Customize SoundCloud Audio Player\" \/>\n<meta property=\"og:description\" content=\"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/\" \/>\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=\"2019-07-03T10:17:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg\" \/>\n<meta name=\"author\" content=\"Irfan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@IrfanFza\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Irfan\" \/>\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\\\/customize-soundcloud-audio-player-toneden\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/\"},\"author\":{\"name\":\"Irfan\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/483b1092b8017f37d977331e91935d8c\"},\"headline\":\"How to Customize SoundCloud Audio Player\",\"datePublished\":\"2019-07-03T10:17:20+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/\"},\"wordCount\":515,\"commentCount\":3,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-soundcloud-audio-player-toneden\\\/player-demo.jpg\",\"keywords\":[\"Audio Editors\"],\"articleSection\":[\"Coding\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/\",\"name\":\"How to Customize SoundCloud Audio Player - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-soundcloud-audio-player-toneden\\\/player-demo.jpg\",\"datePublished\":\"2019-07-03T10:17:20+00:00\",\"description\":\"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-soundcloud-audio-player-toneden\\\/player-demo.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-soundcloud-audio-player-toneden\\\/player-demo.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-soundcloud-audio-player-toneden\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Customize SoundCloud Audio Player\"}]},{\"@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\\\/483b1092b8017f37d977331e91935d8c\",\"name\":\"Irfan\",\"description\":\"Irfan is a writer for hongkiat.com and tech enthusiast all-around. He also appreciates much on minimalist and clean design. Movie and football lovers and enjoy to travel around in his free time.\",\"sameAs\":[\"https:\\\/\\\/x.com\\\/IrfanFza\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/irfan_fauzii\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Customize SoundCloud Audio Player - Hongkiat","description":"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the","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\/customize-soundcloud-audio-player-toneden\/","og_locale":"en_US","og_type":"article","og_title":"How to Customize SoundCloud Audio Player","og_description":"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the","og_url":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2019-07-03T10:17:20+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg","type":"","width":"","height":""}],"author":"Irfan","twitter_card":"summary_large_image","twitter_creator":"@IrfanFza","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Irfan","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/"},"author":{"name":"Irfan","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/483b1092b8017f37d977331e91935d8c"},"headline":"How to Customize SoundCloud Audio Player","datePublished":"2019-07-03T10:17:20+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/"},"wordCount":515,"commentCount":3,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg","keywords":["Audio Editors"],"articleSection":["Coding"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/","url":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/","name":"How to Customize SoundCloud Audio Player - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg","datePublished":"2019-07-03T10:17:20+00:00","description":"Audio streaming have been around on the Internet since 1990 and there are not numerous popular audio streaming platforms to choose from now. One of the","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-soundcloud-audio-player-toneden\/player-demo.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/customize-soundcloud-audio-player-toneden\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Customize SoundCloud Audio Player"}]},{"@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\/483b1092b8017f37d977331e91935d8c","name":"Irfan","description":"Irfan is a writer for hongkiat.com and tech enthusiast all-around. He also appreciates much on minimalist and clean design. Movie and football lovers and enjoy to travel around in his free time.","sameAs":["https:\/\/x.com\/IrfanFza"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/irfan_fauzii\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-5BF","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21555","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\/136"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=21555"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21555\/revisions"}],"predecessor-version":[{"id":48187,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/21555\/revisions\/48187"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=21555"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=21555"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=21555"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=21555"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}