Trigger embed giveforms.com code with javascript from a link or button?

Design help Custom code
1

Hey Webflower and @PeterDimitrov

I’m using a GiveForms try to figure out, How can I trigger embed code with javascript from a link?

When someone clicks on Support US button. It will pop up with a window of the GiveForms donate widget on the screen of the websites.

This is thehttps://discourse.webflow.com/t/trigger-embed-code-with-javascript-from-a-link-or-button/88843 embed code.

<script src="https://app.giveforms.com/install-popup-button.js" type="text/javascript" defer></script><link rel="stylesheet" href="https://app.giveforms.com/giveforms_embed.css"/><a class="giveforms-donation-button" href="https://bpwebme.giveforms.com/bpdg-funding" data-multi-step="false">Donate</a>

My Custom I did (Not Working)

<script>
  function script() {
      src="https://app.giveforms.com/install-popup-button.js" 
      type="text/javascript" defer
  };

  document.getElementById('Donate-Button').onclick = function () {
      script();
  };
</script>

Share Link:

https://preview.webflow.com/preview/bpdg-agency?utm_medium=preview_link&utm_source=designer&utm_content=bpdg-agency&preview=7de5c9ac1ddd8a5a163fc441a06fac2f&mode=preview

2

You need to include the JavasScript and CSS in you document before Body custom code area. Then on the page, you can create an embed where you want the button to display. Or a button inn the designer that has the class giveforms-donation-button.

So your are a non profit?

3

Hey @webdev,

No, we not a non-profit, We are a design agency. I was looking for different ways for people to support the journey but down road we are looking to start a Non-Profit assisting with helping people find job’s that they love round creative and innovation.

I really love being in the creative and design world but always want to help out people who have a hard time finding employment for those with disabilities or without like myself.

Thank you, so much for the help! I have been working and put the project off for a long time now.

4

I only asked because I like to record my time volunteering to non-profits. I think giveforms.com gives the impression that you are.

1 Like
5

@webdev :smiling_face_with_three_hearts:

6

So, I did what you said I have had add the links in body but not working or show up with the lightbox.

7

Actually no. You used incorrect HTML.

CloudApp

I just created a demo. Here is the read only link.
https://preview.webflow.com/preview/give-9c077a?utm_source=give-9c077a&preview=c827dda8b3e0a225dbf479bbf9d0175c&mode=preview

8

Thanks, so I had in the script not the head.