Guide Topics

Search

Contact Us

Let us know what we're missing: support@wodtogether.com


Integrating with Your Website

To integrate WODTogether widgets with any website, you just need to be able to add some javascript code.

Step 1: Javascript Widget Loader

You'll need to add this code to your website. It's required on any page that will have a widget, you can throw it in a header/footer include file for convenience. This will load the WODTogether javascript file to enable plugins.

<script type="text/javascript">
(function(d, s, id){
 var js, wjs = d.getElementsByTagName(s)[0];
 if (d.getElementById(id)) {return;}
 js = d.createElement(s); js.id = id;
 js.src = "//wodtogether.com/js/widgets/widget-loader.js";
 wjs.parentNode.insertBefore(js, wjs);
}(document, 'script', 'wodtogether-jssdk'));
</script>

Step 2: Add Widgets

Once step 1 is complete, you can add widgets to your site using <div> tags with specific attributes. Examples below:

Schedule

<div id="wodtogether_schedule" data-gid="GYM ID" data-pids="PROGRAM IDS"></div>
Option Function
GYM ID You gym id. You can find this on the Gym Settings page.
PROGRAM IDS One or more (comma separated) program IDs defining which program schedules to show. To show all programs, just remove this attribute.

Whiteboards

<div class="wodtogether_whiteboard_wods" data-gid="GYM ID" data-date="DATE" data-pids="PROGRAM IDS" data-heading="WHITEBOARD HEADING"></div>
Option Function
GYM ID You gym id. You can find this on the Gym Settings page.
DATE The date of the whiteboard
Relative Dates
You can use "today" to alwyas show the current date's whiteboard. If you want to show the following day's whiteboard after a certain time of day you can use "3 hours" to show tomorrows WOD at 9pm (use "4 hours" for 8pm etc -- # of hours before midnight to switch over).
Absolute Dates
Use the date format YYYY-MM-DD (2014-05-09 for May 9th, 2014) for a specific date (date of the blog post, or the day after, for instance).
PROGRAM IDS One or more (comma separated) program IDs defining which program whiteboards to show. To show all programs, just remove this attribute.
WHITEBOARD HEADING Custom headers for the WODs
TOP