How to Add the New Giving Popup (Using The Give Button In The Menu)

  1. Head to the Site Planner component where your current content lives
  2. Modify your Header Menu (or wherever your Give button may exist in the header)
  3. Ensure that this menu item has the CSS Class of “open-popup”
  4. Save and close that menu item and menu
  5. Add a new Basic Wrapper into your “All Pages” assigned content
    • Position: Popup
    • View: Tabs
  6. You will need to now create up to 3 new Basic Wrappers which will give you multiple giving tabs on this popup
    • Ex: Support a Missionary, Give Where Needed & Featured Opportunity
  7. Once you have created these Basic Wrappers, you can then drag and drop those into the wrapper we added into our assigned content
    • View: Basic (w/ View Class of Background -> “Color 4”)
  8. Now you will need to create the static content and other parts for these individual giving tabs!
    • For “Support A Missionary” I created a static item with Body text formatted like a title along with a Missionary Search Results Module with the following settings:
      • View: Responsive
      • Query Placeholder: Type to Search
      • Check the “Show only exact matches” option
      • Default Limit: 1
      • Paging Type: Infinite paging
      • Check the “Exclude Tags” option
      • For the No Results Text you can add a link to “Browse Missionaries” that will take users to the Missionaries page on your site
    • For “Give Where Needed”, you can choose a featured project that you would like to show
      • New View: Title, Summary & Giving
      • Note: Ensure that your project has a Title, short Summary, an Image, and if you would like the Recurring option enabled on this project, then you will need to check the “Recurring Option” box.
    • For “Featured Opportunity, I added a featured opportunity to show
      • Ensure your Opportunity has a Title, Summary, and Image
  9. You should now be able to preview your newly added Giving Popup!

Modified on Thu, 4 Jan at 9:35 AM

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article

Make sure these features are added to your Site Stacker installation by learning how to run updates here!