Alert Icons Management [Paid] [Deleted]

Sheldon

Sheldon

Well-known member
Sheldon submitted a new resource:

Alert Icon - Remove avatars, add Font Awesome icons.

Remove or Resize the avatars in your alerts and replace them with Font Awesome icons that quickly identify what type of alert you have just received.

To "purchase", simply start a conversation with me, receive the files. I reserve the right to refuse distribution to anyone or any site.

  • 4 Display Modes
  1. Icon Only
  2. Mini Me on Dropdown Only
  3. Mini Me on Account Alerts Only
  4. Mini Me Both Locations
  • Choose Icon and Color for Various Alerts...
Click to expand...

Read more about this resource...
 
I can only assume it does. I haven't tested myself. The template edits included should be in all previous XF versions (that use template modifications).
 
Oh, also...

There is an icon used that is only in Font Awesome 4.4

Screenshot_24.webp

If you are not running the latest version, this icon will not appear. You will have to change the style property for it.

Screenshot_25.webp
 
To create "custom" alerts for add-ons, simply use EXTRA.css

Normally, being tagged in this add-on: Chat by Siropu would have an alert appearing like this:

Screenshot_29.webp

With EXTRA.css, we can change the appearance for that single alert (or any other defined "add-on" alert)
special.webp

As you can see in Firebug, the classes are defined and very easy to find
Screenshot_28.webp

.... in this case, it's "siropu_chat_tag"

So, in EXTRA.css, we will add this to call it properly:
Code: 
.primaryContent.siropu_chat_tag .icon:before, .Alert.siropu_chat_tag .icon:before {
    content: "\f259";
}

The class after .primaryContent. and .Alert. is what the alert is for whatever add-on it is. Some add-ons have multiple, so it changes.

If you have any Q's, feel free.
 
Sheldon said:
To create "custom" alerts for add-ons, simply use EXTRA.css

Normally, being tagged in this add-on: Chat by Siropu would have an alert appearing like this:

View attachment 113253

With EXTRA.css, we can change the appearance for that single alert (or any other defined "add-on" alert)
View attachment 113255

As you can see in Firebug, the classes are defined and very easy to find
View attachment 113256

.... in this case, it's "siropu_chat_tag"

So, in EXTRA.css, we will add this to call it properly:
Code: 
.primaryContent.siropu_chat_tag .icon:before, .Alert.siropu_chat_tag .icon:before {
    content: "\f259";
}

The class after .primaryContent. and .Alert. is what the alert is for whatever add-on it is. Some add-ons have multiple, so it changes.

If you have any Q's, feel free.
Click to expand...
i have put your code in the extra css , but i don't see this FA Icon
 
Lemminator said:
what i must do for calling font awesome 4..4?
Click to expand...

Depends on what style or add-on you are using that is calling Font Awesome (I think XFMG is still calling FA 4.3, and I think most Audentio styles are on the same.)

I don't know what is pulling in Font Awesome for you.

You can always just add

Code: 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

After <head>
 
Last edited:
If you're using a Pixel Exit premium style you can simply change the Font Awesome call from local to CDN and change the CDN option field to 4.4.0 from 4.3.0 (or whatever the previous version is).

Don't forget to disable the Local Font Awesome option, both can found in the style property [XB] Font Awesome
 
Steve F said:
If you're using a Pixel Exit premium style you can simply change the Font Awesome call from local to CDN and change the CDN option field to 4.4.0 from 4.3.0 (or whatever the previous version is).

Don't forget to disable the Local Font Awesome option, both can found in the style property [XB] Font Awesome
Click to expand...

Appreciate that, I am certain users will find that helpful. I was unsure of how it was called for your styles, so I didn't even want to put out any possible incorrect information.
 
You must log in or register to reply here.

Similar threads

Sheldon
Add-on Font Awesome Icons For Alerts
2
Replies
21
Views
4K
ŽivaAkcija
ŽivaAkcija
Back
Top Bottom