{"id":9952,"date":"2024-03-03T10:31:00","date_gmt":"2024-03-03T10:31:00","guid":{"rendered":"https:\/\/codehim.com\/?p=9952"},"modified":"2024-03-04T08:31:15","modified_gmt":"2024-03-04T03:31:15","slug":"tooltip-box-with-arrow-in-css","status":"publish","type":"post","link":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/","title":{"rendered":"Tooltip Box with Arrow in CSS"},"content":{"rendered":"

This CSS code snippet helps you to design box with an arrow for the tooltip component<\/a>. Each tooltip has a defined color and shape without border-radius. It helps display information interactively by pointing to relevant elements.<\/p>\n

Basically, this code provides basic styling for the tooltip component, which you can integrate in your tooltip project to make it functional. It enhances user experience by providing helpful information or explanations when users hover over specific content. These tooltips can be customized in color, direction, and shape, making them versatile for various design needs.<\/p>\n

How to Create Tooltip Box With Arrow in CSS<\/h2>\n

1. Begin by setting up the HTML structure. Use <div><\/code> elements with the class “tooltip” and additional directional classes like “top,” “right,” “left,” or “bottom” to determine the arrow’s direction within the tooltip.<\/p>\n

<div class=\"tooltip top\" style=\"--c: #79bd9a;\">This is a simple Tooltip with a solid coloration and without border radius <\/div>\r\n<div class=\"tooltip right\" style=\"--c: #8a9b0f;\">This is a simple Tooltip with a solid coloration and without border radius <\/div>\r\n<div class=\"tooltip left\" style=\"--c: #eb6841;\">This is a simple Tooltip with a solid coloration and without border radius <\/div>\r\n<div class=\"tooltip bottom\">This is a simple Tooltip with a solid coloration and without border radius <\/div><\/pre>\n
2. In the CSS section, define the styles for the tooltips and arrow pointers. The variables --b<\/code> (base) and --h<\/code> (height) control the arrow’s dimensions. Customize the colors, font size, padding, and other properties according to your design preferences.<\/p>\n
For each directional class (top, right, left, bottom), define the clip-path property within the CSS. Clip-path shapes the arrow by specifying coordinates.<\/p>\n
.tooltip {\r\n  \/* triangle dimension *\/\r\n  --b: 2em; \/* base *\/\r\n  --h: 1em; \/* height*\/\r\n\r\n  border-image: fill 0\/\/var(--h)\r\n    conic-gradient(var(--c,#CC333F) 0 0); \r\n margin: 5px;\r\n}\r\n.bottom {\r\n  clip-path: \r\n    polygon(0 100%,0 0,100% 0,100% 100%,\r\n      calc(50% + var(--b)\/2) 100%,\r\n      50% calc(100% + var(--h)),\r\n      calc(50% - var(--b)\/2) 100%);\r\n}\r\n.top {\r\n  clip-path: \r\n    polygon(0 0,0 100%,100% 100%,100% 0,\r\n      calc(50% + var(--b)\/2) 0,\r\n      50% calc(-1*var(--h)),\r\n      calc(50% - var(--b)\/2) 0);\r\n}\r\n.right {\r\n  clip-path: \r\n    polygon(100% 100%,0 100%,0 0,100% 0,\r\n      100% calc(50% - var(--b)\/2),\r\n      calc(100% + var(--h)) 50%,\r\n      100% calc(50% + var(--b)\/2));\r\n}\r\n.left {\r\n  clip-path: \r\n    polygon(0 100%,100% 100%,100% 0,0 0,\r\n      0 calc(50% - var(--b)\/2),\r\n      calc(-1*var(--h)) 50%,\r\n      0 calc(50% + var(--b)\/2));\r\n}\r\n\r\nbody {\r\n  margin: 0;\r\n  min-height: 100vh;\r\n  display: grid;\r\n  place-content: center;\r\n  grid-template-columns: auto auto;\r\n  gap: 30px;\r\n  text-align: center;\r\n  background: #f2f2f2;\r\n}\r\n.tooltip {\r\n  color: #fff;\r\n  font-size: 20px;\r\n  font-weight: 500;\r\n  font-family: sans-serif;\r\n  padding: 1em;\r\n  max-width: 25ch;\r\n}<\/pre>\n
Feel free to customize colors, dimensions, and other properties by adjusting the variables and styles to match your project’s design.<\/p>\n
That’s all! hopefully, you have successfully created Tooltip Box With Arrow In Css. If you have any questions or suggestions, feel free to comment below.<\/p>\n","protected":false},"excerpt":{"rendered":"
This CSS code snippet helps you to design box with an arrow for the tooltip component. Each tooltip has a…<\/p>\n","protected":false},"author":1,"featured_media":9959,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[63],"tags":[65],"class_list":["post-9952","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-html5-css3","tag-tooltip"],"acf":[],"yoast_head":"\nTooltip Box with Arrow in CSS — CodeHim<\/title>\n<meta name=\"description\" content=\"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Tooltip Box with Arrow in CSS — CodeHim\" \/>\n<meta property=\"og:description\" content=\"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\" \/>\n<meta property=\"og:site_name\" content=\"CodeHim\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/codehimofficial\" \/>\n<meta property=\"article:published_time\" content=\"2024-03-03T10:31:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-03-04T03:31:15+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1280\" \/>\n\t<meta property=\"og:image:height\" content=\"960\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Asif Mughal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:site\" content=\"@CodeHimOfficial\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Asif Mughal\" \/>\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:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\"},\"author\":{\"name\":\"Asif Mughal\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\"},\"headline\":\"Tooltip Box with Arrow in CSS\",\"datePublished\":\"2024-03-03T10:31:00+00:00\",\"dateModified\":\"2024-03-04T03:31:15+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\"},\"wordCount\":244,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png\",\"keywords\":[\"Tooltip\"],\"articleSection\":[\"HTML5 & CSS3\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\",\"url\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\",\"name\":\"Tooltip Box with Arrow in CSS — CodeHim\",\"isPartOf\":{\"@id\":\"https:\/\/codehim.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png\",\"datePublished\":\"2024-03-03T10:31:00+00:00\",\"dateModified\":\"2024-03-04T03:31:15+00:00\",\"description\":\"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.\",\"breadcrumb\":{\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage\",\"url\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png\",\"contentUrl\":\"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png\",\"width\":1280,\"height\":960,\"caption\":\"Tooltip Box with Arrow in CSS\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/codehim.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML5 & CSS3\",\"item\":\"https:\/\/codehim.com\/category\/html5-css3\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Tooltip Box with Arrow in CSS\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/codehim.com\/#website\",\"url\":\"https:\/\/codehim.com\/\",\"name\":\"CodeHim\",\"description\":\"Web Design Code Snippets\",\"publisher\":{\"@id\":\"https:\/\/codehim.com\/#organization\"},\"alternateName\":\"Web Design Codes\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/codehim.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/codehim.com\/#organization\",\"name\":\"CodeHim - Web Design Code & Scripts\",\"url\":\"https:\/\/codehim.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\",\"url\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"contentUrl\":\"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg\",\"width\":280,\"height\":280,\"caption\":\"CodeHim - Web Design Code & Scripts\"},\"image\":{\"@id\":\"https:\/\/codehim.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/codehimofficial\",\"https:\/\/x.com\/CodeHimOfficial\",\"https:\/\/www.instagram.com\/codehim\/\",\"https:\/\/www.linkedin.com\/company\/codehim\",\"https:\/\/co.pinterest.com\/codehim\/\",\"https:\/\/www.youtube.com\/@codehim\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed\",\"name\":\"Asif Mughal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/codehim.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g\",\"caption\":\"Asif Mughal\"},\"description\":\"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.\",\"sameAs\":[\"https:\/\/codehim.com\"],\"url\":\"https:\/\/codehim.com\/author\/asif-mughal\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Tooltip Box with Arrow in CSS — CodeHim","description":"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.","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:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/","og_locale":"en_US","og_type":"article","og_title":"Tooltip Box with Arrow in CSS — CodeHim","og_description":"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.","og_url":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/","og_site_name":"CodeHim","article_publisher":"https:\/\/www.facebook.com\/codehimofficial","article_published_time":"2024-03-03T10:31:00+00:00","article_modified_time":"2024-03-04T03:31:15+00:00","og_image":[{"width":1280,"height":960,"url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png","type":"image\/png"}],"author":"Asif Mughal","twitter_card":"summary_large_image","twitter_creator":"@CodeHimOfficial","twitter_site":"@CodeHimOfficial","twitter_misc":{"Written by":"Asif Mughal","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#article","isPartOf":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/"},"author":{"name":"Asif Mughal","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed"},"headline":"Tooltip Box with Arrow in CSS","datePublished":"2024-03-03T10:31:00+00:00","dateModified":"2024-03-04T03:31:15+00:00","mainEntityOfPage":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/"},"wordCount":244,"commentCount":0,"publisher":{"@id":"https:\/\/codehim.com\/#organization"},"image":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png","keywords":["Tooltip"],"articleSection":["HTML5 & CSS3"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/","url":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/","name":"Tooltip Box with Arrow in CSS — CodeHim","isPartOf":{"@id":"https:\/\/codehim.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage"},"image":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage"},"thumbnailUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png","datePublished":"2024-03-03T10:31:00+00:00","dateModified":"2024-03-04T03:31:15+00:00","description":"Here is a free code snippet to create a Tooltip Box with Arrow in CSS. You can view demo and download the source code.","breadcrumb":{"@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#primaryimage","url":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png","contentUrl":"https:\/\/codehim.com\/wp-content\/uploads\/2023\/11\/Tooltip-Box-with-Arrow-in-CSS.png","width":1280,"height":960,"caption":"Tooltip Box with Arrow in CSS"},{"@type":"BreadcrumbList","@id":"https:\/\/codehim.com\/html5-css3\/tooltip-box-with-arrow-in-css\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/codehim.com\/"},{"@type":"ListItem","position":2,"name":"HTML5 & CSS3","item":"https:\/\/codehim.com\/category\/html5-css3\/"},{"@type":"ListItem","position":3,"name":"Tooltip Box with Arrow in CSS"}]},{"@type":"WebSite","@id":"https:\/\/codehim.com\/#website","url":"https:\/\/codehim.com\/","name":"CodeHim","description":"Web Design Code Snippets","publisher":{"@id":"https:\/\/codehim.com\/#organization"},"alternateName":"Web Design Codes","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/codehim.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/codehim.com\/#organization","name":"CodeHim - Web Design Code & Scripts","url":"https:\/\/codehim.com\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/","url":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","contentUrl":"http:\/\/codehim.com\/wp-content\/uploads\/2023\/06\/Codehim-short-logo.jpg","width":280,"height":280,"caption":"CodeHim - Web Design Code & Scripts"},"image":{"@id":"https:\/\/codehim.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/codehimofficial","https:\/\/x.com\/CodeHimOfficial","https:\/\/www.instagram.com\/codehim\/","https:\/\/www.linkedin.com\/company\/codehim","https:\/\/co.pinterest.com\/codehim\/","https:\/\/www.youtube.com\/@codehim"]},{"@type":"Person","@id":"https:\/\/codehim.com\/#\/schema\/person\/cc48f1dbe072a89a62a98171b7db43ed","name":"Asif Mughal","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/codehim.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/b25bfcd7d4e341c2c6f785a88d8ad2a4?s=96&d=mm&r=g","caption":"Asif Mughal"},"description":"I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences. I truly enjoy what I'm doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.","sameAs":["https:\/\/codehim.com"],"url":"https:\/\/codehim.com\/author\/asif-mughal\/"}]}},"views":1833,"_links":{"self":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9952","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/comments?post=9952"}],"version-history":[{"count":1,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9952\/revisions"}],"predecessor-version":[{"id":11318,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/posts\/9952\/revisions\/11318"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media\/9959"}],"wp:attachment":[{"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/media?parent=9952"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/categories?post=9952"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/codehim.com\/wp-json\/wp\/v2\/tags?post=9952"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}