User Guide

 

Adding Facebook Like Button to a Form

Adding Facebook Like Button to a Form

Update: We have added different "LIKE" widgets into the widgets page including the Facebook Like for ease of use. Check this out: http://widgets.jotform.com/search/like


There are many ways to add Facebook Like Button to a form. You can add it as an iFrame within a "Free Text(HTML)" field or retrieve the full-source code from the "Embed Form" wizard and add the Facebook code. We'll go with the easiest method to add our Facebook Like Button by using the "Free Text(HTML)" field.  




Text-instructions:

1. Add a "Text" field from the left panel. (formerly known as Free Text HTML)


2. Edit the text inside the "Text" field. Write something that you want for your friends, family, or customers want to see.

3. Go to preview mode by clicking "preview" button and copy the whole URL for your form somewhere(notepad, text editor, etc.).

4. Go to Facebook developers page for the Like Button here.


5. Scroll down a little bit until you see "Step 1 - Get Like Button Code".


6. Fill in "URL to Like" field with the URL code you've got in step 3.

7. This step is important and shouldn't be missed. Uncheck the "Send Button(XFBML Only)"


8. You can play with the other options if you like but we left it as it is. When you're ready click "get code".


9. When the wizard opens, go to the IFrame tab.


10. Copy the code and click the "Okay" button.


11. Go back to the form builder and open the "Text" field and copy the code there.


12. Click "Preview" and check out your Facebook social plugin in action.



Now that you've learned how to add a Facebook Like Button to your form start sharing it with the world. Did you find this article useful? If not, please tell us what you think in the comments below.

Send Comment

10 Comments...

  • Smuvent


    How do you make this button mandatory before submitting the form?

  • devvvv

    which to be added in like plugin url - fb or website?

  • carpinteyrojhw

    Prada バッグ/プラダ トート,http://abcsetx.org/ImgGallery%5Cgallery%5C2009_extravaganza%5COriginal%20Files%5CIMG_3953.html
    プラダコピー,プラダスーパーコピー,PRADA財布偽物,プラダ財布コピー,PRADA財布コピー販売,激安プラダコピー,プラダコピー通販プラダ コピー 財布ヴィトン 財布 コピー メンズ、Hermes 財布 激安 バッグ ブランドプラダ ランキング答えはダブルパスプラダ スニーカー 本物, プラダか ヴィトンか, プラダ 赤 ミニサイズ カナパ, 羽田空港 免税店 プラダ, prada がま口財布, prada☆サフィアーノレザーポーチ, プラダ リボンモチーフ 2wayバッグ, プラダ カナパトート ママバッグ, 群馬 ブランドプラダリュックバック 修理, プラダカナパパープル, プラダを安く買う方法, プラダ がま口 財布, プラダ 財布 新作 2015プラダ スーパーコピー 財布
    http://abcsetx.org/ImgGallery/gallery/2009_extravaganza/IMG_3915.html

  • secretariat__tacccon_botb

    I can put some HTML tags, but not all. It seems IFRAMEs are no longer allowed?

    What do we do about this?

  • placedonline

    I followed all the instruction and cant get it to display, please help me with this.

  • gianviterbo

    Can this still be used. Thanks everyone!

  • CarProof

    Is there anyway to get the Like box (or similar) to work in a custom Thank You screen? When I put the iframe code in using the HTML editor, it gets cut out when I save it. Thanks!

  • charles

    my computer doesn't have facebook social plug-in,please give idea how to download it to my computer.thank you

  • miriammartinho

    How to add a comment form to my site? I couldn't find this info in the user guide.

  • applepiepro

    Hello.. am trying to add the facebook like button to my form using the free text field. But the iframe code generated from FB keeps disappearing after i past it in the html tab and update. How do I resolve this please.