{"id":452,"date":"2019-10-07T13:29:56","date_gmt":"2019-10-07T13:29:56","guid":{"rendered":"https:\/\/bootstrapshuffle.com\/blog\/?p=452"},"modified":"2021-02-23T11:53:09","modified_gmt":"2021-02-23T11:53:09","slug":"using-advanced-editor-functions-to-modify-css-classes","status":"publish","type":"post","link":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/","title":{"rendered":"Using advanced editor functions to modify CSS classes."},"content":{"rendered":"\n<p class=\"mb-6 leading-loose\">We are very proud that you can very quickly create the first version of the layout using only the drag &amp; drop function in our editor.<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">However, this is not always enough. That&#8217;s why in this post, I will describe the advanced feature of HTML Structure, which is available after clicking &#8220;Content&#8221; on each component added to the project.<\/p>\n\n\n\n<figure class=\"wp-block-image my-4\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"480\" src=\"https:\/\/bootstrapshuffle.com\/blog\/wp-content\/uploads\/2019\/10\/open_component_content-8-1024x480.png\" alt=\"\" class=\"wp-image-492\" srcset=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/open_component_content-8-1024x480.png 1024w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/open_component_content-8-300x141.png 300w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/open_component_content-8-768x360.png 768w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/open_component_content-8.png 1114w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"mt-2 text-sm leading-loose text-center\">Click button to open Component Content settings.<\/figcaption><\/figure>\n\n\n\n<p class=\"mb-6 leading-loose\">Note: This description applies to both <a href=\"https:\/\/bootstrapshuffle.com\" class=\"text-brand-blue underline hover:no-underline\">Bootstrap Shuffle<\/a> and <a href=\"https:\/\/bulma.dev\" class=\"text-brand-blue underline hover:no-underline\">Bulma Builder<\/a>.<\/p>\n\n\n\n<h2 class=\"mt-4\" class=\"mb-6 text-3xl font-bold\">Visual Content and HTML Structure<\/h2>\n\n\n\n<p class=\"mb-6 leading-loose\">When you open the content panel, you will see two tabs (see the image below).<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">One is <strong>Visual Content<\/strong>, which allows you to change texts and images in your project.<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">The second is the <strong>HTML Structure<\/strong>. This is an option for more advanced users who know the given CSS library. It allows you to modify CSS classes directly from our panel.<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">Component content window is divided into two columns. <\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">I will start description from the right column because you know it well from the main application screen. This is a preview of the currently edited page with a small addition. The <strong>two side markers<\/strong> show which component you are editing.<\/p>\n\n\n\n<figure class=\"wp-block-image my-4\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"522\" src=\"https:\/\/bootstrapshuffle.com\/blog\/wp-content\/uploads\/2019\/10\/component_content-2-1024x522.png\" alt=\"\" class=\"wp-image-498\" srcset=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/component_content-2-1024x522.png 1024w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/component_content-2-300x153.png 300w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/component_content-2-768x392.png 768w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/component_content-2.png 1547w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"mt-2 text-sm leading-loose text-center\">Component Content settings.<\/figcaption><\/figure>\n\n\n\n<h2 class=\"mb-6 text-3xl font-bold\">What&#8217;s in the HTML Structure tab<\/h2>\n\n\n\n<p class=\"mb-6 leading-loose\">The left column is divided into two sections: <strong>Parents<\/strong> and <strong>Component<\/strong>. Parents are wrappers in which the component is located, thanks to them you can change CSS classes for body elements and the main container.<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">Each section has an HTML element tree. When you move over an item, it will be highlighted on the right in the preview so you can be sure which item will be edited.<\/p>\n\n\n\n<figure class=\"wp-block-image my-4\"><img decoding=\"async\" loading=\"lazy\" width=\"1024\" height=\"472\" src=\"https:\/\/bootstrapshuffle.com\/blog\/wp-content\/uploads\/2019\/10\/tag_hover-1-1024x472.png\" alt=\"\" class=\"wp-image-502\" srcset=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/tag_hover-1-1024x472.png 1024w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/tag_hover-1-300x138.png 300w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/tag_hover-1-768x354.png 768w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/tag_hover-1.png 1546w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"mt-2 text-sm leading-loose text-center\">Hover on an item will highlight it in preview.<\/figcaption><\/figure>\n\n\n\n<p class=\"mb-6 leading-loose\">After clicking the HTML tag, the class edit field will expand with the current classes assigned to the given element. You don&#8217;t need to know the names of all classes in the library because we have an auto-complete mechanism! Start writing, and we&#8217;ll tell you what classes are available.<\/p>\n\n\n\n<figure class=\"wp-block-image my-4\"><img decoding=\"async\" loading=\"lazy\" width=\"956\" height=\"351\" src=\"https:\/\/bootstrapshuffle.com\/blog\/wp-content\/uploads\/2019\/10\/autocomplete-1.png\" alt=\"\" class=\"wp-image-504\" srcset=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/autocomplete-1.png 956w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/autocomplete-1-300x110.png 300w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/autocomplete-1-768x282.png 768w\" sizes=\"(max-width: 956px) 100vw, 956px\" \/><figcaption class=\"mt-2 text-sm leading-loose text-center\">Autocomplete when typing class name.<\/figcaption><\/figure>\n\n\n\n<p class=\"mb-6 leading-loose\">The Component section has an additional &#8220;copy HTML&#8221; link that allows you to copy the entire item to the clipboard &#8211; if, for example, you would like to use it in another project.<\/p>\n\n\n\n<figure class=\"wp-block-image my-4\"><img decoding=\"async\" loading=\"lazy\" width=\"956\" height=\"380\" src=\"https:\/\/bootstrapshuffle.com\/blog\/wp-content\/uploads\/2019\/10\/copy_html-1.png\" alt=\"\" class=\"wp-image-506\" srcset=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/copy_html-1.png 956w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/copy_html-1-300x119.png 300w, https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/copy_html-1-768x305.png 768w\" sizes=\"(max-width: 956px) 100vw, 956px\" \/><figcaption class=\"mt-2 text-sm leading-loose text-center\">Copy component&#8217;s HTML to clipboard.<\/figcaption><\/figure>\n\n\n\n<p class=\"mb-6 leading-loose\">All changes made to this panel are saved in real-time.<\/p>\n\n\n\n<p class=\"mb-6 leading-loose\">Try the HTML Structure panel in any of our applications: <a href=\"https:\/\/bootstrapshuffle.com\" class=\"text-brand-blue underline hover:no-underline\">Bootstrap Shuffle<\/a> and <a href=\"https:\/\/bulma.dev\" class=\"text-brand-blue underline hover:no-underline\">Bulma Builder<\/a>.<br><\/p>\n","protected":false},"excerpt":{"rendered":"<p>We are very proud that you can very quickly create the first version of the layout using only the drag &amp; drop function in our editor. However, this is not always enough. That&#8217;s why in this post, I will describe the advanced feature of HTML Structure, which is available after clicking &#8220;Content&#8221; on each component [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":944,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4,2,12],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Using advanced editor functions to modify CSS classes. | Shuffle<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Using advanced editor functions to modify CSS classes. | Shuffle\" \/>\n<meta property=\"og:description\" content=\"We are very proud that you can very quickly create the first version of the layout using only the drag &amp; drop function in our editor. However, this is not always enough. That&#8217;s why in this post, I will describe the advanced feature of HTML Structure, which is available after clicking &#8220;Content&#8221; on each component [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\" \/>\n<meta property=\"og:site_name\" content=\"Shuffle\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/BootstrapShuffle\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-10-07T13:29:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-02-23T11:53:09+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/class_autocomplete-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"315\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Dawid Andrzejewski\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Dawid Andrzejewski\" \/>\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:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\"},\"author\":{\"name\":\"Dawid Andrzejewski\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/a2122b47f59449da5ac339f7f687f79d\"},\"headline\":\"Using advanced editor functions to modify CSS classes.\",\"datePublished\":\"2019-10-07T13:29:56+00:00\",\"dateModified\":\"2021-02-23T11:53:09+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\"},\"wordCount\":408,\"publisher\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/#organization\"},\"articleSection\":[\"Bootstrap\",\"Bootstrap Shuffle\",\"Builder\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\",\"url\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\",\"name\":\"Using advanced editor functions to modify CSS classes. | Shuffle\",\"isPartOf\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/#website\"},\"datePublished\":\"2019-10-07T13:29:56+00:00\",\"dateModified\":\"2021-02-23T11:53:09+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/shuffle.dev\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Using advanced editor functions to modify CSS classes.\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#website\",\"url\":\"https:\/\/shuffle.dev\/blog\/\",\"name\":\"Shuffle\",\"description\":\"Build Websites Faster with an AI Visual Editor\",\"publisher\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/shuffle.dev\/blog\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#organization\",\"name\":\"Shuffle\",\"url\":\"https:\/\/shuffle.dev\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/static.shuffle.dev\/blog\/uploads\/2021\/07\/logo.jpg\",\"contentUrl\":\"https:\/\/static.shuffle.dev\/blog\/uploads\/2021\/07\/logo.jpg\",\"width\":400,\"height\":400,\"caption\":\"Shuffle\"},\"image\":{\"@id\":\"https:\/\/shuffle.dev\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.linkedin.com\/company\/bootstrap-shuffle\/about\/\",\"https:\/\/www.facebook.com\/BootstrapShuffle\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/a2122b47f59449da5ac339f7f687f79d\",\"name\":\"Dawid Andrzejewski\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/8e22e371afd6378672a3664c09fb24fa?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/8e22e371afd6378672a3664c09fb24fa?s=96&d=mm&r=g\",\"caption\":\"Dawid Andrzejewski\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Using advanced editor functions to modify CSS classes. | Shuffle","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:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/","og_locale":"en_US","og_type":"article","og_title":"Using advanced editor functions to modify CSS classes. | Shuffle","og_description":"We are very proud that you can very quickly create the first version of the layout using only the drag &amp; drop function in our editor. However, this is not always enough. That&#8217;s why in this post, I will describe the advanced feature of HTML Structure, which is available after clicking &#8220;Content&#8221; on each component [&hellip;]","og_url":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/","og_site_name":"Shuffle","article_publisher":"https:\/\/www.facebook.com\/BootstrapShuffle\/","article_published_time":"2019-10-07T13:29:56+00:00","article_modified_time":"2021-02-23T11:53:09+00:00","og_image":[{"width":600,"height":315,"url":"https:\/\/static.shuffle.dev\/blog\/uploads\/2019\/10\/class_autocomplete-1.png","type":"image\/png"}],"author":"Dawid Andrzejewski","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Dawid Andrzejewski","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#article","isPartOf":{"@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/"},"author":{"name":"Dawid Andrzejewski","@id":"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/a2122b47f59449da5ac339f7f687f79d"},"headline":"Using advanced editor functions to modify CSS classes.","datePublished":"2019-10-07T13:29:56+00:00","dateModified":"2021-02-23T11:53:09+00:00","mainEntityOfPage":{"@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/"},"wordCount":408,"publisher":{"@id":"https:\/\/shuffle.dev\/blog\/#organization"},"articleSection":["Bootstrap","Bootstrap Shuffle","Builder"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/","url":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/","name":"Using advanced editor functions to modify CSS classes. | Shuffle","isPartOf":{"@id":"https:\/\/shuffle.dev\/blog\/#website"},"datePublished":"2019-10-07T13:29:56+00:00","dateModified":"2021-02-23T11:53:09+00:00","breadcrumb":{"@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/shuffle.dev\/blog\/2019\/10\/using-advanced-editor-functions-to-modify-css-classes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/shuffle.dev\/blog\/"},{"@type":"ListItem","position":2,"name":"Using advanced editor functions to modify CSS classes."}]},{"@type":"WebSite","@id":"https:\/\/shuffle.dev\/blog\/#website","url":"https:\/\/shuffle.dev\/blog\/","name":"Shuffle","description":"Build Websites Faster with an AI Visual Editor","publisher":{"@id":"https:\/\/shuffle.dev\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/shuffle.dev\/blog\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/shuffle.dev\/blog\/#organization","name":"Shuffle","url":"https:\/\/shuffle.dev\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/shuffle.dev\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/static.shuffle.dev\/blog\/uploads\/2021\/07\/logo.jpg","contentUrl":"https:\/\/static.shuffle.dev\/blog\/uploads\/2021\/07\/logo.jpg","width":400,"height":400,"caption":"Shuffle"},"image":{"@id":"https:\/\/shuffle.dev\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.linkedin.com\/company\/bootstrap-shuffle\/about\/","https:\/\/www.facebook.com\/BootstrapShuffle\/"]},{"@type":"Person","@id":"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/a2122b47f59449da5ac339f7f687f79d","name":"Dawid Andrzejewski","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/shuffle.dev\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/8e22e371afd6378672a3664c09fb24fa?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/8e22e371afd6378672a3664c09fb24fa?s=96&d=mm&r=g","caption":"Dawid Andrzejewski"}}]}},"_links":{"self":[{"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/posts\/452"}],"collection":[{"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/comments?post=452"}],"version-history":[{"count":12,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/posts\/452\/revisions"}],"predecessor-version":[{"id":514,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/posts\/452\/revisions\/514"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/media\/944"}],"wp:attachment":[{"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/media?parent=452"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/categories?post=452"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/shuffle.dev\/blog\/wp-json\/wp\/v2\/tags?post=452"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}