CODEWITHSUNDEEP
cssfacebookcoding-style
mastodon
mastodon

Reputation: 497

Style facebook 'like' button

I'm struggling with this for a while now and without any success. Setting the style with jquery doesn't work, the same with after the facebook iframe. Is there a way to perform this task ?

<iframe src="http://www.facebook.com/plugins/like.php?&href=http%3A%2F%2Fwww.example.com&amp;layout=standard&amp;show_faces=false&amp;width=400&amp;action=like&amp;font=tahoma&amp;colorscheme=light&amp;height=23" 
scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:400px; height:23px;" allowTransparency="false"></iframe>          

<style>
    .connect_widget_not_connected_text, .connect_widget_connected_text {
        color:white;
    }
    .connect_widget_connected_text a {
        color:#3B5998;
    }
</style>

<script type="text/javascript">
    $(function() { 
        $('.connect_widget_not_connected_text').css('color', 'white');
    });
</script>

Upvotes: 2

Views: 38139

Answers (5)

defau1t
defau1t

Reputation: 10619

Looks like you are using an iframe implementation and there is probably no way you use use this implementation and style it as you want. However you might want to display other ways of implementating Facebook Like button like using XFBML

Upvotes: 0

Clemens Helm
Clemens Helm

Reputation: 3981

Alternatively, use a share link like

https://www.facebook.com/sharer.php?u=url_to_share&t=title_of_content

See https://developers.facebook.com/docs/share/ for details.

Upvotes: 4

Agent_x
Agent_x

Reputation: 84

http://www.daddydesign.com/wordpress/how-to-customize-your-facebook-fan-box/

Take a look a this page, maybe can guide you on this

Upvotes: 0

Nate Totten
Nate Totten

Reputation: 8932

I'm sure that you can figure out a CSS trick to style the button, but you are violating facebook Terms of Service by doing so. You are REQUIRED to display the like button in one of their official styles.

Upvotes: 8

methodin
methodin

Reputation: 6710

I don't think you can style an iframe content from a parent page in this fashion. You can try adding an id to the iframe and attempting to call it that way but even then I'm not sure it will work.

Upvotes: 0

Related Questions