{"id":27168,"date":"2019-08-01T23:19:17","date_gmt":"2019-08-01T15:19:17","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=27168"},"modified":"2019-07-30T20:54:46","modified_gmt":"2019-07-30T12:54:46","slug":"customize-reader-view-theme-firefox","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/","title":{"rendered":"How to Customize Firefox Reader View for Better Readability"},"content":{"rendered":"

Reader View<\/a> is a popular feature of the Firefox browser, that changes the appearance<\/strong> of a web page, and makes it more readable<\/strong> by removing visual clutter<\/strong> such as images, ads, headers, and sidebars. Reader View is, however not available, for all home pages.<\/p>\n

If the feature is available for a certain page, you will find the icon to enable it in the shape of a small book icon<\/strong> displayed to the right of the address bar.<\/p>\n

\"\"
IMAGE: Mozilla.org<\/a><\/figcaption><\/figure>\n

There are a few built-in options that allow readers to customize the look of the Reader View<\/strong>. We\u2019ll be looking at those options before showing you what you can do to further personalize the look of the Reader View. For demo purposes, I will be using an article<\/a> by National Geographic article.<\/p>\n

Pre-Built Options<\/h3>\n

Firefox Reader View comes with a few pre-built customization options such as dark, light and sepia backgrounds<\/strong>, adjustable font sizes<\/strong>, and serif and sans-serif typefaces<\/strong>. You can customize the theme by overriding the CSS rules <\/strong>of these pre-existing options.<\/p>\n

\"Default
Default Reader View Options<\/figcaption><\/figure>\n

I use a dark skin with serif fonts, and this means that I will need to override the belonging CSS classes, in my case .dark<\/code> and .serif<\/code>.<\/p>\n

If you want to customize another theme variant (skin + font), you will need to use the appropriate CSS selectors<\/strong>. You can check these out with the help of the Firefox Developer Tools by hitting F12<\/span>.<\/p>\n

\"Check<\/figure>\n

Create the Custom CSS File<\/h3>\n

You need to create a file called userContent.css<\/code> inside the chrome<\/code> folder of your Firefox profile folder<\/strong> for your Reader View customizations. To find your Firefox profile folder, type about:support<\/code> into the URL bar and press Enter<\/span>.<\/p>\n

You\u2019ll find yourself on a page that contains the technical data related to your Firefox install<\/strong>. Click the Show Folder<\/span> button, and it will open your Profile folder.<\/p>\n

\"Profile
the Profile Folder button<\/figcaption><\/figure>\n

Create a folder called chrome<\/code> inside your Profile Folder (if you don\u2019t have it yet), and a file called userContent.css<\/code> inside the chrome<\/code> folder. The file path looks like this:<\/p>\n

\r\n...\\Profiles\\<your-profile-folder>\\chrome\\userContent.css\r\n<\/pre>\n
Add the Custom CSS Rules<\/h3>\n
Once you\u2019ve created and opened userContent.css<\/code> in a code editor, it\u2019s time to add your CSS rules. In order to customize the design of the Reader View, you need to target the <body><\/code> tag with the appropriate selectors<\/strong>.<\/p>\n
You can use the following selectors for the different default options:<\/p>\n
\r\n\/* When dark background is selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.dark  {\r\n}\r\n\/* When light background is selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.light  {\r\n}\r\n\/* When sepia background is selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.sepia  {\r\n}\r\n\/* When serif font is selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.serif {\r\n}\r\n\/* When sans-serif font is selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.sans-serif {\r\n}\r\n<\/pre>\n
You can also combine the classes, to target a specific combination of settings.<\/p>\n
\r\n\/* When dark background and serif font are selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif  {\r\n}\r\n\/* When sepia background and sans-serif font are selected *\/\r\n:root[hasbrowserhandlers=\"true\"] body.sans-serif.sepia  {\r\n}<\/pre>\n
Do not use<\/strong> the common selector :root[hasbrowserhandlers=\"true\"] body<\/code> to target all the settings at once. It will work, but it will also affect other browser pages<\/strong>, such as about:newtab<\/code>, as their root elements also carry the hasbrowserhandlers<\/code> attribute (which is used to mark the event handlers of internal Firefox pages, such as about:<\/code> pages).<\/p>\n
Here\u2019s the code I added to my  userContent.css<\/code>. I changed the font family, font style, colors, and widened the text container. You can use any other style rules according to your own taste.<\/p>\n
\r\n\/** userContent.css\r\n***************************\/\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif,\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif #reader-domain {\r\nfont-family: \"courier new\" !important;\r\n}\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif {\r\nbackground-color: #13131F !important;\r\ncolor: #BAE3DB !important;\r\n}\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif #reader-domain {\r\nfont-style: italic !important;\r\n}\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif h1,\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif h2,\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif h3,\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif h4,\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif h5 {\r\ncolor: #06FEB0 !important;\r\n}\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif a:link {\r\ncolor: #83E7FF !important;\r\n}\r\n:root[hasbrowserhandlers=\"true\"] body.dark.serif #container {\r\nmax-width: 50em !important;\r\n}<\/pre>\n
Note that it\u2019s necessary to use the !important<\/code> keyword in userContent.css<\/code> for all CSS rules<\/strong>. The browser adds user-specified property values before the values specified by the author<\/strong> (the developer of the given web page, here the Reader View).\n  Hence, any user-specified property value without the !important<\/code> keyword won\u2019t work if an author-specified stylesheet also targets the same property, as it will be overridden.<\/p>\n
Final Result<\/h3>\n
You can see the changes of my Reader View theme below. Use your own CSS rules to customize the design of your own personalized Firefox Reader View.<\/p>\n
Before<\/strong><\/em><\/p>\n
\"Default
default Firefox Reader View<\/figcaption><\/figure>\n
After<\/em><\/strong><\/p>\n
\"Customized
customized Firefox Reader View<\/figcaption><\/figure>\n
If you want to dive deeper in the theme customization of Firefox tools, check out my previous tutorial on the customization of the Firefox Developer Tools theme<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"
Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter such as images, ads, headers, and sidebars. Reader View is, however not available, for all home pages. If the feature is available for a certain page, you will…<\/p>\n","protected":false},"author":145,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[3397],"tags":[34,1760],"topic":[4521],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\nHow to Customize Firefox Reader View for Better Readability - Hongkiat<\/title>\n<meta name=\"description\" content=\"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter\" \/>\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-reader-view-theme-firefox\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Customize Firefox Reader View for Better Readability\" \/>\n<meta property=\"og:description\" content=\"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/\" \/>\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-08-01T15:19:17+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png\" \/>\n<meta name=\"author\" content=\"Preethi Ranjit\" \/>\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=\"Preethi Ranjit\" \/>\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\\\/customize-reader-view-theme-firefox\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/\"},\"author\":{\"name\":\"Preethi Ranjit\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/e981676afae36d1ff5feb75094950ab3\"},\"headline\":\"How to Customize Firefox Reader View for Better Readability\",\"datePublished\":\"2019-08-01T15:19:17+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/\"},\"wordCount\":617,\"commentCount\":6,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-reader-view-theme-firefox\\\/reader-view.png\",\"keywords\":[\"Firefox\",\"Firefox Tips\"],\"articleSection\":[\"Desktop\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/\",\"name\":\"How to Customize Firefox Reader View for Better Readability - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-reader-view-theme-firefox\\\/reader-view.png\",\"datePublished\":\"2019-08-01T15:19:17+00:00\",\"description\":\"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-reader-view-theme-firefox\\\/reader-view.png\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/customize-reader-view-theme-firefox\\\/reader-view.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/customize-reader-view-theme-firefox\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to Customize Firefox Reader View for Better Readability\"}]},{\"@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\\\/e981676afae36d1ff5feb75094950ab3\",\"name\":\"Preethi Ranjit\",\"description\":\"A .NET developer with a JavaScript background, Preethi is expert in front-end coding, JavaScript, HTML, and CSS.\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/preethi\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"How to Customize Firefox Reader View for Better Readability - Hongkiat","description":"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter","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-reader-view-theme-firefox\/","og_locale":"en_US","og_type":"article","og_title":"How to Customize Firefox Reader View for Better Readability","og_description":"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter","og_url":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2019-08-01T15:19:17+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png","type":"","width":"","height":""}],"author":"Preethi Ranjit","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Preethi Ranjit","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/"},"author":{"name":"Preethi Ranjit","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/e981676afae36d1ff5feb75094950ab3"},"headline":"How to Customize Firefox Reader View for Better Readability","datePublished":"2019-08-01T15:19:17+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/"},"wordCount":617,"commentCount":6,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png","keywords":["Firefox","Firefox Tips"],"articleSection":["Desktop"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/","url":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/","name":"How to Customize Firefox Reader View for Better Readability - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png","datePublished":"2019-08-01T15:19:17+00:00","description":"Reader View is a popular feature of the Firefox browser, that changes the appearance of a web page, and makes it more readable by removing visual clutter","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/customize-reader-view-theme-firefox\/reader-view.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/customize-reader-view-theme-firefox\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to Customize Firefox Reader View for Better Readability"}]},{"@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\/e981676afae36d1ff5feb75094950ab3","name":"Preethi Ranjit","description":"A .NET developer with a JavaScript background, Preethi is expert in front-end coding, JavaScript, HTML, and CSS.","url":"https:\/\/www.hongkiat.com\/blog\/author\/preethi\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-74c","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/27168","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\/145"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=27168"}],"version-history":[{"count":2,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/27168\/revisions"}],"predecessor-version":[{"id":30504,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/27168\/revisions\/30504"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=27168"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=27168"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=27168"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=27168"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}