- yepserAsked on August 27, 2012 at 10:30 AM
I'm in no way a developer :) I need specific instructions on what code to use & exactly where to put it.
Please see attached for an example of what I want to do.
- fxrAnswered on August 27, 2012 at 11:16 AM
To create a Facebook 'Share' Button.
You have to set up an App on Facebook.
Go to https://developers.facebook.com/apps and click the 'Create New App' button.
The settings of the apps are straightforward enough. Just make sure that the 'Site Domain' and 'Site URL' and 'Website with Facebook Login' use the same domain as the link you want to share.
E.g if i want to share www.jotform.com
My app settings would look like this ( I have also highlighted the App id for reference to later):
Once you have the app setup and have obtained your App id, its basically just a matter of generating a URL which you can then embed in a link on your thankpage.
This URL takes the following parameters
appid - you app id on facebook
link - the link you want to share
picture - the URL of a picture you want to use when someone posts to their wall.
name - a title for the link you are sharing.
caption - a small peice of text describing the link you are sharing
redirect_uri - where to redirect a user to after they have 'shared' your link.
Here is an example URL sharing www.jotform.com
Once you have built the URL, its easy enough to add it (and an image link) to a forms thankyou page.
Find your share image and add it to the thankyou page composer with the 'Insert Image' tool.
Highlight the image and click 'insert/edit link' icon and add the URL you built above to it.
You can see a sample form here with this 'Share' button set up
I am sure by now you realise that Facebook have made this a little difficult, but you should be able to manage it with a little perseverance.
- fxrAnswered on August 27, 2012 at 11:17 AM
Facebook documentation on creating a 'Share' button URL is here
- yepserAnswered on August 28, 2012 at 11:47 AM
This is great! I was able to create the share button :)
Is there a way to eliminate the user having to click the share button? Basically have the post to my wall box that pops up after you click the button, pop up automatically after form submission? I think there's an html tag for that, but I'm forgetting it at the moment.
I'm also wondering how I would need to edit it if I want to keep them inside FB. I'm actually iFraming my form into FB using an App. You can see the preview link here.
I'm thinking that I would just need to change the App Domain & Site URL to the above instead of http://form.jotformpro.com/form/22254906188963
Also, can you provide any help on creating a Tweet button?
<a target="_blank" href="https://twitter.com/share" rel="nofollow noopener" rel="nofollow" class="twitter-share-button">Tweet</a>
Thank you so much!
- jeanettebmzAnswered on August 28, 2012 at 02:34 PM
I have answered to you into this thread
- fxrAnswered on August 28, 2012 at 03:31 PM
Just as an appendage:
You can build a tweet link to share a URL (or whatever) in much the same I did for the facebook 'share' button above, its actually a fair bit easier:
The bits you need change to add your own text should be obvious.
To explain some of the odd characters
+ is a space
%3A is a :
%2F is a /
Just build up the link with your image with the insert image and insert link tools as I did above for the Facebook link.
I see you also found a handy facebook app that sorted out your other questions?
btw your form is looking great.
- yepserAnswered on August 28, 2012 at 03:52 PM
Great! I thought you might have a workaround :) I'll probably have to wait until tomorrow to work on Twitter, but I'm happy with the way the Email Auto-Responder is working for the time being.
I did figure out about changing the App Domain & Site URL, but I still want to know if there's a way to eliminate the user having to click the share button from the Thank-You page? Basically have the post to my wall box that pops up after you click the button, pop up automatically after form submission? Isn't there an HTML tag for automatic pop-up?
- fxrAnswered on August 28, 2012 at 05:44 PM
To do this you would have to host the thankyou page on your own server.
I think this may be more trouble than its worth but a brief how-to follows.
For my example above, I would make my body tag look like this:
then add the following script to the bottom of the HTML on my thankyou page:
function fb_share ()
window.open ("http://www.facebook.com/dialog/feed?app_id=273481409427530&link=http://www.jotform.com&picture=http://max.jotfor.ms/images/logo.png&name=Share Name&caption=JotForm%20-%20easiest%20form%20builder&redirect_uri=http://www.jotform.com","Share on Facebook","menubar=no,resizable=no,location=no,width=940,height=480");
An example of how it could look is here
Full code here
- YepserAnswered on August 29, 2012 at 12:59 PM
I'm definitely not going to tackle building something on my own just yet, but I did run across a live example of what I want just in case it's possible & I just didn't know how to articulate what I want :)
I'm planning to tackle Twitter later today. Thanks again!
- jeanettebmzAnswered on August 29, 2012 at 01:14 PM
On behalf of my colleague fxr , you are much welcome!
- yepserAnswered on August 30, 2012 at 02:50 PM
Finally got the Twitter button added, but now I'm having an issue with the images not being left justified in Outlook. See screen shot below. It's difficult for me to troubleshoot as I'm using Gmail & my client is using Outlook! The middle two are in a table & the codes says align left. Thanks!
- JotForm SupportMike_TAnswered on August 30, 2012 at 04:55 PM
Please change text-align for your div to left. It helps in Microsoft Windows Live Mail desktop software, so I hope it will be same in your client's Outlook.
- garrettnorvellAnswered on March 13, 2013 at 08:01 AM
Same goal, problematic code; here's my attempt:
http://www.facebook.com/dialog/feed?app_id=523843927659591&link=https://www.facebook.com/SYVPChurch/app_190322544333196&picture=https://sphotos-a.xx.fbcdn.net/hphotos-ash3/550057_481253958608003_1303773785_n.jpg&name=SYVPC Prayer Request&caption=My%20friends%20at%20Santa%20Ynez%20Valley%20Presbyterian%20Church%20are%20praying%20for%20me;%20Please%20add%20me%20to%20YOUR%20prayers,%20too!&redirect_uri=http://www.facebook.com/SYVPChurch
Any help is appreciated!
- JotForm SupportWelvinAnswered on March 13, 2013 at 09:05 AM
Please kindly check this guide from Facebook: https://developers.facebook.com/docs/reference/dialogs/feed/
Let us know if you need any further help.
- garrettnorvellAnswered on March 13, 2013 at 12:59 PM
Thanks Welvin! I checked that out, used their example URL and plugged in my id, name, etc., and 1) it gives me an error message when I try to load the URL into a new window (while the actual example URL creates the desired example 'share box'); and 2) just yields a "go to facebook" icon when loaded from my form.
Here is my URL; would someone mind helping me troubleshoot this further?
- JotForm SupportEltonCrisAnswered on March 13, 2013 at 03:08 PM
Can you please give us a snapshot of your Facebook App settings? Please make sure the App Domain and Website URL matched on your Share URL. They won't work when values on your link is different with your FB App.
We'll wait your reply. Thanks!
- JotForm SupportEltonCrisAnswered on March 13, 2013 at 03:13 PM
By the way, you can upload the screenshot here and send to us the Image URL (found on that upload page) so we can view it here. Thanks!
- garrettnorvellAnswered on March 13, 2013 at 10:34 PM
- garrettnorvellAnswered on March 13, 2013 at 10:35 PM
I replaced the App Domain with facebook.com and this error message was resolved
- garrettnorvellAnswered on March 13, 2013 at 10:42 PM
Once I replaced the App Domain with "www.facebook.com" the app seemed happy (error went away), but then the link doesn't work (it gives me the following error when I click the link)
- garrettnorvellAnswered on March 13, 2013 at 10:44 PM
Here is my link
- JotForm SupportEltonCrisAnswered on March 14, 2013 at 12:38 AM
You can use this: http://pastie.org/pastes/6485362/text
That still uses JotForm Image but you can change it on that link. e.g. picture=http://max.jotfor.ms/images/logo.png
Let us know if you more questions. Thanks!
- garrettnorvellAnswered on March 14, 2013 at 01:18 AM
Thanks a bunch, EltonCris!
When I past the URL that you generated for me into a new window, I get the box that you posted. When I insert that URL into the link for the icon on my "thank you" page, however, and save the form and re-place the form's code into FB, and then click the link on the "thank you" page, it doesn't bring up that box -it just gives a blank page that says only "go to Facebook.com".
thoughts? (o: thanks again!
- JotForm SupportEltonCrisAnswered on March 14, 2013 at 01:35 AM
Your're welcome and thanks for the swift response.
It's probably because you are logged in as the App Admin. I would suggest to logout and login to another FB account then test out the form, that should be working fine. Here's how it works on my end.
Also, I would suggest to re-embed your form with using https://www instead of https://form (you can find that on your form embed code) to prevent SSL Error.
- garrettnorvellAnswered on March 14, 2013 at 02:33 AM
Elton, you ROCK! may God bless you! Now my next question is about browser incompatibility. Safari is working great, but when I tried opening the jotform in firefox it gave me the following:
- JotForm SupportEltonCrisAnswered on March 14, 2013 at 02:49 AM
It is our pleasure to help you here. May god bless you too! :)
Regarding on the SSL Error, try chaging the Form URL found on your embed code to this. https://secure
I have also escalated this SSL error to our technical team so they can investigate this further.
Thank you for bringing this to our attention.
- JotForm SupportEltonCrisAnswered on March 14, 2013 at 04:46 AM
Just for your information, we no longer support SSL for https://www.jotform.us domain, please use https://secure.jotform.us instead.