TSML UI (12 Step Meeting List User Interface) is an open source interactive recovery meeting finder that can be embedded on any website.
12 Step Meeting List
If you are using the 12
Step Meeting List plugin for WordPress, setup is simple. Go to Dashboard > Meetings > Import &
Settings > Settings and change
User Interface Display →
Custom JSON feed
If you can generate a
Meeting Guide-spec JSON feed, say, from a custom database, you can plug that info in to the
format below. If your data has geographic coordinates, adding a
Mapbox API access token will enable maps (otherwise remove that parameter). To specify a default timezone for your location, set a
proper time zone in the
data-timezone parameter. If you remove it, meeting times will
be translated into the user's timezone.
<div id="tsml-ui" data-src="/path/to/your.json" data-mapbox="pk.your.mapbox.access.token.goes.here" data-timezone="America/Los_Angeles" ></div> <script src="https://tsml-ui.code4recovery.org/app.js" async></script>Demo: San Francisco & Marin, CA
Google Sheet (direct)
You can connect TSML UI directly to a Google Sheet. To do this,
just use your Google Sheet URL as the
data-src attribute, get a Google Sheets API Key
(here are instructions), and enter it as the
<div id="tsml-ui" data-src="https://docs.google.com/spreadsheets/d/your.google.sheet.id/edit#gid=more.stuff.here" data-google="your.google.api.key" data-mapbox="pk.your.mapbox.access.token.goes.here" data-timezone="America/Los_Angeles" ></div> <script src="https://tsml-ui.code4recovery.org/app.js" async></script>
Some caveats about connecting directly to Google Sheets:
- Although it is free, Google imposes rate limits on its Sheets API, and if that limit is exceeded, your users may see a 429 (too many requests) error when accessing the meeting finder.
- Depending on how your sheet is set up, the request from Google can be pretty bulky, and page performance may vary.
- Users may see incomplete data if they request the page while data is being entered.
- Some users may have privacy-oriented content blockers that block their access to Google, which will cause an error.
- If you choose to enter personally identifiable information (such as meeting contact information) this will be exposed to users who know how to look for it.
The Sheets Importer option below mitigates these issues and does not require you to have a Google API key.
Google Sheet (via Sheet Importer)
You can generate a JSON feed from a Google Sheet using the Google Sheet Importer. Use the URL you generate in conjunction with the Custom JSON feed instructions above. Here is a sample Google Sheet you can use to get started.Demo: San Jose, CA