Online Help          

Inserting links

Home

Inserting links

You can insert links in Wild Apricot pages so that visitors to your site can click the links and:

  • jump to another page on your site
  • jump to a specific section within the same page or another page on your site
  • jump to another site, or
  • send an email

The link can appear as text...

Linking text

...or as a picture.

Linking a picture

For instructions on inserting links to documents and other files, see Inserting documents.

Inserting a link

To insert a link in a Wild Apricot page:

  1. Log in as an administrator.
  2. Go to Web pages and display the page where you want the link to appear.
  3. Click the Edit button to enter edit mode.
  4. If you want the link to appear as text, either select the text within the page or wait to specify the link text in a subsequent step.

    If you want to link a picture, click the picture within the page.

  5. Click the Link dropdown in the toolbar towards the top of the page and select Insert link.


    Insert link option

  6. From the Insert link window that appears, you choose where the link should go to.


    Insert link options

    The following options are available.
    Option Description Next step
    Website/Email Link to an email address or another website. Enter the email address or website URL. There are separate instructions for linking to encoded email addresses (see below).
    Site page Link to another page on your Wild Apricot site. Select the page from the list.
    Event Link to the detail page or registration form for one or your events. Select the event from the list of past and upcoming events. Choose whether to link to the event's detail page or registration page.


    In each case, you can specify a tooltip to be displayed when a mouse pointer is positioned over the link text or picture, and control whether the link opens in a separate browser window.
    For text links, you can specify the link text (unless you selected the text before selecting the Insert link option).

  7. When you are done defining the link, click Insert Link.

You can also link to another section within the same page or another page by inserting an anchor on the page then linking to it. For more information, see Inserting an anchor and Linking to an anchor, below.

Modifying and removing a link

To modify a text link while in edit mode, select any portion of the link then click the Link dropdown and select Edit link.

Selecting the Edit link option

From the window that appears, you can change the link destination and the tooltip, and whether the link opens in a new window. You can also click the Unlink button to remove the link.

To modify a picture link, enter edit mode then hover over the picture and click Link.

Modifying a picture link

From the window that appears, you can change the link details or click Unlink to remove the link.

You can also remove the link by clicking the unlink icon that appears in the upper right corner of the image when you hover over it.

Removing a picture link using the unlink icon

Inserting an anchor

If you have a long web page, you may want to provide links to individual sections within the page so visitors can jump right to those sections. Before you can link to a section within a page, you have to mark the section by inserting an anchor.

To insert an anchor:

  1. Open the page where you want the anchor to appear.
  2. Enter edit mode.
  3. Click within the page where you want the anchor to appear.
  4. Click the Link dropdown in the toolbar and select Insert anchor.


    Selecting the Insert anchor option 

  5. In the window that appears, enter a the anchor name – a keyword to identify the anchor (without spaces).


    Entering the anchor name

  6. Click Insert anchor.

The anchor is represented in edit mode by an anchor icon.

Anchor icon

To hide anchor icons from appearing on any of your pages in edit mode, click the Link dropdown and select Hide anchors.

Now that you have inserted an anchor, you can link to it from this page or another Wild Apricot page.

Linking to an anchor

You can link to an anchor from the same page or from a different page.

Linking to an anchor on the same page

To add a link to an anchor on the same page:

  1. Select the text or picture you want to use as the link.
  2. Click the Link button in the toolbar and select Insert link to anchor.
  3. In the window that appears, enter the name of the anchor you want to link to in the field on the left, or select it from the list of available anchors on the right.


    Linking to an anchor

  4. Enter a tooltip if you want.
  5. Click Insert link.

Linking to an anchor on another page

To add a link to an anchor on another page:

  1. Select the text or picture you want to use as the link.
  2. Click the Link button and select Insert link
  3. Select or enter the address of the other page then click Insert link
  4. Click the HTML button, and find the <a href> tag for the link (e.g. <a href="/Default.aspx?pageId=1352903">history of the Association</a> ).
  5. Add #anchorname to the end of the link destination (where anchorname is the name of the anchor). For example, if we want to link to an anchor on the About page called History, we might end up with <a href="/Default.aspx?pageId=1352903#History">history of the Association</a>.
  6. Click Save to exit the Edit HTML window.
  7. Click Save to save changes to the page.

Generating a table of contents

You can automatically insert a list of links to all the anchors on the current page, effectively creating a table of contents. Wild Apricot will insert a bulleted list of links using the anchor names as the link text. You can then rename or format the links as desired.

Table of contents

To insert a table of contents, click within the page where you want the table of contents to appear, then click the Link dropdown and select Insert TOC.

Linking to encoded email addresses

Displaying your email address on your Wild Apricot site will expose it to spammers' email harvesting bots, even if you hide it behind link text. To reduce the chance of this, you can encode your email address so that bots can't see it but browsers can still interpret it.

Some email harvesting bots may still be able to interpret encoded email addresses.

To link to an encoded email address, follow these steps:

  1. Go to a site that offers free email address encoding (for example, Enkoder). Pick one that generates JavaScript code rather than HTML code. (If you use HTML, Wild Apricot's automatic code cleanup will convert the encoded address back to the actual address.)
  2. Generate the JavaScript code to encode your email address and copy the code to your clipboard.
  3. Open the Wild Apricot page where you want the link to appear.
  4. Click Edit to enter edit mode.
  5. Click within the page where you want the link to appear.
  6. Click the S (Snippet) button within the toolbar at the top.
  7. Within the code box, right click and select Paste.
  8. Click Save to exit the window.
  9. Click Save to save changes to the page.

In edit mode, the link is represented using a code snippet icon:

Embedded email link in edit mode


Wild Apricot Inc. 144 Front Street West, Suite 725, Toronto, Ontario M5J 2L7, Canada
Sales & Support: (Toll-free) +1 (877) 493-6090
All other inquiries: +1 (416) 410-4059
Copyright © 2012.
Wild Apricot™ by Wild Apricot Inc.