If you previously embedded a Givebutter campaign on your own external website using Givebutter Elements, we recommend updating to the newest version – Widgets!
Givebutter Widgets was released in July 2023 – if you embedded a campaign on your website before this, you probably have Elements code on your site. Read more about identifying older Element embeds →
Benefits of switching 🔄
Improved reliability and support
Widgets are faster and more reliable than Elements, with a more lightweight library, additional customization options, and a shorter code snippet. Embed previews in the dashboard are smoother and faster to load. Widgets also include full support on Wix sites. In-depth instructions and better support are available, with platform-specific onboarding guides. UTM tracking has also been upgraded for improved reliability.
Element incompatibilities
Switching to Elements is also important because Elements and Widgets are not compatible with each other, meaning you cannot install code from both of these systems on your website. Widget embeds will not work correctly unless the Elements code has been removed from your website.
Keeping an Element you've already installed: Elements have been deprecated and are no longer maintained or updated, so we strongly recommend upgrading to Widgets for the best reliability. Elements will continue to work on your site for the time being. You will not be able to install a Widget until you remove all Elements.
Identifying Elements 🔍
Not sure if you still have Elements on your site? Existing Elements and Widgets don't have major visual differences to tell them apart. You'll need to view the HTML source code on your website, and have editing access. In your site HTML, look for Givebutter-related code that includes the word "element" or "iframe" – Widgets HTML does not include these terms. Elements were installed two ways:
Library code + Element
A longer HTML library "script" code installed in the <head> of a site, plus the shorter HTML Element snippet code installed where the Element embed appears on your published site. The shorter snippet code is likely in the body of your site on a specific page, in the site heading or navigation bar, or in the footer.
iFrame embed
An HTML code available from a campaign's Sharing tab, for embedding a Form on your site. iFrames were installed in a single block.
If you're still having trouble identifying an Element on your site, please contact us! We'd be happy to assist you.
Removing Elements 🗑
To remove an Element from your site, you'll need to edit the code on your site. All you need to do is remove the Elements HTML from your site's source code, and save. Elements HTML to delete may include:
Elements library code (in the <head> of your site)
Element snippet code (in the location of the Element, likely in the body of your site)
iFrame code (including the <div> segment placed before the iFrame)
Please see Identifying Elements to see examples of the source code to remove.
Please note that if you find the library code, the snippet code is likely also installed in your site – you'll need to delete both.
Once you've removed the Elements from your site code, double check that you've saved your changes and published the site, and view your live site. Ensure that the Elements are no longer appearing on the published site.
Installing Widgets ✨
Once Elements have been removed from your site, you can install a new Widget! Our platform-specific guides are the most detailed, but you can also view our general Widgets installation guide if you're more comfortable with coding, or use a different web platform.
Want to learn more about Widgets?