Setting Custom icon in Profile Menu

You can change these icons in the members area :

 

 

Step 1

 

  1. Go to WP admin – Apperance – Menus , edit the profile menu.
  2. Enable CSS Classes from the screen options on top right
  3. Note the CSS Class of the icon you want to change :

Step 2

  1. Locate any good svg, https://iconmonstr.com/ is a good resource..
  2. Download the svg icon
  3. Edit SVG icon in text editor and copy the SVG icon

Step 3

  1. Add this code in child theme – functions.php or WPLMS Customizer – wplms_customizer.php
  2. Keep the information CSS class and SVG with you. Replace XXXX with CSS class from step 1 and
add_action('vibebp_component_icon',function($icon,$id){
        if($id == 'XXXXXX'){
            $icon = '
    
    ';
        }
        return $icon;
    },99,2);

Adding custom icon on Custom PAge

Custom pages can be added in profile menu.

You have to assign a component to the external page by adding classes :
“external_page bp-mycomponent-nav”

the mycomponent then sets as the component and you can set the icon by using code as :

and the end result is replaced icon.:

Leave a Reply

Your email address will not be published. Required fields are marked *