---
title: "How to Create a Circle Menu in Elementor?"
url: https://theplusaddons.com/docs/create-a-circle-menu-in-elementor/
date: 2023-11-09
modified: 2026-04-10
author: "Aditya Sharma"
description: "Are you looking to create a circle menu on your Elementor website? Adding a circle menu can add a unique touch to your website. With the Circle Menu widget from..."
image: https://theplusaddons.com/wp-content/uploads/2023/11/How-to-Create-a-Circle-Menu-in-Elementor_-1024x536.jpg
word_count: 265
---

# How to Create a Circle Menu in Elementor?

## Key Takeaways

- Circle Menu widget from The Plus Addons for Elementor allows users to create a unique circle menu on their Elementor website.
- Users can manage the circle menu radius using the Circle Radius field in the Extra Options tab.
- The Circle Menu widget offers two trigger types: Hover to open on hover and Click to open on click.

Are you looking to create a circle menu on your Elementor website? Adding a circle menu can add a unique touch to your website.

With the Circle Menu widget from The Plus Addons for Elementor, you can easily add a circle menu on your Elementor website.

*To check the complete feature overview documentation of The Plus Addons for Elementor Circle Menu widget, [click here](/docs/circle-menu-widget-settings-overview/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-circle-menu/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

Add the Circle Menu widget to the page and follow the steps -

1. Select **Circle** from the **Icon Layout** section.

![](https://theplusaddons.com/wp-content/uploads/2023/11/circle-menu-circle-new.png)

2. Then, from the **Icon Direction** dropdown, select the appropriate menu open direction.

3. In the **Menu List** section, add the menu items.

Now, you should be able to see a beautiful circle menu.

From the **Extra Options** tab, you can fine tune the circle menu further. 

You can manage the circle menu radius from the **Circle Radius** field.

From the **Icon Delay** section, you can delay the menu closing. 

Then, from the **Menu Open Speed** section, you can manage the menu opening speed.

From the **Icon Step In** and **Icon Step Out** sections, you can manage menu item step in and step out duration.

You can select different transition effects from the **Icon Transition** dropdown.

Then, from the **Icon Trigger** dropdown, you can select the menu trigger type. Here, you’ll find two options - 

**Hover** - To open the circle menu on hover.

**Click** - To [open the circle menu on click](https://theplusaddons.com/docs//open-circle-menu-on-click-in-elementor/).

![circle menu circle demo](https://theplusaddons.com/wp-content/uploads/2023/11/circle-menu-circle-demo.gif)

## Frequently Asked Questions

**Q: What should I do if the circle menu doesn't appear after adding the widget?**
A: If the circle menu isn't showing up, ensure that The Plus Addons for Elementor is installed and activated. This plugin is essential for the Circle Menu widget to function properly. Additionally, check if you've selected 'Circle' from the Icon Layout section and added menu items in the Menu List section.

**Q: What are the best settings for a circle menu on a mobile website?**
A: For mobile websites, consider using the 'Click' option from the Icon Trigger dropdown to open the circle menu. This is more user-friendly on touch devices. Additionally, ensure that the circle menu radius is appropriate for smaller screens, so it remains accessible without overlapping other elements.

**Q: What happens if I set the Icon Step In and Icon Step Out durations too high?**
A: If you set the Icon Step In and Icon Step Out durations too high, the menu items may appear or disappear too slowly, which can frustrate users. It's best to keep these durations short for a snappier experience. Experiment with different values to find a balance that feels responsive.