Floating Social Media Links
[resolved] change text color in the like button (5 posts)

  1. zanchit
    Posted 2 years ago #

    Is it possible to change the text color in the '60 of your friends like this' part? It is coming out as dark (#333 on google elements) and quite difficult to see on my site which has a dark background.

    Not sure what code i need to put in custom css.



  2. Nick Halsey
    Plugin Author

    Posted 2 years ago #

    Unfortunately it isn't possible to change the text color since that's a frame loading from Facebook. The issue is primarily that the frame background is transparent. There are several issues with this approach in general, though, as things really don't work when using a dark frame color either. There just aren't a lot of options with Facebook, while some the other networks have direct-link capabilities (like what QuickShare does with sharing).

    The solution is to add a background color to the Facebook like popup, this should work:

    #fsml_fblikemodal {
        background: rgba(255,255,255,.6);
    #fsml_fblikemodal a {
        color: #555;

    This basically sets the background color of that popup frame and changes the link color in it (the close link) so that it's legible against the lighter background. I just used a semi-transparent color in that example so that this css should work okay for anyone with this issue; you could pick more specific colors to go with your site too if you want but I think it looks fine with these too.

  3. zanchit
    Posted 2 years ago #

    Thankyou, Nick
    That has certainly helped.

  4. StijnDeWitt
    Posted 2 years ago #

    Just wanted to let you guys know that it is possible to change the color with CSS filters. Check out the Facebook Button Colorizer tool I built to demonstrate it.

  5. xkiki
    Posted 2 years ago #

    I think the easiest solution is to use
    Advanced Facebook Like Button Generator I made...

    You could generate the facebook like button with a few clicks.

    Choose between opacity, color, width and more...

    See video:


Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Floating Social Media Links
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic