Documentation: WP Circular Menu

WP Circular Menu – Responsive Circular Menu Plugin for WordPress

Check out the plugin’s full features: View Plugin’s Full Features
Check out the plugin’s demo: View Plugin’s Demo

Installation Instructions

    • Unzip wp-circular-menu.zip
    • Upload all the files to the /wp-content/plugins/wp-circular-menu
    • Activate the plugin through the ‘Plugins’ menu in WordPress.

<liFirstly, setup default plugin’s settings, click on WP Circular Menu option menu in the left admin menu.

Plugin Introduction

WP Circular Menu is a Premium Circular Navigation Menu for WordPress which facilitates for easy and quick navigation within your site.

Once the plugin is installed and activated you will find a menu named “WP Circular Menu” in the left menu bar of the admin menu. Once you click on that menu, you will go to the menu listing page. You can click on Add New. But before that let’s create a menu first.

View Plugin Full Features

View Plugin Demo

A) Creating a Menu

You will need to need to configure a WordPress Menu before you can begin creating your circular menu. So,
WP FB Review Showcase All reviews lists

  • Go to Dashboard-> Appearance-> Menus.
  • Click on Create a Menu, to create a new menu.
  • Provide a menu name and click on Create Menu.
  • Go to Screen Option on the top of the Menu Page and check WP Circular Menu under Boxes.
  • Locate the WP Circular Menu Meta boxes, Check on Use as circular menu option if you want use the current menu as Circular menu.
  • Select the Menu items you want to add to be menu and click on save menu. The menu supports 12 menu items except for template 9 which supports 8 menu item dues to design limitation. The plugin does not support sub-menus.
  • You will see the 8Degree Circular Menu icon on each Menu item, click on it to open a modular setting menu.

Unlike a normal menu this menu allows you to add things like, an icon, background image, alter Tooltip text to your individual menu item.

Menu Settings

  • Menu IconIcon Type
    • Font Icons: Circular Menu Supports a wide range of font icons including Dashicons, Font Awesome, Genericons, Linear Icons and Themify icons. Click button to select a font icon. You can also directly add icon code such as dashicons|dashicons-admin-site or fa|fa-envelope-o or genericon|genericon-aside or lnr|lnr-home or ti|ti-home.
    • Custom Icon: If icons are not a thing for you, you can upload your own icons images from the WordPress media library. Click button to upload media from media library or even directly place an image URL.
  • Menu Name
    • Hide/ Show Menu Name: In default, the circular menu will show the menu name label when you hover it. If you don’t want this feature, check this option to hide showing of the menu name on hover.
    • Custom Name: If you want to alter the menu name text then simply add text here to overwrite the default menu name.
  • Notification Label
    • Notification Text: Want to focus your viewers to a particular page? Have a hot sale going on your store? The circular menu allows to added static Notification label to let people know what is going on with each particular link.
  • Background
    • Image Background: Best suited for template 2 and not supported in template 3, 4 and 5, you can add background images in each of the menu list items.
  • You will need to first save the menu after any menu item change to see the 8Degree Circular Menu option in the newly added menu items.

Once you have created your menu items, let’s create your first ever circular menu.

B) Configure WP Circular Menu

  • Click on WP Circular Menu on the left admin panel.
  • Click on add new.
  • Enter title for your Circular menu.

You can configure the Circular menu in couple of steps, Let’s begin with

C) Build Circular Menu

 

Select the assigned Circular Menu here and begin configuring your circular menu.

Check Creating a Menu for WP Circular Menu to learn how to create a Circular menu.

D) Layout Settings

  • Select Template: Select any one of 9 prebuild ready to go templates. We offer 5 draggable templates and 4 fixed templates.
  • Initial position: Only available for draggable templates. You can set the initial position of the menu on page load.
  • Positions: Only available for fixed templates. Set a suitable fixed position for your menu to load on.
  • Animation: Select open and close animation.
  • Toggle Button:
    • Toggle Animation: Select a animation for toggle button
    • Customize: Check to customize the toggle button.
      • Icon colors: set open, close and hover color for the toggle bars.
      • Background: set open, close and hover color for toggle button background.
      • Border: set open, close and hover color and width for toggle button border.
  • Menu item:
    • Customize: Check to customize the Menu items.
      • Icon colors: set icon color, active color and hover color for the menu icons.
      • Background: set icon color, active color and hover color for the menu icon background.
      • Border: set icon color, active color and hover color for the menu icon background. Option available only in template 2, 3, 6 and 9.
      • Center Image: set an image background in the menu center. Option available only in template 1, 4 and 8
      • Center color: set an background color in the menu center. Option available only in template 1, 4 and 8
  • Notification label:
    • Choose template: Choose one of five template for your notification label.
    • Notificaition animation: Choose one of five animation for your notification label.
    • Customize: Check to customize the notification label.
      • Text colors: set text color for your notification label.
      • Background color: set background color for your notification label.
  • Tooltip:
    • Customize: Check to customize the tooltip.
      • Text colors: set text color for your tooltip.
      • Background color: set background color for your tooltip.
  • Typography:
    • Customize: Check to customize the typography.
      • Font family: select a font family.
      • Text transform: set top capitalize, lowercase or uppercase your tooltip and notification label.

E) Display Settings

You can set where to show or hide the Circular menu. These settings can be used to manage multiple menus in different pages. By default all menus are set to show in all pages. You can set where to show the menu and whom to show the menu to.

  • Permission Settings: Set to show the menu to All users/ Logged in users or Logged out users.
  • Hide Circular Menu in: Select the pages where you do not want to show this particular menu. The list should cover all the default WordPress Standard Pages and all the single pages of any custom post type. If you select the All Single Page option no menu will be shown in the single pages regardless of the particular page option below.

F) Using Shortcode

Begining from version 1.0.3, you can use shortcode to add any draggable template to your site. Here is how you can add a Circular menu via. Shortcode

  • Go to Template Settings and configure the Keep open, Hide Toggle Button option.
  • It is essential that you disable the Draggable property.
  • Go to Display settings and turn on the Use as shotcode and hide everywhere else option.
  • Go to the Extra option and turn of the responsive flat design.
  • Copy the shortcode from Shortcode Information metabox and paste it to your desired place.

Custom CSS

Custom CSS section can be handy to provide CSS rules or modify any of the default settings or cover any settings that we might have missed in the Custom Settings.

Turn the style you have written on or off from Enable Custom CSS Section option.


Themes Compatible with the Plugin :

WP Facebook Review Showcase works best with every WordPress theme. It’s even more remarkable when used with popular themes like VMagazine and AccessPress Parallax.

AND IF THIS PLUGIN HAS IMPRESSED YOU, THEN YOU WOULD ENJOY OUR OTHER PROJECTS TOO. DO CHECK THESE OUT :

WPAll Club – A complete WordPress resources club. WordPress tutorials, blogs, curated free and premium themes and plugins, WordPress deals, offers, hosting info and more.

Premium WordPress Themes – 6 premium WordPress themes well suited for all sort of websites. Professional, well coded and highly configurable themes for you.

Premium WordPress Plugins – 45+ premium WordPress plugins of many different types. High user ratings, great quality and best sellers in CodeCanyon marketplace.

AccessPress Themes – AccessPress Themes has 50+ beautiful and elegant, fully responsive, multipurpose themes to meet your need for free and commercial basis.

8Degree Themes – 8Degree Themes offers 15+ free WordPress themes and 16+ premium WordPress themes carefully crafted with creativity.

If you’ve any questions, please submit a ticket in our support system:
https://accesspressthemes.com/support
or

support@accesspressthemes.com

Also, you might want to check out,