• ProBeaver Weekly
    Weekly for all things Beaver

  • Add arrow to menu items with sub-items in Beaver theme

    Want to make the default menu in Beaver Builder theme more usable? How about adding arrow icon to menu items that contain sub-items automatically? With arrows in place, user can easily identify which menu items contain sub menu-items and this also looks more professional.

    Before & After: Arrow icon next to menu items

    Arrow next to menu items with sub-items in beaver builder theme

    Code to add arrow next to menu items with sub-items

    1. In WordPress dashboard, go to Appearance > Editor.
    2. Click on “Stylesheet” style.css option. You should be using Beaver Builder child theme.
    3. Add the following code at bottom of the file.

    4. Save change by clicking “Update File” button and preview your website with menu sporting cool looking down arrow icon.

    Davinder Singh Kainth

    About Davinder Singh Kainth

    Davinder love creating and implementing online spaces. He has over a decade of experience reaching corners of: design, development, blogging and SEO. He also create digital products at SimpleProThemes.com and digital solutions at iGuiding.com

    6 Comments

    1. Roberto on August 16, 2016 at 1:11 pm

      Really useful. Bookmarking this one.
      Thanks Davinder!

    2. Hannu on August 19, 2016 at 6:15 am

      Nice! Thanks for the tip!

    3. Simon Kelly on September 15, 2016 at 9:54 pm

      Great tip Davinder, this is much better than manually adding the HTML to the menu.

    Leave a Comment





  • Pro Stuff

    for  Beaver Builder

    Pro Styles for Beaver

    Customize Beaver Builder Modules beautifully with pre-made CSS packs

    Creative9

    A premium modern agency template for Beaver Builder users