Home

Download this help site
(PDF 80MB)

Download

Embedding external photo galleries

Icon

Instructions for third-party services like these are provided as a courtesy and may contain out of date information or screen clips. For the latest instructions, consult the third party's website.

You can add a photo gallery to your Wild Apricot site using a photo album gadget. The photo album gadget displays pictures stored in your Wild Apricot account. If you want to display photos stored on dedicated photo-sharing sites such as Instagram, Photobucket or Flickr, you can add custom HTML code to embed an external photo gallery in a page on your Wild Apricot site.

You can insert code to embed a photo gallery into a custom HTML gadget or content gadget on a page or page template.

For an overview of the most popular photo-sharing sites, see our blog post on photo-sharing.

Embedding Instagram photos

You can embed photos from your Instagram account so that they appear on a page on your Wild Apricot site. 

 Read more/less

 

Using one of the third-party widgets available from SnapWidget, the photos can appear as: 

  • a grid
  • a grid with user name and comments
  • a map pinned with photo locations
  • a slideshow
  • a scrolling banner 

You can use the free versions of these widgets, or pay for the Pro version which offers additional features and settings. 

To add Instagram photos to a Wild Apricot site page using a SnapWidget widget, follow these steps: 

  1. Go to SnapWidget and click the Get Started Today button.
  2. Sign up for a free SnapWidget account or log into your existing account.
  3. From the SnapWidget dashboard, scroll down then click the Browse All Widgets button.



  4.  With all the widgets displayed, click the Instagram option towards the top.



  5. With all the Instagram widgets now displayed, choose how you want to display your photos by clicking Create your widget below one of the following options:

    ButtonTo display photos as:
    GridGrid
    BoardGrid with user name and comments
    MapMap pinned with photo locations
    SlideshowSlideshow
    ScrollingScrolling banner

    Each option is available in both Free and Pro versions.

  6. Scroll down to the basic settings for your widget and click on the Username field. You will be prompted to sign into your Instagram account.
  7. Adjust the rest of the settings as you wish. The description will not appear on your Wild Apricot page; it will just be used to identify your widget within your SnapWidget account.
  8. After you're finished adjusting your settings, you can click the Preview button to preview your widget. Once you are satisfied with the results, click Get Widget to get the embed code.
  9. Within the window that appears, click Copy to clipboard to copy the embed code to your clipboard.



  10. Log in to your Wild Apricot site as an administrator.
  11. Go to Sites pages (under the Website menu) and begin editing the site page or page template where you want your photos to appear.
  12. Click the Gadgets icon to display the list of available gadgets.
  13. Drag the custom HTML gadget from the Gadget list, and drop it in the desired location.
  14. After you have inserted the gadget, hover over it and click the  Settings  icon. 

     
     
  15. Within the gadget settings on the left, click the Edit code button.
  16. In the dialog that appears, paste the embed code then click the Save button. 
  17. Click Save to save the changes to your page. 

Your Instagram photos should now appear on your page or template.  

Icon

Instead of creating a custom HTML gadget, you can use the Snippet feature to embed the code within a content gadget. For more information on using the Snippet feature, see Inserting and modifying HTML or JavaScript.

Embedding PhotoBucket albums

To embed a slideshow of photos from an album in your PhotoBucket account, follow these steps:

 Read more/less
  1. Sign into your Photobucket account (or create a new one) at photobucket.com.
  2. Go to your library, and display the photo album you want to use.
  3. In the Links to share this album panel along the right, copy the HTML Embed code. 

  4. Sign into your Wild Apricot site as an administrator, then go to Sites pages (under the Website menu) and begin editing the site page or page template where you want the slideshow to appear.
  5. Click the Gadgets icon to display the list of available gadgets.
  6. Drag the custom HTML gadget from the Gadget list, and drop it on the desired location. 

  7. After you have inserted the gadget, hover over it and click the Settings icon. 

  8. Within the gadget settings on the left, click the Edit code button. 

  9. In the dialog that appears, paste the code you copied from the Photobucket site.
  10. Click the Save button to exit the dialog and save your changes.
  11. Click the Save button to save your changes to the page.

The slideshow should now appear on your page. If it does not, switch to public view.

Embedding other photo galleries

Embedding other photo galleries involves the same basic steps:

 Read more/less
  1. Finding and copying the embed code.
  2. Pasting the embed code into a custom HTML gadget, or into a content gadget using the Snippet feature.
Icon

iOS devices – including iPads – do not provide native support for Flash, so avoid embedding any galleries that use Flash if you want your users to view your site on iOS devices.

On this page: 

 
Wild Apricot Inc. 144 Front Street West Suite 725, Toronto, Ontario, Canada M5J 2L7