Changing the envelope icon in the Entrepreneur base's main menu

[magicss]

Is there a way to change the ICON of the little Envelope to another icon (like a facebook fa icon)?

In base.php for entrepreneur,
the function jumpstart_ent_menu_addon,
has this:

$items .= '<a href="#"><i class="fa fa-envelope-o"></i></a>';

But, when I place the entire function
that is: all the code for jumpstart_ent_menu_addon from the word “function” all the way to the end of the line that includes “add_filter(‘wp_nav_menu_items’, ‘jumpstart_ent_menu_addon’, 10, 2);”
into my child theme’s functions.php and then change the envelope icon to another fa icon, it works on the internet only for a while and then my site crashes due to some php conflict.

I suppose this conflict has something to do with the need to unhook the Base.php function but I do not recall how to do this. I do not even recall if only actions can be unhooked.

How do I approach this?
What lines of code do I need to place in functions.php?

I realize I can change the code in the Base, but I believe in what you have taught me about child themes, so I place all changes there whenever possible.

Topic

[Jason Bobich]

There are several ways to tackle this. But the theme is already filtering wp_nav_menu_items which is a default WordPress filter on the outputted navigation. So, the simplest thing, I think, would just be to filter the output again after that, and swap out the part you want.

function my_nav_contact_icon( $items ) {
	return str_replace('envelope-o', 'facebook', $items);
}
add_filter('wp_nav_menu_items', 'my_nav_contact_icon', 11);

The above is a lot more simple than if you were going to do what I think you were attempting to do before, which would look more like this, when done correctly:

/**
 * Remove current filter from Jump Start
 */
remove_filter('wp_nav_menu_items', 'jumpstart_ent_menu_addon', 10);

/**
 * Copy previously hooked function, and change 
 * the name to something unique.
 */
function my_menu_addon( $items, $args ) {

	if ( themeblvd_get_option('header_text') ) {
		return $items; // header top bar is showing
	}
	
	if ( $args->theme_location != 'primary' ) {
		return $items; // not the main menu
	}
	
	if ( $icons = themeblvd_get_option('social_media') ) {
		
		$items .= '<li class="menu-item level-1 menu-contact">';
		$items .= '<a href="#" class="tb-contact-trigger menu-btn" tabindex="0" data-toggle="popover" data-container="body" data-placement="bottom" data-open="facebook" data-close="close"><i class="fa fa-facebook"></i></a>';
		
		$color = themeblvd_get_option('social_media_style');
		
		if ( $color == 'light' ) { // color can't be light cause it's in a white popover
			$color = 'grey';
		}
		
		$items .= sprintf('<div class="contact-popover-content hide">%s</div>', themeblvd_get_contact_bar($icons, array('tooltip' => false, 'style' => $color, 'class' => 'to-mobile')));
		$items .= '</li>';
	
	}
	
	if ( themeblvd_do_cart() ) {
		$items .= sprintf('<li class="menu-item level-1 menu-cart">%s</li>', themeblvd_get_cart_popup_trigger());
	}
	
	if ( themeblvd_get_option('searchform') == 'show' ) {
		$items .= sprintf('<li class="menu-item level-1 menu-search">%s</li>', themeblvd_get_floating_search_trigger(array('placement' => 'below', 'class' => 'menu-btn')));
	}

	return $items;
}

/**
 * Filter new function in
 */
add_filter('wp_nav_menu_items', 'my_menu_addon', 10, 2);

In PHP, a function can never be declared more than once. A function must be setup to be pluggable in order for you to just copy it over and do nothing else. So if you’re just copying random functions from the parent theme to your child theme, you’re going to get PHP fatal errors.

Pluggable functions used to be really popular in the WordPress theme world, and there are some that still exist in the Jump Start theme. However, they’re becoming less popular as the general entry-level dev people are starting to understand the basics of actions and filters.

[Jason Bobich]

Also, it’s probably worth nothing if you didn’t already figure this out from the theme options — If you setup your header text option, the social icons will display along with that header text in a bar above the main menu. Then, you won’t have the little envelope icon at all within your main menu.

[magicss]

Jason, you are amazing, and this method and info is outstanding.
-ss

[Author]

Replies