Christian Science Directory

What is The Christian Science Directory? 

The Directory is a searchable database that allows users to locate Christian Science resources in their area, including churches, Reading Rooms, Christian Science nurses, practitioners, college and university organizations, and more. For an international organization with thousands of advertisers, updating this resource posed several interesting challenges for us as developers. Users of the site needed to be able to filter their search for multiple types of resources and locations. They also needed a uniform way to access the site. Previously, the information found in the Directory was not located in a single database. The Directory had a standalone site, but also a duplicated site located in the “Find us” section of the Christian Science website. Maintaining both sites and keeping the information updated was a hindrance to administrators and confusing for members. It was time to consolidate those pages and fully integrate the different services used to maintain the site.

A new legend on the Directory helps users understand the resources they are accessing.

Integrating the CRM and the CMS

To be listed in the Directory, advertisers purchase listings as ads directly from the Christian Science Publishing Society. Each advertiser is responsible for supplying the correct details and information for their listing. The information for the Directory is stored in Salesforce, the Customer Relationship Manager the Church uses to sell ads for the site, with a unique ID. While this was also the case in the previous site, the integration between the CRM and Content Management System needed to be improved. Previously, content on the site wasn’t directly editable by staff. Advertisers were also limited in the type of information they could include in their listings. Improving the workflow for staff and the value of the ad buy for the advertiser was key to the upgrade.

Since we were essentially rebuilding the Directory from the bottom up, this brought the opportunity to upgrade to Ibexa DXP. In the new site, all advertiser information is still stored in the CRM, and the CMS retrieves it and indexes it for the public site. IDs for individual ads are uniform across both the CRM and the CMS. When an ad is updated, it triggers an alert in Salesforce that pushes the ID of the changed record, which alerts the CMS to fetch the updated information. Redundancy is built into the process to make sure that everything stays up-to-date. Daily fetches of data make sure that nothing is missed.

Adding client-generated images

The new Directory needed to support pictures supplied by certain advertisers for their listings and this required better asset management between the CRM and the CMS. We were able to establish a new protocol for how those images would be stored and accessed by the site. The uniform IDs that connected the individual ads between Salesforce and the CMS were applied to submitted images stored in the new image repository. This helped partially automate what would have otherwise been an onerous task for Directory staff. 

While this feature adds value to the advertiser’s listing, the photos that could be submitted could vary wildly in size, dimensions, and quality. Ensuring that the images would all display the same and maintain the quality expected on the site, Mugo Web developers created custom filters to render them appropriately.

Client-supplied images now appear in both the search results and the individual ad pages. Custom filters resize the same image to both spaces so it appears correctly in the layout on both mobile and desktop views.

Making Google Maps more efficient 

The previous site had maps but they were not user-friendly. Originally, maps were not embedded in the individual listings, and searching by map was unavailable. As the purpose of the Directory is to make these resources as easy to find as possible, maps needed to be front and center on the new site. That posed problems of its own. A map with thousands of global pins is slow to load and unwieldy to use. There needed to be a balance of having the information available, easily found, and quickly loaded.

A sample of the previous Directory’s search results shows the limited functionality of Google Maps integration.

Developers tackled this issue by using marker clusters on the map to reduce rendering time, related to the level of zoom. Depending on that, there can be multiple clusters (of 5 or more pins) within a city or area. Zooming further down will adjust that ratio, making individual markers visible. Using marker clusters resulted in a fast, responsive map display that loads efficiently, no matter the browser or device used.

The search results page on the updated Directory displays relevant information more clearly and has an easier-to-navigate map feature.

Creating a seamless experience for users

Multiple new search options were added to fit different ways members use the Directory. Behind the scenes, this was accomplished thanks to a custom Solr index for Ibexa DXP 4.2. The new site replaces the original limited search features with a beautiful map display and collapsable filters. Users can navigate the map and zoom in and out to look at different geographic areas if they want to browse. They can search by keyword or by location. They can enter a postal code or use their current location to find the resources closest to them. 

Users accessing the collapsable filter menu can view resources based on the resource type. They also have the option to filter results from any search with additional categories, such as language, country, or current availability.

Each result is displayed on a map and a card with additional information. Selecting a single result will bring up a page with full details about the resource in a uniform layout. Hours, location, map, contact information, services, and pictures supplied by the advertiser are all available at a glance. Since all the information is tied to the original Salesforce data, users and advertisers know that the data is current. In addition, helpful links from the Church about what to expect from this type of resource appear with the listing.

Another critical component in improving the user experience was making sure that the site was accessible and conformed to WCAG 2.1 guidelines. Mugo Web developers pride themselves on being accessibility experts, and with the upgrade, this was a perfect time to make sure that the new Directory would be accessible to anyone who used it, regardless of disability. 

Launching the new site

Mugo Web started consulting on the project in April 2022 and officially launched the new site in October. Immediately, it was easy to see the improvement between the old and new versions of the site.

Side-by-side comparison of the previous Journal Directory (left) and the new Directory (right). In the new Directory, all search options are clearly visible and the map feature is front and center.

An updated design, new search features, and better integration prepare the online Christian Science Directory for the future and many years of providing a valuable resource to anyone searching for Christian Science resources in their community. Better integration with an updated CMS makes maintaining the site easier for administrators. The flexibility of this system increases the value of the ad for advertisers.