facebook style thumbs up and down

[Panupat]

To add it to your like/unlike, copy it onto your server inside the /styles directory.

For example, if you put them here

http://your-forum-root/styles/default/xenforo/icons/like.gif
http://your-forum-root/styles/default/xenforo/icons/unlike.gif

Add this to your EXTRA.css. You only need padding-bottom if thumbs got cropped in your style, increase it if necessary.

a.like {
background: url(styles/default/xenforo/icons/like.gif) no-repeat;
padding-left: 20px;
padding-bottom: 1px;
}

a.unlike {
background: url(styles/default/xenforo/icons/unlike.gif) no-repeat;
padding-left: 20px;
padding-bottom: 1px;
}

 

[Rostaria]

Very nice.

 

[erich37]

would be cool to have those in Xenforo style colors..........

 

[Panupat]

would be cool to have those in Xenforo style colors..........

You mean the icons should shift the blue a bit to match the blue of this theme?

 

[@lex]

Thanks !

 

[raytrails]

Very good! Thanks

 

[thunderup]

I did this exactly, and my icons just overlap the Like and Unlike text..

 

[Panupat]

I only tested it out on Firefox and Chrome. I may need CSS assistant if it looks different on other browsers.

Just noticed the thumbs got cropped a little bit in Chrome, adding padding-bottom to the CSS now.

 

[thunderup]

I am on a macbook using firefox, and it had an overlap

 

[thunderup]

in case you are wondering, the thumbs up and down overlap the Like and Unlike text almost completely, it doesn't space over to the left

 

[Veer]

I only tested it out on Firefox and Chrome. I may need CSS assistant if it looks different on other browsers.

Just noticed the thumbs got cropped a little bit in Chrome, adding padding-bottom to the CSS now.

It looks nice, any idea how to add icons with Follow and Unfollow link, using the same method?

 

[Panupat]

in case you are wondering, the thumbs up and down overlap the Like and Unlike text almost completely, it doesn't space over to the left

I'm really sorry. I don't own a mac so I can't help you trouble shoot it >_<.

Watched thread doesn't have a css class of its own, you'll have to add one.

In template thread_view , find <div class="linkGroup SelectionCountContainer">
add a class there, let's say <div class="linkGroup SelectionCountContainer watchedIcon">

You then add css .watchedIcon to your EXTRA.css similar to what I had.

 

[ArnyVee]

This is great!

Using Flexile on a test install .... anyone have the thumb images in RED ?

 

[Paul B]

These any good?

 

[ArnyVee]

Brogan, you are the man!

 

[Paul B]

Just noticed I missed the cuff colouring.

 

[Veer]

It looks nice, any idea how to add icons with Follow and Unfollow link, using the same method?

View attachment 18006

Anybody knows about this?

 

[thunderup]

Is nobody else having the problem that I'm having ? Where the icon literally overlaps the Like and Unlike text ?

 

[ArnyVee]

Could it be a custom style issue?

I'm using Flexile on a test install and DXF over at TeeVeeTown.com and they both worked right out of the box.

 

[thunderup]

I'm using "Social"