Custom icons in the tabs

[Jennine]

Hello,

I would like to achieve the look in the attached screenshot with the icons in the middle of each tab and the text below it. Can this be done?
Thank you.

[lely]

Hi There,

It can be done but needed some custom CSS. Tabs titles doesn’t accept icon shortcode so we need to use Icon UNICODE value.
Then we will add this custom CSS:

.x-nav-tabs > li > a {
  font-family: FontAwesome;
  font-size: 20px;
}

But then after further checking here: http://fontawesome.io/cheatsheet/, those icon is not available as it is on FONTAWESOME library. Other option now is to cut those icon as png image and use it as background. This would need more customization too.

[Jennine]

thank you ; )

[rad]

You’re welcome!