How do I embed my giving form on my website?

Print Friendly and PDF

Note: If you are using Faithlife Sites, you can activate your giving form with a click. Learn more.

 

You can use html to embed your giving form on your website. You can choose between three different experiences for your givers:

Skip ahead to:

Redirect

Lightbox

Embed

 

Redirect

Through a redirect. Users click your Giving button and are redirected to your giving page on Faithlife.com. After they give, they’ll be redirected to your church group on Faithlife.com

  • Pros: It’s clear that your giving is powered by Faithlife and therefore secure. This approach is slightly easier to implement.
  • Cons: Users are directed away from your website. 

Instructions

 

Lightbox

Via a lightbox on your web page. A lightbox with your giving form appears when users click “give.” After they submit their gift, the lightbox closes and they resume browsing your web page.

  •  Pros: Users remain on your website during the entire giving process. This reassures them that the gift is going toward you, and facilitates them continuing to engage with your website.
  • Cons: Givers might be less comfortable providing their financial information in a form that isn’t supported by a recognizable “big brand.” This approach requires slightly more html work. 

Instructions

 

Embed in your site

Embed the giving form directly into your web page. Your giving form lives directly on the Giving page of your website to complete your gift. After they submit their gift, the giver will receive an on-screen confirmation message.

  • Pros: Users remain on your website during the entire giving process. This reassures them that the gift is going toward you, and facilitates them continuing to engage with your website.
  • Cons: Givers might be less comfortable providing their financial information in a form that isn’t supported by a recognizable “big brand.” This approach requires the most html work.

Instructions

 

Redirect Instructions

The redirect option will redirect givers from your website to your giving page so they know their payment information is powered by Faithlife and therefore safe/secure. Givers will be redirected to your group on Faithlife.com upon gift completion. Steps to embed this option to your site: follow the steps:

  1. Navigate to your finance team on Faithlife.com
  2. Go to the Share/Embed page.

 

 

  1. Copy and paste the Share it with anyone link and add it to your website.

 

Lightbox Instructions

With the lightbox option, your giving form appears when users click “give.” After they submit their gift, the lightbox closes and they resume browsing your web page. Steps to embed this option to your site:

  1. Navigate to your finance team on Faithlife.com
  2. Go to the Share/Embed page.

 

 

  1. Copy and paste the script tag found on your Share/Embed page into your site, ideally right after the opening <body> tag.
  2. Copy and paste the link found in step two of the Share/Embed page where you want the Give button to show.

 

Embed Instructions 

  1. Copy this script text and add it to the head section of your page (after <head>):

 

<script>function receiveMessage(e){if("close"!==e.data){var n=e.data,a=n.height,i=n.change;null!=a&&resizeIframe(a),null!=i&&scrollPage(i)}}function resizeIframe(e){var n=document.getElementById("giving-frame");null!=n&&(n.height="".concat(e+32,"px"))}function scrollPage(e){window.scroll({top:window.scrollY+e,behavior:"smooth"})}window.addEventListener("message",receiveMessage,!1);</script>

 

 

  1. Copy and Paste this iframe code in the body section of your page, where you would like it to show up. Replace <yourGroupToken> with the token from your group which can be found in the Share/Embed page here. 

 

 

<iframe id="giving-frame" src="https://faithlife.com/<yourGroupToken>/give?embed=true" width="100%" height="620px" frameborder="0" scrolling="no"></iframe>

 

Was this article helpful?
3 out of 7 found this helpful

Can't find what you need? Give us a call!