{"id":7363,"date":"2020-02-06T07:02:31","date_gmt":"2020-02-06T07:02:31","guid":{"rendered":""},"modified":"2024-11-14T12:03:49","modified_gmt":"2024-11-14T12:03:49","slug":"flutter-avatar-widget-component","status":"publish","type":"post","link":"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/","title":{"rendered":"How to Design Flutter Circle Avatar Image With example Code"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_80 ez-toc-wrap-center counter-hierarchy ez-toc-counter ez-toc-custom ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title ez-toc-toggle\" style=\"cursor:pointer\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #ffffff;color:#ffffff\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #ffffff;color:#ffffff\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#what-is-the-flutter-image-avatar-widget\" >What is the Flutter Image Avatar Widget?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#where-to-use-the-flutter-image-avatar-widget\" >Where to use the Flutter Image Avatar Widget?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#gf-flutter-avatar-has-different-types-of-avatars\" >GF Flutter Avatar has different types of Avatars :<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#flutter-circular-avatar-image\" >Flutter Circular Avatar Image<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#flutter-standard-avatar-image\" >Flutter Standard Avatar Image<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#flutter-square-avatar-image\" >Flutter Square Avatar Image<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#how-to-start\" >How to Start:<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#how-to-set-the-flutter-circle-avatar-border\" >How to set the Flutter circle avatar border?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#what-should-be-the-flutter-circle-avatar-image-width\" >What should be the Flutter circle avatar image width?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#could-we-use-a-flutter-avatar-card-with-a-circular-avatar\" >Could we use a Flutter avatar card with a Circular Avatar?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/www.getwidget.dev\/blog\/flutter-avatar-widget-component\/#could-we-use-flutter-circle-avatar-elevation\" >Could we use Flutter Circle avatar elevation?<\/a><\/li><\/ul><\/nav><\/div>\n<h2 id=\"what-is-the-flutter-image-avatar-widget\"><span class=\"ez-toc-section\" id=\"what-is-the-flutter-image-avatar-widget\"><\/span>What is the Flutter Image Avatar Widget?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/docs.getwidget.dev\/gf-avatar\/\" target=\"_blank\" rel=\"noopener\"><strong>Flutter Avatar<\/strong><\/a> is a component that has been used to show the user image or icon in specific sizes and shapes. It is used to show the user profile image in a circular shape. Generally, an Avatar is an Image and that image should have a specific shape. In the case of Avatar does not have an image icon then it typically has a user initial with text.<\/p>\n<p>GFAvatar is a <a href=\"https:\/\/docs.getwidget.dev\/\" target=\"_blank\" rel=\"noopener\"><strong>GetWidget<\/strong><\/a> UI Library widget component that has rich options for Avatars. GFAvatars can be used alone or inside another component as per your requirement. The position, size, border radius, etc can be easily customized by applying the properties.<\/p>\n<h2 id=\"where-to-use-the-flutter-image-avatar-widget\"><span class=\"ez-toc-section\" id=\"where-to-use-the-flutter-image-avatar-widget\"><\/span>Where to use the Flutter Image Avatar Widget?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Any application does have a requirement to sign up\/sign in a feature we do require an Avatar. In real-time applications nowadays there are multiple images used to show the user&#8217;s profile image, buyer&#8217;s image, seller&#8217;s image, etc in specific shapes &amp; sizes else using an initial of the user&#8217;s profile name. For example, we can take any social or company communication channel app where we need to show the user&#8217;s profile images throughout the application. So GFAvatar comes here with a set of shapes &amp; sizes of Avatars.<\/p>\n<h2 id=\"gf-flutter-avatar-has-different-types-of-avatars\"><span class=\"ez-toc-section\" id=\"gf-flutter-avatar-has-different-types-of-avatars\"><\/span>GF Flutter Avatar has different types of Avatars :<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h2 id=\"flutter-circular-avatar-image\"><span class=\"ez-toc-section\" id=\"flutter-circular-avatar-image\"><\/span>Flutter Circular Avatar Image<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/docs.getwidget.dev\/gf-avatar\/#circular-avatar\/\" target=\"_blank\" rel=\"noopener\"><strong>Flutter Circle Avatar<\/strong><\/a> is most commonly used for applications. It typically represents an image in a circular shape or the user&#8217;s initial if the image is not used. The real-time app examples are Facebook, Twitter, Instagram, Linked In, and others. By using this you can create a circle avatar image in Flutter<\/p>\n<figure class=\"kg-card kg-image-card\"><img decoding=\"async\" class=\"kg-image lazyload\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" data-src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/circular-avatars-2x_YEAePfrqD_-gE8M4y47.webp\" alt=\"Circle avatar image flutter\" width=\"800\" height=\"137\" \/><noscript><img decoding=\"async\" class=\"kg-image lazyload\" src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/circular-avatars-2x_YEAePfrqD_-gE8M4y47.webp\" alt=\"Circle avatar image flutter\" width=\"800\" height=\"137\" \/><\/noscript><\/figure>\n<h2 id=\"flutter-standard-avatar-image\"><span class=\"ez-toc-section\" id=\"flutter-standard-avatar-image\"><\/span>Flutter Standard Avatar Image<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/docs.getwidget.dev\/gf-avatar\/#standard-avatar\/\" target=\"_blank\" rel=\"noopener\"><strong>Flutter Standard Widget<\/strong><\/a> is commonly used for the Dev forum community or the public forum community. In this, an image is used to represent a person&#8217;s image in a slightly cornered shape.<\/p>\n<figure class=\"kg-card kg-image-card\"><img decoding=\"async\" class=\"kg-image lazyload\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" data-src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/slightly-rounded-corners-2x_VCB3GCS2h_fIj6SKS1L.webp\" alt=\"Flutter Standard Avatar Image\" width=\"800\" height=\"137\" \/><noscript><img decoding=\"async\" class=\"kg-image lazyload\" src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/slightly-rounded-corners-2x_VCB3GCS2h_fIj6SKS1L.webp\" alt=\"Flutter Standard Avatar Image\" width=\"800\" height=\"137\" \/><\/noscript><\/figure>\n<h2 id=\"flutter-square-avatar-image\"><span class=\"ez-toc-section\" id=\"flutter-square-avatar-image\"><\/span>Flutter Square Avatar Image<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>This is a representation of an image profile into a square shape. In this avatar, your profile image edges will be a square instead of standard and circle.<\/p>\n<figure class=\"kg-card kg-image-card\"><img decoding=\"async\" class=\"kg-image lazyload\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" data-src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/square-2x_Zs-9r00cm_xeDrjlBV7.webp\" alt=\"Flutter Square Avatar Image \" width=\"800\" height=\"137\" \/><noscript><img decoding=\"async\" class=\"kg-image lazyload\" src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/getwidget\/\/2023\/05\/square-2x_Zs-9r00cm_xeDrjlBV7.webp\" alt=\"Flutter Square Avatar Image \" width=\"800\" height=\"137\" \/><\/noscript><\/figure>\n<h2 id=\"how-to-start\"><span class=\"ez-toc-section\" id=\"how-to-start\"><\/span>How to Start:<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/docs.getwidget.dev\/getting-started\/\" target=\"_blank\" rel=\"noopener\"><strong>Getting started<\/strong><\/a> will guide you on how to start building a beautiful flutter application with the <strong>GetWidget<\/strong> <strong>UI library<\/strong>. You have to install the package from <strong>pub.dev<\/strong>, import the package in your Flutter project.<\/p>\n<blockquote><p><em>Install Package from pub.dev :<\/em><\/p><\/blockquote>\n<p><a href=\"https:\/\/pub.dev\/packages\/getwidget\/\" target=\"_blank\" rel=\"noopener\"><strong>https:\/\/pub.dev\/packages\/getwidget<\/strong><\/a><\/p>\n<h3 id=\"import-full-package\">Import full package:<\/h3>\n<p>import &#8216;package:getwidget\/getwidget.dart&#8217;;<\/p>\n<p><strong>Note: dependencies: getwidget: ^4.0.0<\/strong><\/p>\n<blockquote><p><em>Keep playing with the pre-built UI components.<\/em><\/p><\/blockquote>\n<h3 id=\"example-to-add-a-circle-avatar-image-in-flutter-with-property\">Example to add a circle avatar image in Flutter with property<\/h3>\n<pre><code class=\"language-javascript\">import 'package:getwidget\/getwidget.dart';\n\nGFAvatar(\n  backgroundImage:NetworkImage(AvatarUrl);\n)<\/code><\/pre>\n<h3 id=\"example-to-add-a-standard-avatar-image-in-flutter-with-property\">Example to add a standard avatar image in Flutter with property<\/h3>\n<p>&#8220;<em>shape: GFAvatarShape.standard<\/em>&#8220;, add this property to the code to get the standard shape with slightly rounded corners.<\/p>\n<pre><code class=\"language-javascript\">import 'package:getwidget\/getwidget.dart';\n\nGFAvatar(\n  backgroundImage:NetworkImage(AvatarUrl);\n  shape: GFAvatarShape.standard\n)<\/code><\/pre>\n<h3 id=\"example-to-add-a-square-avatar-image-in-flutter-with-property\">Example to add a square avatar image in Flutter with property<\/h3>\n<p>&#8220;<em>shape: GFAvatarShape.square<\/em>&#8220;, add this property to the code to get the square shape with no rounded corners.<\/p>\n<pre><code class=\"language-javascript\">import 'package:getwidget\/getwidget.dart';\n\nGFAvatar(\n  backgroundImage:NetworkImage(AvatarUrl);\n  shape: GFAvatarShape.square\n)<\/code><\/pre>\n<p>The look and feel of <strong>GFAvatar<\/strong> can be customized more according to the needs using the following properties:<\/p>\n<table>\n<thead>\n<tr>\n<th>Name<\/th>\n<th>Description<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td><strong>child<\/strong><\/td>\n<td>type of [Widget], which can have text, icon, etc<\/td>\n<\/tr>\n<tr>\n<td><strong>backgroundColor<\/strong><\/td>\n<td>GFColor or Color to fill the background of the avatar<\/td>\n<\/tr>\n<tr>\n<td><strong>foregroundColor<\/strong><\/td>\n<td>GFColor or Color to change the textColor inside the avatar<\/td>\n<\/tr>\n<tr>\n<td><strong>radius<\/strong><\/td>\n<td>size of the avatar<\/td>\n<\/tr>\n<tr>\n<td><strong>minRadius<\/strong><\/td>\n<td>minimum size of the avatar<\/td>\n<\/tr>\n<tr>\n<td><strong>maxRadius<\/strong><\/td>\n<td>maximum size of the avatar<\/td>\n<\/tr>\n<tr>\n<td><strong>size<\/strong><\/td>\n<td>size of the avatar i.e\u00a0<code style=\"font-family: source-code-pro, Menlo, Monaco, Consolas,;\">GFSize.large, GFSize.medium, GFSize.small<\/code><\/td>\n<\/tr>\n<tr>\n<td><strong>shape<\/strong><\/td>\n<td>shape of the avatar i.e,\u00a0<code style=\"font-family: source-code-pro, Menlo, Monaco, Consolas,;\">GFAvatarShape.standard, GFAvatarShape.circle, GFAvatarShape.square<\/code><\/td>\n<\/tr>\n<tr>\n<td><strong>borderRadius<\/strong><\/td>\n<td>extra radius to avatar shapes, not applicable to the circular avatar<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<h2 id=\"how-to-set-the-flutter-circle-avatar-border\"><span class=\"ez-toc-section\" id=\"how-to-set-the-flutter-circle-avatar-border\"><\/span>How to set the Flutter circle avatar border?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Yes, You can use the border in the Flutter circle avatar image in your application. It might give a nice representation of your user&#8217;s profile. Avatar border is mainly used when your application has a requirement of different levels for users based on their users. e.g. if you would like to set up a users mode like initial, intermediate, or expert then you can provide Avatar border with different color variants to represent users&#8217; profiles<\/p>\n<p><strong>Also Read &#8211;<\/strong> <a href=\"https:\/\/www.getwidget.dev\/blog\/choosing-right-flutter-app-development-company\/\">How to Choose the Right Flutter App Development Company: A Comprehensive Guide<\/a><\/p>\n<h2 id=\"what-should-be-the-flutter-circle-avatar-image-width\"><span class=\"ez-toc-section\" id=\"what-should-be-the-flutter-circle-avatar-image-width\"><\/span>What should be the Flutter circle avatar image width?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>There is not a specific width size that has been declared for a circular avatar image. It depends on your application design and your requirements. e.g If you can check Facebook has a different size of their user&#8217;s profile avatar and Twitter has a different avatar.<\/p>\n<h2 id=\"could-we-use-a-flutter-avatar-card-with-a-circular-avatar\"><span class=\"ez-toc-section\" id=\"could-we-use-a-flutter-avatar-card-with-a-circular-avatar\"><\/span>Could we use a Flutter avatar card with a Circular Avatar?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Yes, We can use the <a href=\"https:\/\/www.getwidget.dev\/blog\/flutter-card-widget\/\">Flutter avatar card <\/a>with circle avatar in Flutter App. It will give a nice representation for users with additional and specific details.<\/p>\n<h2 id=\"could-we-use-flutter-circle-avatar-elevation\"><span class=\"ez-toc-section\" id=\"could-we-use-flutter-circle-avatar-elevation\"><\/span>Could we use Flutter Circle avatar elevation?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Yes, we can use circle avatar elevation in the Flutter application. You might use it through material or card packages.<\/p>\n<p><a href=\"https:\/\/docs.getwidget.dev\/\" target=\"_blank\" rel=\"noopener\"><strong>Flutter Get Widget Docs<\/strong><\/a><\/p>\n<figure class=\"kg-card kg-bookmark-card\">\n<div class=\"kg-bookmark-content\">\n<div class=\"kg-bookmark-title\">Flutter GetWidget Docs<\/div>\n<div class=\"kg-bookmark-description\">Get Widget is one of the largest Flutter open-source UI Kit libraries for mobile or web apps. It has more than 1000+ pre-built reusable widgets.<\/div>\n<div class=\"kg-bookmark-metadata\"><img decoding=\"async\" class=\"kg-bookmark-icon lazyload\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" data-src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/favicon_QkjfdlGz1.png\" alt=\"\" \/><noscript><img decoding=\"async\" class=\"kg-bookmark-icon lazyload\" src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/favicon_QkjfdlGz1.png\" alt=\"\" \/><\/noscript><span class=\"kg-bookmark-author\">getwidget<\/span><span class=\"kg-bookmark-publisher\">getwidget<\/span><\/div>\n<\/div>\n<div class=\"kg-bookmark-thumbnail\"><img decoding=\"async\" class=\"lazyload\" src=\"data:image\/gif;base64,R0lGODlhAQABAIAAAAAAAP\/\/\/yH5BAEAAAAALAAAAAABAAEAAAIBRAA7\" data-src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/docs\/tr:dpr-auto,tr:w-auto\/link-share_aT-cHzGY9.png\" alt=\"\" \/><noscript><img decoding=\"async\" class=\"lazyload\" src=\"https:\/\/ik.imagekit.io\/ionicfirebaseapp\/docs\/tr:dpr-auto,tr:w-auto\/link-share_aT-cHzGY9.png\" alt=\"\" \/><\/noscript><\/div>\n<\/figure>\n<p><a href=\"https:\/\/github.com\/ionicfirebaseapp\/getwidget\/\" target=\"_blank\" rel=\"noopener\"><strong>GitHub Repository<\/strong><\/a>: Please do appreciate our work through Github start<\/p>\n<h3 id=\"conclusion\">Conclusion:<\/h3>\n<p>Here we discuss, what <a href=\"https:\/\/docs.getwidget.dev\/gf-avatar\" target=\"_blank\" rel=\"noopener\"><strong>Flutter Avatar<\/strong><\/a> Widget is. And how we can use and implement it into our Flutter app through the <strong>GetWidget<\/strong> Avatar component. Here, there are options to customize and use other types of Avatars.<\/p>\n<h3 id=\"about-our-team\">About Our Team:<\/h3>\n<p>We have been working on Flutter since Flutter launched in beta version in 2017. And our team have been putting hundreds and hundreds of hour to experiment and implementation of Flutter. As well as after successful delivery of enterprise and SAAS applications that have been used by more than 500+ businesses around the 119+ countries. Now we are in love with Flutter development and we are very passionate about Flutter development. Now it is something we are trying to give a small contribution to the <a href=\"https:\/\/www.getwidget.dev\/\" rel=\"noreferrer\">Flutter Dev Community<\/a>. If you need assistance for your next app development project you can <a href=\"https:\/\/www.getwidget.dev\/hire-flutter-developer\"><strong>hire flutter app developer<\/strong><\/a> from the <strong>GetWidget<\/strong> team<\/p>\n","protected":false},"excerpt":{"rendered":"A flutter Image avatar widget used to display the user&#8217;s profile image in different shapes like circular images, standard images, and Square Images.","protected":false},"author":1,"featured_media":5196,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_display_header_overlay":false,"csco_singular_sidebar":"","csco_page_header_type":"","footnotes":""},"categories":[139],"tags":[],"class_list":{"0":"post-7363","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","7":"category-flutter","8":"cs-entry"},"_links":{"self":[{"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/posts\/7363","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/comments?post=7363"}],"version-history":[{"count":2,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/posts\/7363\/revisions"}],"predecessor-version":[{"id":7860,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/posts\/7363\/revisions\/7860"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/media\/5196"}],"wp:attachment":[{"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/media?parent=7363"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/categories?post=7363"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.getwidget.dev\/blog\/wp-json\/wp\/v2\/tags?post=7363"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}