We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
Subscribe via RSS  Subscribe via email
Recent
Categories
Tags
Users
Badges
View Replies (5)

Resolved How to add own icon in the CSS?

0
Votes
Undo
  1. Hector Bolanos
    Hector Bolanos
  2. General Discussion
  3. Saturday, 29 June 2013
  4.  Subscribe via email
Hi,

I am still a newbie when it comes to CSS and Twitter bootstrap, so please forgive my question.

I am trying to add an icon I made myself, similar in style of the Glyphicons halflings included in boostrap and T3. The icon will be shown in one of the dropdowns of megamenu.

I saved the icon in a subfolder within the images folder and wrote the following css for my own icon (in the custom.css file):

.icon-my-custom-icon:before {
background: url(../images/subfolder/my-custom-icon.png)
}

However, the icon is not showing.

What is the right way to go about this?

Thanks!
Hector
Comment
There are no comments made yet.
Accepted Answer
Mainstwebguy
Mainstwebguy
Accepted Answer Pending Moderation
0
Votes
Undo
Here Hector, try this:
create a custom bootstrap icon

the first result (from stackoverflow) seems to work well.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # Permalink
Responses (5)
Hector Bolanos
Hector Bolanos
Accepted Answer Pending Moderation
0
Votes
Undo
Many thanks to both of you. Very useful information!

It's great that T3 is using the FontAwesome icons, as their library has for more icons that those provided by Glyphicons.

Thanks again,
Hector
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Admin
Admin
Hole-in-One Sherlock Holmes The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Hector,

T3 Megamenu (backend / configuration page) ONLY use Font Awesome for the icons.
You can add other class of course, but it may not show in backend. You need to check the result in frontend instead.

And, please do not use the prefix ".icon-" as it may inherit some css rule of Font Awesome.
You can use any other class name.

Regards
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Hector Bolanos
Hector Bolanos
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Mainstwebguy,

I would appreciate if I can get an answer here since the forum you pointed out is too general. Also, having an answer to my question here may be useful to other people in the future who may have similar questions.

Hector
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Mainstwebguy
Mainstwebguy
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Hector,

Since your question has to do more with the bootstrap core than T3, you may want to ask the same question here: twitter-bootstrap - Google Groups

Hope this helps!
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.