{"id":24,"date":"2024-01-28T15:12:20","date_gmt":"2024-01-28T15:12:20","guid":{"rendered":"https:\/\/akshatdeveloper.in\/extensions\/?p=24"},"modified":"2024-09-05T04:32:15","modified_gmt":"2024-09-05T04:32:15","slug":"circle-menu","status":"publish","type":"post","link":"https:\/\/akshatdeveloper.in\/extensions\/free\/circle-menu\/","title":{"rendered":"Circle Menu"},"content":{"rendered":"\n<p>This extension helps you to add a circular menu to your app with a lot of customizations.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Blocks<\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/1\/c\/1ccd34d0c0c1071d9ff8c2b7c31374bc81853d58.png\" alt=\"image\"\/><\/figure>\n\n\n\n<p><br><strong>Create<\/strong>&nbsp;&#8211; Creates circle menu.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/6\/a\/6ab9ab3fb3ee82fd6c0ef09412222dcfdde84e1a.png\" alt=\"component_method (1)\" width=\"240\" height=\"30\"><br><br><strong>OpenMenu<\/strong>&nbsp;&#8211; Opens the menu.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/b\/f\/bf8bb97631bd224cf22924146c711cb6ba491b3f.png\" alt=\"component_method (2)\" width=\"239\" height=\"30\"><br><br><strong>CloseMenu<\/strong>&nbsp;&#8211; Closes the menu.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/b\/5\/b591ff517c94a3f85e65fab075287e87d0d0ef9b.png\" alt=\"component_method (3)\" width=\"274\" height=\"26\"><br><br><strong>isMenuOpened<\/strong>&nbsp;&#8211; Returns if menu is opened.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/3\/2\/32704cef5ecd8336af4170d9a9d7ed5998a6a62d.png\" alt=\"component_method (4)\" width=\"265\" height=\"154\"><br><br><strong>SetMainMenu<\/strong>&nbsp;&#8211; Sets up main menu, set the icon color to -1 if you dont want to add any color<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/d\/a\/da9ffbefbb65faf199597fbd73e449a0ec32d805.png\" alt=\"component_method (5)\" width=\"264\" height=\"104\"><br><br><strong>AddSubMenu<\/strong>&nbsp;&#8211; Adds a sub menu, set the icon color to -1 if you dont want to add any color.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/a\/3\/a30293ba7d7cd48f4dc05e16c23d04e3d642d398.png\" alt=\"component_method (6)\" width=\"290\" height=\"54\"><br><br><strong>SetShadowRadius<\/strong>&nbsp;&#8211; Sets the shadow radius of menu.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/a\/f\/afa0cbfc61a5187a9184c7b56bca22c1391fb64f.png\" alt=\"component_method (7)\" width=\"249\" height=\"54\"><br><br><strong>SetIconSize<\/strong>&nbsp;&#8211; Sets the size of the menu icons.&nbsp;<code>Note:- This method may not work properly<\/code><\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/8\/f\/8f26e0b4a06e865ec1a545d81858c09346987364.png\" alt=\"component_method (8)\" width=\"232\" height=\"50\"><br><br><strong>Use Hex<\/strong>&nbsp;&#8211; For using hex color code.<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/d\/2\/d25288a6050c47c9056bf9ba48e85c9533fce591.png\" alt=\"component_event (1)\" width=\"289\" height=\"60\"><br><br><strong>OnMenuOpened<\/strong>&nbsp;&#8211; It is called when the menu has been opened<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/5\/b\/5b5209a2c5f87f9dcc5dc984d75de406b88e0410.png\" alt=\"component_event (2)\" width=\"281\" height=\"60\"><br><br><strong>OnMenuClosed<\/strong>&nbsp;&#8211; It is called when the menu has been closed<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/1\/6\/16b1c3e2d08ecccee362c51e7732d394f16cdbb5.png\" alt=\"image\"\/><\/figure>\n\n\n\n<p><br>Properties to control position on screen<\/p>\n\n\n\n<p><img loading=\"lazy\" decoding=\"async\" width=\"292\" height=\"85\" src=\"https:\/\/kodular-community.s3.dualstack.eu-west-1.amazonaws.com\/original\/3X\/6\/5\/65bd3a5487594e3801cb2d40cd1481ecd0d69adb.png\" alt=\"component_event\"><br><br><strong>OnMenuSelected<\/strong>&nbsp;&#8211; It is called when the menu item has been selected has been opened. Returns&nbsp;<code>id [int]<\/code>&nbsp;of the item<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Usage<\/h2>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"679\" height=\"500\" src=\"https:\/\/akshatdeveloper.in\/extensions\/wp-content\/uploads\/2024\/01\/image-5.png\" alt=\"\" class=\"wp-image-26\" srcset=\"https:\/\/akshatdeveloper.in\/extensions\/wp-content\/uploads\/2024\/01\/image-5.png 679w, https:\/\/akshatdeveloper.in\/extensions\/wp-content\/uploads\/2024\/01\/image-5-300x221.png 300w\" sizes=\"(max-width: 679px) 100vw, 679px\" \/><\/figure>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-1 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button has-custom-width wp-block-button__width-50\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/drive.google.com\/file\/d\/1uoCi01bJe21A-qDyOSXtCCrE1WCbPYOX\/view?usp=sharing\" target=\"_blank\" rel=\"noreferrer noopener\">Download<\/a><\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>This extension helps you to add a circular menu to your app with a lot of customizations.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_lock_modified_date":false,"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"categories":[6],"tags":[5,11,4,2],"class_list":["post-24","post","type-post","status-publish","format-standard","hentry","category-free","tag-akshat-developer-extensions","tag-circle-menu","tag-extension","tag-free"],"_links":{"self":[{"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/posts\/24"}],"collection":[{"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/comments?post=24"}],"version-history":[{"count":2,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/posts\/24\/revisions"}],"predecessor-version":[{"id":198,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/posts\/24\/revisions\/198"}],"wp:attachment":[{"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/media?parent=24"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/categories?post=24"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/akshatdeveloper.in\/extensions\/wp-json\/wp\/v2\/tags?post=24"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}