How to add text before and after of the Hamburger Icon in Divi

by Feb 11, 2020Projects, Tutorials0 comments

Hi, my dear Divi Manic,

Do you need to add a text before or after the hamburger icon of the Divi menu? Here it is another easy tutorial to follow.

You need a different code if you need to add a text on the right or on the left of the hamburger menu.

Text on the right

  1. Go to the CSS of your child theme, or go to: Divi > Theme customizer > Additional CSS
  2. Copy and paste this code:
    .mobile_menu_bar:after {
     position: relative !important;
     content: 'MENU';
     bottom: 9px;
     left: 10%;
     color: #000000;
    }
    

Text on the left

  1. Go to the CSS of your child theme, or go to: Divi > Theme customizer > Additional CSS
  2. Copy and paste this code:
    #et_mobile_nav_menu:before {
        content: 'MENU';
        font-size: 14px;
        position: absolute !important;
        bottom: 29px;
        right: 35px;
        color: #000000;
    }

That’s all. Enjoy your new menu!