How to customize ion-nav-buttons icons?

ionic-v1
1

Hey guys,
I am wondering how can I change an icon of ion-nav-buttons? I’ve been trying adding background image to my class, but that didn’t removed the original button, only added background picture of my choice.

Thank you!

2

The content in the css is where the icon is declared.

.ion-navicon:before {
   content: "\f20e"; }

If you are trying to override a specific icon, you will need to set content: ""; and then override the background-image of it. For example:

.ion-navicon:before {
  content: "" !important; 
}

.ion-navicon {
  background: url('http://www.clker.com/cliparts/e/6/d/1/136637426736471240hamburger.svg.hi.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 25px 25px;
}

Is this what you mean?

1 Like