5 posts categorized "Wild Apricot Text Manager (WATM)"


Personifest 2019 Presentation: "3 Professional Wild Apricot Magic Tricks"

You are convinced that Wild Apricot is a great fit for your organization. You got all the basics setup. But there are lingering thoughts — will it really do everything you need? Culled from several years of experience deploying Wild Apricot for organizations around the world, this presentation will illustrate the true transformative power of Wild Apricot.

NewPath Consulting will share three tricks: Website Design with CSS, Multi-chapter Member Directory Magic, and Professional Reports and Analytics.


For registered participants at Personifest 2019 a video of our talk along with slides is now available! All of the Personifest 2019 talks are available for free with a quick registration. Use the registration code 'personifest2019'.


Introducing the Wild Apricot Text Manager


The Wild Apricot Text Manager (aka WATM) is free, open source tool that can be used by any Wild Apricot administrator to style, translate, hide or modify nearly every piece of system text in Wild Apricot.

WATM is the missing piece to customizing your Wild Apricot site to your exact colours, styles and text. You can make a variety of changes such as global text search and replace, modifying system or custom form labels and buttons, changing CSS properties on any class or ID and hiding certain labels or buttons altogether.

For example the system text labels in the Membership renewal system gadget below can be customized with WATM:System gadget


WATM is included with every Wild Apricot website that NewPath Consulting designs, as well. If you'd like help with implementing WATM, please check out our translation and custom design services on our website. Knowledge of CSS is very helpful but not required for using WATM.

What can you do with the Wild Apricot Text Manager?

Watm style

modify the style (color, decoration, shape, etc) of any user interface element

Watm translate

translate your content and system text throughout your website

Watm hide

hide any piece of text or user interface item (eg a button) in Wild Apricot

Watm change

change or hide existing system text or confusing user interface elements

Get Wild Apricot Text Manager

Multi-lingual Features

WATM can be used  to create a multi-lingual Wild Apricot website without the need to create duplicate pages, page templates or events. WATM currently supports a primary and secondary language. All content gadgets can be easily maintained on one page, while system text can be translated on the fly based on the translated added to the WATM configuration file.

NewPath Consulting has 8 languages developed for ready use with over 1,000 translations for various Wild Apricot system text. English, Spanish, Chinese (Simplifed), Chinese (Traditional), Arabic, Hindi, Portuguese and Russian are supported currently. New content and translations can be added by a customer quite easily.

Here's a video of how multi-lingual support works with Wild Apricot.


Wild Apricot Translations

If your organization requires an alternative language for your Wild Apricot website, we can help you with a unique solution only offered by NewPath Consulting. Our solution adds one alternate language for all website pages and forms. Ongoing translations are easily managed in a spreadsheet and can be uploaded to Wild Apricot with one click. 

Starts at USD$1,500

Installation fee (includes all navigation menus): $1,500

Per module translation fee (all prices in USD):

Event Calendar/Upcoming Events: $500

Blog/Recent blog posts: $500

Discussion forum/forum summary/forum updates: $1,000

Store Catalog/Cart: $1,000

Donation form/goal: $500

Subscription form: $500

Site search: $500

Member Directory/Featured Member: $1,000

Event Registration: $1,500

Membership Profile & Finances: depends on complexity of fields, starts at $500

Membership Application: depends on complexity of fields, starts at $500

Membership Renewal: depends on complexity of fields, starts at $500

  • Installation of the Wild Apricot Text Manager, NewPath's translation system is included.
  • NewPath Consulting has developed 8 languages ready use with over 1,000 translations for various Wild Apricot system text. French, Spanish, Chinese (Simplifed), Chinese (Traditional), Arabic, Hindi, Portuguese and Russian are supported currently.
  • Training is provided to staff to translate website content gadgets.
  • Translation of Wild Apricot sites take between 1-4 weeks to complete.

Free 30 Minute Consultation


Modifying Text Labels on Wild Apricot Form Fields

Wild Apricot has a terrific system to manage website content, integrated with various membership management, event and ecommerce forms and workflows. In certain situations, it may be necessary to modify a form field label on one or more built-in Wild Apricot forms. These forms have hard-coded field labels as part of the various system pages maintained in Wild Apricot. It is possible to add other gadgets including content to a system page, but it is not easily possible to modify the content, formatting, placement or design of any fields.

One common suggestion is to use theme overrides to fix this problem, but at NewPath, we don't take kindly to theme overrides. They are not trivial  to create and are reserved only for specialized programmers and theme designers. Theme overrides are best for bespoke themes that require pixel-perfect placement of design elements, but for simple label changes and layout changes in system pages, we recommend jQuery.

jQuery is a code library already used by Wild Apricot and loaded by default on every Wild Apricot website. It is a really powerful set of JavaScript functions that can modify any part of a web page, on the fly as soon as a web page loads. 

The following code changes the labels on the form behind the "Send Message" button on a Wild Apricot member profile. In order to change the field labels (in the green boxes) we will modify the Email Member system page.

Email member system page

1. Add a Custom HTML gadget anywhere on the page

Custom html gadget


2. Select the Custom HTML gadget and click the Edit code button and copy and paste the code below into the editor. Click Save.

<script type="text/javascript">

$( ".fieldBody h4" ).text( "Send Referral" );
$("#idMessageSubjectContainer .mandatoryLabel").text ("Subject of Referral");
$("#idBodyContainer .mandatoryLabel").text ("Referral Information (include type of referral, contact information, and any other important information)");
$("#idReplyNameContainer .mandatoryLabel").text ("Name of Referral");
$("#idReplyEmailContainer .mandatoryLabel").text ("Email Address of Referral");

Jquery code for email members

3. The field labels should instantly change. You can now Save the edited system page with the jQuery code snippet. If the labels did not change, check that you copied and pasted the code correctly into the Custom HTML gadget.

Changed email members system page
Using this technique it is possible to modify any hard-coded piece of text in any system page that is not easily accessible through the website page editor. One of the ideas we are tossing around is to create an easy to install code library that will allow easy customization of all labels and support mutli-lingual for Wild Apricot.

Note that the functionality of the underlying forms does not change in any way at all. Different labels may create alternative ways of thinking about the various functions. Similarly with this function the event registration, member signup and renewal, donations, store and just about all other parts of Wild Apricot can be modified.


VIDEO: Using CSS to Customize the Main Menu System in Wild Apricot

The Kaleidoscope theme in Wild Apricot is beautiful! Changing the main menu design though is not something that can be done by pointing and clicking. You need to use CSS to modify the menu. This snippet of CSS code will help you modify the main menu in Kaleidoscope and Bookshelf, two themes that share the same menu styles.

Step 1. Download the CSS code

Step 2. Use the Website > CSS  option to copy and paste the CSS code, or use the WebDAV approach to create or edit the user.css file.

Step 3. Modify the various color and background options to your heart's content until you have the menu working just like you would like.

Hint: Popular colors are available online at W3Schools. You may wish to use your own hexadecimal colour values that start with #.


VIDEO: Beginner's Guide to CSS in Wild Apricot

Have you ever wanted to change the style of a gadget, a menu or hide a few elements in your event registration process? Is the Colors and Styles under Websites feature failing to help you? The key is understanding CSS, aka Cascading Style Sheets. This short video shows you how to inspect and experiment with CSS and apply a change in Wild Apricot.