Circle Menu Widget Tutorial

Essential Classy Tab from Dashboad -> Widgets then enable Circle Menu Widget
Image
Now Drag and Drop Circle Menu widget
Image

10+ Direction Option.

Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image
Image

Main Menu

Image

Here you can manage Trigger on Click or Hover based.

Image

You can set Position as Absolute of Main Icon and Set It’s Offset.

Image

You can set Position as Fixed of Main Icon and Set It’s Offset.

Image

Additionaly manage Transform Effect on Main Menu Hover.

Image

Submenu option of Circle Menu

Image

Here you can use Icon, Image or Text.

Image

Additionaly in Url, We have URL, Email(mailto), Phone(tel).

Image

And for Styling, You can manage Color, Background, Border and Shadow in Repeater for Each submenu.

Image

Additionaly We have Tooltip option.

Image

You can manage Tooltip Arrow Postion.

Image
Image
Image
Image
Image

In Circle Menu Options, You can manage Circle Radius, Delay, Open Speed, Step In/Out and It’s Transition.

Image

In Circle Menu Options, We have Offset Option for Circle Menu Visible. Using this option you circle menu visible after X Scroll.

Image

Main Menu Style Tab

Image

In this tab, You can manage Width/Height of Main Menu.

For Text, You can manage Typography.

For Icon, You can manage Size.

And For Image, You can manage Image Size and It’s Border and Shadow for Normal and Hover. 

For General Styling, You can manage Color, Background, Border, Shadow and Text Shadow for Normal and Hover.

Sub Menu Style Tab

Image

In this tab, You can manage Width/Height of Main Menu.

For Text, You can manage Typography.

For Icon, You can manage Size.

And For Image, You can manage Image Size and It’s Border and Shadow for Normal and Hover. 

For General Styling, You can manage Color, Background, Border, Shadow and Text Shadow for Normal and Hover.

Tooltip Style Tab

Image

In this tab, You can manage Tooltip Visibility Enable/Disable for Mobile Device.

Here you can manage Padding and It’s Typography.

Additionaly,  You can styling Color, Background, Border and It’s Shadow.