Sharing your form
      Back to home
      1. Help Center
      2. General Form Configuration
      3. Sharing your form

      Sharing your Zeffy form with your supporters and community

      Share your form link, create a donate button, embed it on your website, through a QR code, pop-up form and more!

      Once you've created your form, the next step is to start sharing the form with your donors. 

      There are multiple ways that you can share your Zeffy form. Continue below to learn about the different options and how they work or click one of the links below to jump to a specific section of this article directly.

      Get the link to share your form on social media, via email, etc.

      Find your form's QR code

      Embed your form on your website

      Embed a pop-up on your website

      Embed your campaign thermometer on your website

      Embed your leader-board on your website

      ➡️ Direct Sharing Link

      With all Zeffy forms, you can share a link directly with your donors or community. This is great if you want to share a link on a social media page or send a donation link via email. To find the sharing link:

      • Go to "Forms", hover your mouse over the form you would like to share, and click on Edit.
      • At the top of the page, click on the "share my form" button.

      • A pop-up will open showing you the different sharing options you have access to. 
      • Click on copy to copy the URL and paste it to wherever you want to share your form (Facebook, email, LinkedIn, text message, etc.)
      • You can also click on any of the social icons below the link if you'd like to share the form through one of the listed channels.

      Create a "donate" button on your website

      Using the main sharing link described earlier in this article, you'll be able to add a "donate" button to your website.

      You will need access to the backend of your website. Click here to watch our tutorial on how to add a button to your website

      Create a donate button following your website host's instructions. Then, insert the sharing link URL for the "Donate" button on your webpage. Add the link to your custom button – when users click the button, they are redirected to the donation page. 

       

      ➡️ QR Code

      The QR code allows you to share your form on your physical communications (letters, direct mail, in-person events). This allows your supporters to use their mobile device camera to quickly access your forms and contribute.

      • Access your Zeffy dashboard by logging into your account
      • Go to "Forms", hover your mouse over the form you would like to share, and click on Edit.
      • At the top of the page, click on the "share my form" button.

      • A pop-up will open showing you the different sharing options you have access to. 
      • Click on "QR code" to access the QR code option.

      • Click on "copy image" to copy your QR code to your clipboard. You'll be able to paste it into the communication materials of your choice. 
      • Click on "download image" to download a png version of your QR code onto your device. 

      ➡️ Embedding your form 

      The HTML code allows you to integrate your form directly into your website (via an iframe). Click here to view our embed tutorial.
      • Access your Zeffy dashboard by logging into your account
      • Go to "Forms", hover your mouse over the form you would like to share, and click on Edit.
      • At the top of the page, click on the "share my form" button.

      • A pop-up will open showing you the different sharing options you have access to. 
      • Click on "embed on your website" to access the custom HTML code of your form
      • You will then be prompted to choose how you'd like to embed your form

       

      Please note that the options "thermometer" and "leaderboard" are only available for peer-to-peer campaigns.

      Option 1: Embedding your form

      Embedding your form will require you to copy the HTML code on Zeffy and paste it into an iframe element on your website. Click here to watch our embedding tutorial. 

      Click on "copy" next to your HTML code and paste the HTML code into a designated box on your website. 💡 Here are some additional video tutorials to help you.

      ❗Please note that the embedded versions of our forms will not display your form description, images, logo, or non-profit name. This is currently how our embedded forms are set to behave – they will only show the donation and payment information, not the image and description. 

      If you would like more information on your embedded form, we recommend adding it to your website (above your embed, for example).

      Option 2: Embedding a pop-up

      Embedding your a pop-up will allow your form to appear through a pop-up modal when a button on your website is clicked. 

      • Copy and paste the button code (first code provided) onto a custom HTML button you’ve added to your website. See the example button below. The code should be entered in place of YOURZEFFYCODE.
      • Copy and paste the header code (second code provided) into the Scripts of your website Header.

      Example button custom html (with options to customize the color and wording)

      <style>
                      button.zeffy-btn {
                      background-color: #YOURHEXCOLOUR;
                      border: none;
                      border-radius: 5px;
                      box-sizing: border-box;
                      color: white;
                      cursor: pointer;
                      left: calc(50% - 75px);
                      margin: 10px;
                      min-height: 50px;
                      min-width: 150px;
                      padding: 5px 10px;
                      text-transform: uppercase;
                      top: calc(50% - 25px);
                      display: flex;
                      justify-content: center;
                      align-items: center;
                  }
              </style>
              <button class="zeffy-btn" YOURZEFFYCODE>
                  Donate
              </button>

      Option 3 (Peer-to-Peer Only) - Thermometer

      Embedding your thermometer will allow you to only embed the "thermometer" section of your form on your website. This is a great way to share your campaign's progress without needing to embed the whole form. 

      You will need to copy the HTML code for the thermometer embed on Zeffy and paste it into an iframe element on your website.

      💡 Here's how to add an iframe element to your website to paste the HTML code.

      Option 4 (Peer-to-Peer Only) - Leaderboard

      Embedding your leaderboard will allow you to only embed the "leaderboard" section of your form on your website. This is a great way to show a list of teams and participants without needing to embed the whole form. 

      You will need to copy the HTML code for the leaderboard embed on Zeffy and paste it into an iframe element on your website.

      💡 Here's how to add an iframe element to your website to paste the HTML code.