How to add a donate button (or other custom content) to your Facebook page (Timeline Layout)

Updated May 2016!!! Click here for updated/current videos.

I made a video last year about how to add custom content (used to be called “tabs”) to your Facebook page, but some people got confused because that video was made before the new Facebook Timeline layout. Even though everything works the same, it looks a little different because of the Timeline. So I’ve re-made the video in hopes that it will make things easier for you! (And please excuse my dogs barking at the end…!:)

This video shows you how to use a static iFrame app (it’s okay if you have no idea what that is!) to put custom content on your Facebook page–like a donate button, a list of adoptable pets, a volunteer application or anything you want! It’s slow, step-by-step and walks you through the entire process.

If you’re having trouble getting your Paypal button to show up, go here to learn how to make your Paypal button work on your Facebook page.

If you have any questions, please post in the comments here and we’ll get it figured out for you!

Updated May 2016!!! Click here for updated/current videos.

Updated May 2016!!! Click here for updated/current videos.

Get in Touch!

I'm available via most social media, so drop me a line! I'll answer your questions and I really look forward to hearing from you and helping if I can!

, , , , ,


Strict Standards: Only variables should be assigned by reference in /home/social/public_html/wp-content/themes/canvas/comments.php on line 25

43 Responses to How to add a donate button (or other custom content) to your Facebook page (Timeline Layout)

  1. Trevor July 15, 2012 at 8:09 am #

    Just wanted to say well done, very simple to understand yet showed your depth of knowledge. Thanks for taking the time to share.

  2. Pinky Peregrin July 18, 2012 at 9:22 pm #

    Hi Emily. Thanks for sharing this. I followed it and was able to successfully setup a donation tab. But the paypal button is not working. Why is that? I copied and paste the code generated from paypal. Nothing happens when I click the donate button. Can you help me?

  3. Emily Garman July 19, 2012 at 2:14 pm #

    Hi Pinky,

    Watch this video to understand how to fix this problem. It’s a common issue because Facebook blocks the javascript that is contained in your Paypal button. So here’s how to make a Paypal button work on Facebook.

  4. Natasha Younge October 11, 2012 at 2:03 pm #

    Great video, Emily. I am bookmarking and watching step by step. Thank you for sharing.

  5. Eduardo Benchoam December 20, 2012 at 8:29 am #

    Hi Emily. Will Facebook charge a fee for each transaction on a donation app? How does this work? Thanks so much!

  6. Emily Garman December 20, 2012 at 7:53 pm #

    Hi Eduardo, I can’t ever speak for what Facebook WILL do…but as for right now, they are not charging. The reason is because all you are doing is simply pulling in external content and displaying it on Facebook. Facebook never processes the transaction, so there is no way for them to charge a fee. All you’re doing is installing a button of your choice–and it does whatever you want it to do. So as long as you don’t display content that violates Facebook’s terms of service (and this doesn’t), then you’re fine!

    Now, whatever service you use to collect donations–Stripe, Paypal, etc.–they will charge a fee. If you want to accept credit cards, you can’t escape paying a fee. but some have better rates than others, so look around.

  7. Eduardo Benchoam December 21, 2012 at 9:56 am #

    Thanks Emily, you rock!!!

  8. Patrick Ducat February 12, 2013 at 10:58 am #

    Thanks so much! Great article!

  9. Kevin March 13, 2013 at 7:00 pm #

    This is one of the most useful Social Media instructional videos I’ve come across in a long time. Thank you so much.

  10. Emily Garman March 16, 2013 at 7:34 pm #

    Thanks so much, Kevin! Glad it was helpful.

  11. Holly March 29, 2013 at 3:51 pm #

    Hi Emily

    Thank you for your wonderful assistance. I am working on trying to create a donate tab for the Monadnock Humane Society and keep getting the message that “a problem occurred changing the tab image”. I have tried saving it under different formats but as of yet have not found a way of uploading my own imagine. Thanks again! Would never have worked this out without your video. Also, loved those dogs at the end! 🙂

  12. Emily Garman March 30, 2013 at 8:04 pm #

    Hi Holly,

    This happens sometimes. Make sure your image is exactly the right size – 111 x 74 pixels. Any format like .jpg, .png or .gif should work. If you know you’ve got all those things right, then most likely it’s just a little glitch, and it will work if you try again later. Sometimes I have to do it four or five times before it works, and other times it works right away. If you’re getting nowhere, just come back a few hours later or the next day and I bet it will work. So glad you were able to utilize the video!

    Emily

  13. Holly April 1, 2013 at 7:09 am #

    Thank you ever so much!!!

  14. Michelle April 18, 2013 at 12:11 pm #

    Hi,
    Great video and things seemed to be going somewhat smooth for me however “woobox” and static iframe gave me a message saying “have iframe manage all my pages”?? This only happened when I went to change the name/image of the tab. I managed to create one and it has the standard welcome and image.

    What should I do? Most of your video was step by step perfect but when I did it there were a few extra messages and pop ups such as that one. Advice?
    Thanks!
    Michelle

  15. Emily Garman April 20, 2013 at 6:23 pm #

    That’s one I haven’t seen before. I would say just ignore it (do you have the option to choose “skip” instead of “allow”?). Woobox is a very trustworthy company so I don’t think you have anything to worry about, but still, it shouldn’t be asking for control of all your pages. Maybe try again–not sure why you got that message. Strange.

  16. Brad June 29, 2013 at 2:01 pm #

    Thanks for the tutorial. I would like a donate button for the mobile version of Facebook. Is this possible? The “tabs” on the desktop version are not on the mobile version.

    What are your suggestions for setting up donations through mobile Facebook?

    Thanks,
    Brad

  17. Emily Garman July 2, 2013 at 6:20 pm #

    No–unfortunately the mobile/tablet Facebook app does not display this content. there are no plans to add this to the mobile app at this time; this may change in the future. but right now, there is no way to have your tabs display on the mobile app.

    if you want to do mobile donations, there’s really no way to do it from within Facebook. You’d have to direct them to an external page/form where they could complete the donation.

  18. Tom Womack July 15, 2013 at 1:48 pm #

    webforu2.com

    Emily,

    when I explore the many postings about apps/no more static fbml / iframe/html/

    all require me to release profile/friends info. I see this consistently when I want to ‘connect’ other resources to FB. and there’s no way I am going to release my ‘friend list’ …. or not. Am I missing something here? Is the only way to install these post static fbml apps granting access to all my personal information? is there no other way to use some simple html?

    thanks !

  19. Brian Terpstra July 21, 2013 at 7:10 pm #

    Hi Emily,

    I only have a non-profit page and I can’t seem to get the app to come up when I search. I can find it when using my wife’s account, but not using my page. Any suggestions?

    Thanks!

    Brian

  20. Ann July 22, 2013 at 5:08 pm #

    Thank you Emily! Got the donate page up, but how do I add a second page? Would like to be able to show our Petfinder adoptables as well. Can’t seem to figure out how to do it. Thank you!

  21. Emily Garman August 2, 2013 at 3:03 pm #

    Ann, go back through the same procedure as in the video, but just choose “add a second tab” instead of the main “add a tab” button. You can add as many tabs as you like, but only three will be able to show on your page (you can’t remove the “photos” tab). Good luck! Also, if you’re still having trouble with this, let me know–I can make another how-to video explaining how to add another tab.

  22. Michael September 6, 2013 at 9:56 am #

    Great video, however … how do you undo a tab? What if I want to undo what you just showed us to do?
    Thanks again for the video.

  23. Emily Garman September 6, 2013 at 9:58 am #

    Just go to your page, hover over the tab you created, and click on the little pencil icon that appears in the upper right corner. Choose delete or remove (can’t remember which it says) and then you can “remove from favorites” or just delete it all together.

  24. Emily Garman September 6, 2013 at 9:59 am #

    You need to be logged in under your personal profile, which is an admin on your nonprofit’s page. If you do not have a personal account, and you are only logging in to administer your page, then it won’t work because you don’t have search capabilities when you have ONLY a business account. So you need to have a personal profile, and that profile needs to be an admin on your page. Then you’ll have full capabilities.

  25. Emily Garman September 6, 2013 at 10:29 am #

    That’s correct. You have to grant authorization to the app. If you look closely, though, when it asks you for access to all that information, sometimes you can hit “skip” instead of “okay” or “accept.” But in order to install custom HTML on your page, you have to install an application (app). And in order to install a free app, they are going to want something in return! For what it’s worth, I’ve been using this app for 3+ years now and it’s never posted anything to my wall or done anything to my friends list.

    pretty much, if you are on Facebook in any capacity, you need to accept that you have no expectation of privacy whatsoever. If you can’t live with that, then you should not be on Facebook. Sounds harsh, but it’s just the reality of social media!

  26. Michael September 6, 2013 at 10:30 am #

    Thanks you!

  27. Lisa September 12, 2013 at 1:04 pm #

    I have successfully added the new tab to my page, but it does not seem to save my new Tab Name when I enter it. Any ideas? I have tried changing it several times, but it always shows the tab name of “Welcome”.

  28. Emily Garman September 12, 2013 at 3:40 pm #

    You might have to keep trying. Sometimes I can’t make it work, and I come back in an hour and it works fine. Not sure why, but give it a shot after a while and I’ll be it works!

  29. Susan September 22, 2013 at 8:05 pm #

    I am getting the same message asking for iframe to manage all my pages when I am trying to change the name and image of the welcome tab. If I say skip, it won’t allow me to change the name or image???

  30. Emily Garman September 22, 2013 at 8:07 pm #

    That’s correct–this is part of authorizing the app. You have to accept and say yes. For the record, I’ve been using this app for 4+ years and it’s never done ANYTHING on my wall, with my friends, pages, etc.

  31. Kyle December 10, 2013 at 12:32 am #

    First of all, thank you for the excellent tutorial. It helped me tremendously.

    I seem to have the same concern as Susan above, and just wanted to clarify. When initially setting up the iframe tab app it asked for my friends info, etc. I went ahead and accepted that. I have now built the page to be displayed, and in order for me to change the tab title and image, it is now asking me to give the iframe app the ability to actually MANAGE my pages in order to access those extra features. That is entirely different than just giving them friends info. Is this normal and is this safe? Seems strange to me.

    Thanks for your help.

  32. Emily Garman December 13, 2013 at 8:19 am #

    Yes–this is totally normal! this app doesn’t do anything with your personal information. You will need to approve the app possibly two times.

  33. Rachael Crawford December 27, 2013 at 4:41 am #

    I watched your video and it was helpful. However I am still very confused as to how people actually go about donating money towards a cause. How does it link to my paypal etc..

  34. Emily Garman December 27, 2013 at 11:10 am #

    Hi Rachel,

    Well, the button that you place on your donate tab, you create that button inside your own Paypal account. So if someone clicks that button, there’s nowhere else it COULD go. The person comes to your Facebook page, they click on your donate tab, they read the text on your donate page, then they click on your donate button, which you’ve created inside your Paypal account and placed on your donate tab/page. Once they click on that donate button, it opens up the typical paypal payment screen, that everyone has seen if they have ever paid for anything with Paypal. They fill in their credit card info (or login to pay with their own Paypal account) and the donation is complete–the money is transferred from their account into yours. Does that make sense?

  35. Rachael Crawford December 27, 2013 at 12:38 pm #

    Yes! Thanks! I have it all set up and it looks correct from a computer.. But when viewing my page from my phone I can’t seem to ind the tab that I created. The page is called “blessing bags”

  36. Emily Garman December 27, 2013 at 12:48 pm #

    The tabs will only display on a computer. The Facebook mobile app (which you will use to access facebook from a phone, tablet, etc) does not display external applications, so nobody’s tabs will show on the mobile device, at least for now–we never know what Facebook will change in the future!

  37. vili monavie January 6, 2014 at 11:42 am #

    I LOVE YOU !!! you shod me exactly what i was looking for to install on my page !!! i even like your dog barking there so….yes YOU are an angel for me!!! TANKS !!!!!

  38. Mark January 19, 2014 at 10:40 am #

    Hi Emily,

    Just a quick question. I chose the URL of my donate page for the donate “button” on my Facebook page. When I tried it, all was as expected. After the PayPal donation was complete, it returned me to my website Thank You page. If I follow your video suggestion, will the PayPal return me to Facebook, or my website?

    Thanks!

    Mark

  39. Emily Garman February 3, 2014 at 4:37 pm #

    Mark, it will return you to the page you specify in the donate button inside Paypal. When you create your donate button, you can specify a URL where it takes people when they cancel their donation and when they complete their donation. So just put the URL you want it to take them to!

  40. Ali February 5, 2014 at 3:02 pm #

    Hi, I added a donate button to our facebook, which puts the info from our website onto facebook. While the page comes up on facebook, the actual donate button won’t work. it just continually is “thinking” or “loading” I was able to comment from facebook and it post to our website but the donate will not work. Help??

  41. Cassandra Agredo August 20, 2014 at 9:26 am #

    Hi, thanks for this video! It was really helpful. I am having an issue though. I wanted the Facebook tab to land on my donate page (a WordPress webpage). The landing page also has different tabs on it (see the landing page here: http://www.xaviermission.org/donate). When I add that page as the url in the Facebook tab, it shows ALL of the information for each of the website tabs in one long page, instead of showing each tab separately, almost as if I was in the edit mode of WordPress. The really weird thing is that, while in the messed up Facebook tab, if you click the button in the upper right hand corner of the webpage that says “Donate Now” (which supposedly takes you to the exact same landing page, xaviermission.org/donate) it shows up the way it is supposed to. But unless I click that button, the initial view on the Facebook tab is all wonky. I’ll leave it installed for now so that you can see what I mean (we’re on Facebook as Xavier Mission). Thanks for your help!!

  42. The Social Animal August 20, 2014 at 10:32 am #

    Hi Cassandra, I looked at your page, and it looks like maybe you are just displaying the URL inside your facebook page? When I visited your Facebook page, I clicked on the “Donate Now” tab (on facebook), and it displayed a “thank you for donating” page in the window. You might make sure you are logged out of your wordpress site before you look at the tab on Facebook. I can’t really tell any more about what is happening unless I am an admin on your page. If you’d like to see about having me look at it as an admin, just email me and we can work something out. Thanks!

Leave a Reply