How to add logo to nav bar

General Questions
1

Hello! I am trying to add my logo to the nav bar, and I’m not seeing any instructions on how to do this. Can someone show me how this is done?

2

Eliza,

In order to get help, I invite you to give more details about your project.

  • Which framework? (Bootstrap 3.x,4.x,5.x? Foundation, Tailwind …)
  • What type of logo (image, svg …)
  • Where do you want to integrate the logo?
  • Etc…

And if you have the opportunity to share an example of your project, it’s always a +.

3

Thank you Emmanuel. I’m using the Bootstrap 5 framework. The type of logo is an SVG image, and I would like to put the logo in the top left of the menu (I’m wanting to replace the text in the attached screenshot that says “APPROVE”).

nav brand
nav brand1336×372 34.6 KB

I hope this helps!

4

@elizad21 This is from the Bootstrap documentation:

<nav class="navbar navbar-light bg-light">
  <div class="container">
    <a class="navbar-brand" href="#">
      <img src="/docs/5.0/assets/brand/bootstrap-logo.svg" alt="" width="30" height="24">
    </a>
  </div>
</nav>

Replace the path to svg file with the correct path to where you have your logo svg file saved.

5

I found a solution on another thread that works - use the pull-left class:

 <a href="#" class="pull-left"><img src="/path/to/image.png"></a>

[Bootstrap - How to add a logo to navbar class?](Bootstrap - How to add a logo to navbar class? - Stack Overflow.