Wild Apricot Blog

View: Tags | Archives

How to Add Wild Apricot Features to Other Website Builders

Kate Hawkes  05 June 2019  0 comments
 

Embed WA features with widgetsRecently, the membership manager of a professional association told me there was one thing worrying her about getting started with Wild Apricot. 

 

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 Wild Apricot in order to use the features.  

 

We hear about situations like this all the time. If your organization is in a similar position of wanting to keep your website and use Wild Apricot 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 Wild Apricot Features on Your Existing Website


You can add Wild Apricot 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 Wild Apricot website, and your admins can still edit and manage these gadgets from your Wild Apricot 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 Wild Apricot widgets turned out, steps on how to add them, and hopefully some inspiration for how your website could look.  

 

In this post, you’ll learn:

 

 

 

What Are Widgets?


Widgets are also known as plugins – you plug them into websites created outside of Wild Apricot and embed functionality such as your event list or member directory. These still connect to your Wild Apricot admin view, so actions visitors might take like event registration or donation will be reflected in your Wild Apricot 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 Wild Apricot.


To get widget codes:

  • Add the gadget you want to embed to a page in Wild Apricot.  

  • 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

Kate Hawkes

Posted by Kate Hawkes

Published Wednesday, 05 June 2019 at 3:52 PM
Sorry, this blog post is closed for further comments.

Search: WildApricot.com 

About results ( seconds) Sort by: 
Sorry, an error occured when performing search.
 Scroll to top