Member Avatar for ibnyadam

HI,

I want to make custom button for facebook like,
I have an image of medal, i want to use this image, when user click on this image, facebook like action is call. and post in his profile.

A normal like button with my medal image.

<iframe src="http://www.facebook.com/plugins/like.php?href=www.carbonated.tv&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>

Thanks

  • 5 Contributors
  • 6 Replies
  • 2K Views
  • 3 Years Discussion Span
  • Latest Post Latest Post by asem.yousif
Member Avatar for macneato

Probably not the best approach but definitely the fastest. Wrap your iframe in a div

<div style="position:relative">
<iframe src="http://www.facebook.com/plugins/like.php?href=www.carbonated.tv&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
</div>

Then just add another div, inside it, but this time, position it absolute (we basically want our new image eg the medal. to be above the normal thumbs up.

<div style="position:relative">
	<!-- new div with image -->
	<div style="position:absolute">
		<img src="medal.jpg" alt="pedal">
	</div>
<iframe src="http://www.facebook.com/plugins/like.php?href=www.carbonated.tv&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:21px;" allowTransparency="true"></iframe>
</div>

Make sense? Using this code will not get it done for you, but you can play with it to make it work

Member Avatar for Love Lee

I have had no experience with HTML or Java script. When I try to past any of the codes for the facebook like button into the body of a widget it is kicked our our transcribed. Can anyone out there in the cyber world please tell me how the heck to do this?

If some one would be so kind as to highlight or type in instructions for me I would be so grateful. I have been to over 50 sites and get the same code but I do not know how to get wordpress to accept it.

Plug-ins??? HTML??? Java Script??? IFrame???XFBML???
Please help

Member Avatar for macneato

Hi,

Could you copy the code you have been currently trying, so we working forward and not backwards

Member Avatar for Love Lee

Man, I wish I could but I have no idea where to start. I have tried so many. I did find the share button within the wordpress permissions..but can not find the like button...

Member Avatar for irvingestrada

thanks guys, this works like a charm :)

Member Avatar for asem.yousif

Hi,
am a graphic designer and i have a website that has my work, and i wanted to ad a like, dislike and share buttons to each piece of my work so the peopel can share there opinions. which makes it simmialer to small social media website but just with images and likes and shares. my question is how could i link those buttons, and how it would founction? when a user like or counting how many likes ??

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.