View Categories

How to Configure the Tab Bar Icons

Introduction #

The Tab Bar and More Menu in the Learndash App provide key navigation for your mobile users. With the updated Icon Pack, you can enhance visual consistency, choose from modern display styles, or revert to legacy icons for a familiar look.

This guide walks you through customizing the Tab Bar icons, applying styles, and previewing changes in the app.

Access the Tab Bar Settings #

  1. In your WordPress Dashboard, go to Learndash App > Menus.
  2. Locate the Tab Bar Menu section.

Customize Tab Bar Menu Options #

  1. To configure an item, click the dropdown arrow beside it (e.g., Home).
  1. Under Item Icon, click the icon box to open the Icon Selection Panel.

Select and Update Icons #

  1. Choose an icon from the Learndash/LegacyIcon Pack.
  2. Customize the icon using these settings:
    • Icon Style: Filled or Outline
    • Box Style: Circular or Square
    • Icon Color: Choose your brand color
  1. Click Select Icon to confirm your selection.

Preview and Save Changes #

  1. View the live icon preview on the right-hand panel.
  2. Once satisfied, click Save Menu to apply your changes.
  3. The app will reflect updated icons the next time it’s launched.

Using the Legacy Icon Pack #

  1. In Item Icon settings, switch to the Legacy tab.
  2. Choose your preferred icon from the classic set.
  1. Click Select Icon, then Save Menu.

Note: You can mix icons from both the Legacy and Updated Icon Packs.

Advantages of the Updated Icon Pack #

  • Bold Filled Style  for Active Tabs – Makes navigation clearer and more intuitive.
  • Multiple Display Styles – Choose from outline, filled, circular, or square for a custom look.
  • Improved Performance – Faster load times and smoother rendering compared to legacy icons.

Troubleshooting and FAQs #

Q: My new icons aren’t showing in the app.
 A: Force-close and reopen the Learndash App to clear cached settings and load the latest changes.

Q: I don’t see the new Icon Pack in the panel.
 A: Ensure your Learndash App plugin is up to date. The updated Icon Pack is available only in recent versions.

Q: The preview doesn’t update when I change the icon style or color.
 A: Click Select Icon to confirm your choice, then reload the page or scroll to trigger a refresh in the preview panel.

Updated on September 23, 2025