• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.
  • This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

facebook style thumbs up and down

Panupat

Well-known member
#1
like-unlike.png

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.

HTML:
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;
}
 

Attachments

Panupat

Well-known member
#8
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.
 

Veer

Well-known member
#11
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?

8-23-2011.png
 

Panupat

Well-known member
#12
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

Well-known member
#19
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. :D