Skip to main content
Website & Technology

How to Add WildApricot Features to Other Website Builders

Kate Hawkes Avatar
Kate Hawkes
Published on June 5, 2019

Recently, the membership manager of a professional association told me there was one thing worrying her about getting started with WildApricot.

Her committee was on board with the software and she was excited to start managing their events online. The problem was this: just six months ago she had spent several weeks creating a beautiful website in Wix, and even more time showing her team how to use it. Understandably, she was reluctant to create a whole new nonprofit website in WildApricot in order to use the features.

We hear about situations like this all the time. Maybe you’ve already built a website using a different platform or even outsourced your website design to a third-party service like Inorbital.

If your organization is in a similar position of wanting to keep your website and use WildApricot features like forums, member application forms and directories, you might be as relieved as this membership manager was to hear that there’s an easy way to do just that.

Here’s How You Can Use WildApricot Features on Your Existing Website

You can add WildApricot gadgets to sites made using Wix, Square Space, WordPress, or any other site builder that allows you to embed code (I’ll explain more about this later in the post), by using widgets.

Your members and visitors can use these gadgets just the same as if they were on a WildApricot website, and your admins can still edit and manage these gadgets from your WildApricot admin view.

To help show how you could use widgets, I made websites in two popular website builders – Wix and Weebly. Below, you’ll find examples of how my WildApricot widgets turned out, steps on how to add them, and hopefully some inspiration for how your website could look.

What Are Widgets?

Widgets are also known as plugins – you plug them into websites created outside of WildApricot and embed functionality such as your event list or member directory. These still connect to your WildApricot admin view, so actions visitors might take like event registration or donation will be reflected in your WildApricot account.

You can embed widgets into any site that uses HTML or accepts HTML-based widgets, including many of the most popular DIY website builders.

You can add the following widgets:

How to Get Widget Code

Before you can embed your widget on a website, you need to copy the widget code from WildApricot.

To get widget codes:

  • Add the gadget you want to embed to a page in WildApricot.
    • Select Site pages from the Website menu.
    • Select a page from the list, or create a new page.
    • Click the Edit button, then click the Gadgets button.
    • Select the gadget you want from the list, drag and drop it in place on the page.
  • Select All from the Settings menu, and select Widgets code from the list.
  • Find the widget you want in the list and select the page you just added it to from the drop-down menu.
  • Copy and paste the code from the corresponding box.

Then you’re ready to embed your code into a website!

The process for embedding code depends on which website builder you’re using, but here’s how to do it on 2 common platforms.

How to Embed Widgets on Wix

To embed a widget:

  • Log into your Wix site and go to the website editor.
  • Click the + button from the menu on the right, and select More.
  • Select Embeds, and click HTML iframe.

  • Position this box where you want your widget to appear, and click Enter Code.
  • Paste your code into the box. Your widget should appear.

Example Widgets

Event calendar

Wix widget example - event list

Membership application

Wix widget example - member application

Blog

Wix widget example - blog

How to Embed Widgets on Weebly

To embed a widget:

  • Log into your Wix site and click the Edit website button.
  • Click the Build button from the menu.
  • Scroll down the Individual elements list on the right, and click Show all elements.
  • Select Embed code, and drag and drop it into the right position on the page.
  • Click the code box and then click the Edit custom HTML button.

Example Widgets

Contact profile

Weebly widget example - log in

Member directory

Weebly widget example - directory 2

Good luck with your widgets! For more details on widgets, check out our help site. If you’re having any issues, feel free to contact us.

 Webhooks banner

Share

Comment

The Membership Growth Report:

Benchmarks & Insights for Growing Revenue and Constituents

Get the report now!