Add Logo Inside Navigation Bar (before menu)

[Vasilis]

Hello awesome people!!!

I would like to add my logo (text) OR write it with larger fonts just before the menu links inside the Genesis navigation bar.

As far as I understand I would need to create a widget exactly before the menu links inside the navigation bar.

The theme I'm using is custom Genesis Sample.

Could you give me some ideas on this?

The website I want to add it is this => http://theVasilis.com

And I want to add my name "VASILIS STERGIOU" written with larger fonts (same font type) exactly before the menu links.

Thank you very much for your support 🙂

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Brad Dalton]

Try this http://wpsites.net/web-design/add-logo-nav-menu/

---

Tutorials for StudioPress Themes.

[Vasilis]

This reply has been marked as private.

[Susan]

@Vasilis:

Brad can't see private replies (only the original poster on the thread - {you} or an administrator or moderator {me} can see private replies).

If you want to contact Brad privately, you should reach out to him on his website: http://wpsites.net/services/wordpress-consulting/

[Vasilis]

@Susan:

Ok cool thanks for letting me know about this.

Bumping this post.

Anyone can come with a solution about this?

Wish you all happy holidays 🙂

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Vasilis]

This reply has been marked as private.

[rasor]

Try this plugin. Nav Menu Images. It's a little old. But still works.

---

rasor @ WPBasics.org | Buy me a coffee

[Vasilis]

Hey thanks for the suggestion

I checked it out but there are a lot of bugs going on with it so I would prefer a cleaner solution.

Thank you once again.

Any other ideas?

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[rasor]

add this to functions.php

/* Add Logo to Nav bar*/

add_filter( 'genesis_nav_items', 'ja_logo_to_nav', 10, 2 );
add_filter( 'wp_nav_menu_items', 'ja_logo_to_nav', 10, 2 );
/**
 * Based on tutorial Follow Icons in Menu
 * @author Bill Erickson
 * @link http://www.billerickson.net/genesis-wordpress-nav-menu-content/
 *
 * @param string $menu
 * @param array $args
 * @return string
 */
function ja_logo_to_nav($menu, $args) {
	$args = (array)$args;
	if ( 'primary' !== $args['theme_location']  )
		return $menu;
	$logo = '<li id="logoNav"><img src="'.get_bloginfo('stylesheet_directory').'/images/logo.png" /></li> ';
	return $logo . $menu;
}

and this to style.css

/* Add Logo to left of nav bar*/
#logoNav {
	float: left;}

#logoNav img {
	max-height: 50px;
	margin-top: 12px;
}

Adjust the CSS as required.
It should work. Let me know how it goes.

---

rasor @ WPBasics.org | Buy me a coffee

[Vasilis]

Ok Rasor!!!

AWESOME!

This did the trick, now needs to move at the same line with the menu links 🙂

I guess that's a CSS trick right?

My best wishes for the new year!

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[rasor]

Did you add the css I provided above to your style sheet? That should bring in inline.

---

rasor @ WPBasics.org | Buy me a coffee

[Vasilis]

Yeah , added it already.

Still the logo sits 1 line before the menu links.

Check it here => http://thevasilis.com

Kind regards

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[rasor]

Looks okay on my computer. Maybe you need to clear you cache.

---

rasor @ WPBasics.org | Buy me a coffee

[Vasilis]

Ok cool!!!

Thank you very much

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Author]

Posts