Use Font-Awesome whatsapp

jenish

Hello Community,

I am new to vanilla and not so much hard designer.
Recently I am using bootstrap theme for vanilla. There are Font-awesome used by default in theme.

I wanted to use whatsapp icon in my page, but unfortunately it is not appearing.
Whereas if I am calling facebook icon, then it is coming perfectly.
What can be possible reason?
Thanks.

K17

It's because font awesome used in bootstrap theme is 4.2 and whatsapp has been added since 4.3.
You must update font-awesome to the latest release to have all listed icons.

jenish

Thank you for your feedback.
I think bootstrap theme uses bower components. Which call font-awesome. I have updated same in bower.json file as 4.7.0(latest one) and rest of css files in all design/*.css files. But somehow it is not working. Does I am doing anything wrong?

K17

I never used bower I can't help you with that ^^

vrijvlinder

@jenish said:
Thank you for your feedback.
I think bootstrap theme uses bower components. Which call font-awesome. I have updated same in bower.json file as 4.7.0(latest one) and rest of css files in all design/*.css files. But somehow it is not working. Does I am doing anything wrong?

Simply adding the new version name into bower.json will not do because there may be more changes you have to make to call the correct font icons etc.

"dependencies": {
    "bootstrap": "3.2.0",
    "bootstrap-social": "4.5.1",
    "bootswatch": "3.1.x",
    "font-awesome": "4.1.0", //changing this to the newest version is not sufficient
    "spin.js": "2.0.1",
    "jquery-icheck": "2.x-beta"
  },

You must also find all the other places in the theme where the font-awesome and it's specific version are called and change it there too.

I found 5 matches for font-awsome/4.1.0/fonts/fontawesome-webfont.eot?v=4.1.0 . in the file style.css for Bootstrap theme.

Try changing that there too and report back..