We noticed you’re using an ad blocker!

We’ve detected that you are using adblock plus, uBlock Origin, AdGuard or some other adblocking software which is preventing the page from fully loading :(

We don’t have any banner, Flash, animation, obnoxious sound, or popup ad. We do not implement these annoying types of ads! We need money to operate the site, and almost all of it comes from our online advertising.

Please Disable Adblock or add whitelist or exclude xenforo.pk & dloady.com

Admin

Display image for Thread Prefix

Admin

Admin

Executive Member
Staff member
Administrator
Joined
Dec 31, 2015
Messages
1,389
Reaction score
2,311
Points
113
XenForo submitted a new resource:

Display image for Thread Prefix - This will show you how to just have an image as a thread prefix

This little tip will show you how you can display an image as a thread prefix but also show a title with the image when a user is selecting a thread prefix...hope it helps.

NOTE: I use 18px x 18px images for my prefix images

1. Create a thread prefix
a. In your ACP (Admin Controlo Panel), go to Forums -> Thread prefixes and click the Add prefix button
b. Complete the form and instead of selecting a pre-set Display styling, click the "Other, using custom CSS class name"
c. Enter a...
Read more about this resource...
 
artscripts

artscripts

New Member
Registered
Joined
Mar 13, 2019
Messages
4
Reaction score
2
Points
3
Age
38
it will be more correct


Less:
  .m_addIconPrefix(@className, @imagePath) {
  [email protected]{className} {
    background: url(@imagePath) no-repeat scroll left center;
    display: inline-block;
    line-height: 18px !important;
    padding: 0 0 0 20px;
    vertical-align: middle;
    margin-top: -4px !important;
    font-size: 0px;
  }
}


.m_addIconPrefix(question, 'styles/prefixes/question.gif');
.m_addIconPrefix(alert, 'styles/prefixes/alert.gif');
.m_addIconPrefix(information, 'styles/prefixes/information.gif');
.m_addIconPrefix(need_help, 'styles/prefixes/need_help.gif');
.m_addIconPrefix(important, 'styles/prefixes/important.gif');
.m_addIconPrefix(alert, 'styles/prefixes/alert.gif');
 
Lars

Lars

New Member
Registered
Joined
Mar 23, 2019
Messages
8
Reaction score
1
Points
8
thx artscripts! your code snippet actually helped a lot to wrap my head around the topic ;)

L
 
R

riyo

New Member
Registered
Joined
May 4, 2019
Messages
5
Reaction score
4
Points
3
Age
42
@artscripts without plug-in? where do we add these codes?
 
Lars

Lars

New Member
Registered
Joined
Mar 23, 2019
Messages
8
Reaction score
1
Points
8
@artscripts without plug-in? where do we add these codes?
read the OP - @artscripts is just improving on it.

L
 
artscripts

artscripts

New Member
Registered
Joined
Mar 13, 2019
Messages
4
Reaction score
2
Points
3
Age
38
@artscripts without plug-in? where do we add these codes?
The plugin is not needed, it is just a modified, lite version, than the author presented. Code needs to be placed in extra.less
 
btmgreg

btmgreg

New Member
Registered
Joined
May 6, 2019
Messages
1
Reaction score
0
Points
3
Age
32
Thanks. What code would you use artscripts?
 
artscripts

artscripts

New Member
Registered
Joined
Mar 13, 2019
Messages
4
Reaction score
2
Points
3
Age
38
Thanks. What code would you use artscripts?
I shortened the author's code and brought it to less, and use it. Second post in discussion
 
C

costikh

New Member
Registered
Joined
May 22, 2018
Messages
1
Reaction score
0
Points
1
Age
31
i have do all this steps but i cant get it working
 
Top
AdBlock Detected

We get it, advertisements are annoying!

Sure, ad-blocking software does a great job at blocking ads, but it also blocks useful features of our website. For the best site experience please disable your AdBlocker.

I've Disabled AdBlock