Home / Club widget
Free race calendar widget for your club's website
Updated
Show your members the next races near your city, right on your own site. Paste one line of code, and the list keeps itself up to date. It's free, with no account and no key.
- 34 cities to pick from
- Updates on its own, past races drop off
- Light or dark to match your site
- Phone friendly, grows to fit
Try it and copy your code
1. Script Best
<script src="https://racesnear.com/assets/embed.js" data-city="athens-ga" async></script>Paste it where the list should appear. It sizes itself to fit.
2. Iframe
<iframe src="https://racesnear.com/embed/?city=athens-ga" title="Upcoming races from Races Near" loading="lazy" style="display:block;width:100%;max-width:560px;height:640px;border:0"></iframe>For site builders that block scripts. It has a fixed height, so change 640px if you show more or fewer races.
3. Calendar feed
https://racesnear.com/athens-ga/races.icsEvery upcoming race in Athens, GA, for any calendar app. Subscribe on this device · Add to Google Calendar
Live preview
How to add it to your site
Copy the code from above first, then follow the steps for your site builder.
Squarespace
- Edit the page and click Add block (or the + insert point).
- Choose Code.
- Paste the script code and click outside the block to close it.
- Save, then check the live page. Squarespace often doesn't run scripts while you're editing, so the list may only show after you save.
Wix
- In the Editor, click Add (+), then Embed Code, then Embed HTML.
- Click Enter Code, pick Code, and paste the iframe code.
- Click Update, then drag the box until the whole list shows (about 640px tall for 8 races).
- Publish.
WordPress
- Open the page or post in the block editor.
- Add a Custom HTML block (type /html).
- Paste the script code and click Preview in the block toolbar to check it.
- Update or publish. If the list doesn't show, your plan or a security plugin may remove scripts, so use the iframe code instead.
Google Sites
- Open the page and choose Insert, then Embed.
- Go to the Embed code tab and paste the iframe code.
- Click Next, then Insert.
- Drag the box until the whole list shows, then publish.
Plain HTML
- Open your page's HTML file.
- Paste the script code where the list should appear, for example in your sidebar or a "Races" section.
- Upload the file. That's it.
Stuck? Email hello@racesnear.com with a link to your site and we'll help you set it up.
Options
Add these to the script as data- attributes, or to the iframe link as ?name=value pairs joined with &. All are optional.
| Script | Iframe link | What it does | Default |
|---|---|---|---|
data-city | city | Which city's races to show. Use a city code from the list below. | bay-area |
data-limit | limit | How many races to list, from 1 to 20. | 8 |
data-dist | dist | Only show some distances. Any of 5k, 10k, half, marathon, ultra, trail, comma separated. With one distance the heading changes too, like "Upcoming half marathons near San Francisco". | All races |
data-theme | theme | light or dark. | light |
data-title | title | Your own heading, like "Races our club likes" (up to 60 characters). | "Upcoming races near" your city |
data-ref | ref | A short name for your club (letters, numbers and hyphens, up to 40). It lets us see clicks came from your site, so we can thank you. | None |
data-width | Use the iframe's own style | The widget's maximum width, as any CSS width like 100% or 400px. | 560px |
Example with everything: <script src="https://racesnear.com/assets/embed.js" data-city="nyc" data-limit="5" data-dist="half,marathon" data-theme="dark" data-title="Races our club likes" data-ref="harlem-run" async></script>
City codes
Subscribe in your calendar
Every city also has a calendar feed with all its upcoming races as all-day events, each linking to the race's page. Subscribe once and new races show up on their own. Share it with your members too. The feed for Athens, GA is https://racesnear.com/athens-ga/races.ics (pick another city above, or see the city list).
Google Calendar
- Use the Add to Google Calendar link above, or:
- On a computer, open Google Calendar. Next to Other calendars, click +, then From URL.
- Paste the feed link and click Add calendar.
Google refreshes subscribed calendars on its own schedule, which can take several hours.
Apple Calendar
- On iPhone, iPad or Mac, tap Subscribe on this device above and confirm.
- Or on a Mac: open Calendar, choose File, then New Calendar Subscription, paste the feed link and click Subscribe.
Outlook
- In Outlook on the web, open Calendar and click Add calendar.
- Choose Subscribe from web, paste the feed link, give it a name and click Import.
For developers
Each city's next 60 races are also available as JSON at https://racesnear.com/embed/<city>.json (for example /embed/athens-ga.json), with the race name, date, start time, town, distances and a link. It's open to any site. Please link back to Races Near if you use it.
Questions clubs ask
Is the widget free?
Yes. The widget, the calendar feeds and the race data are free for running clubs, schools, shops and anyone else with a website. There is no account, no sign-up and no key.
Do I need to update it?
No. The widget reads the Races Near calendar every time someone opens your page. Our race list refreshes automatically every few days, and past races drop off on their own, so you paste the code once and leave it.
Does it work on phones?
Yes. It fills the width of the spot you put it in (up to 560px wide by default) and the script version grows to fit the list, so there is no scroll box inside your page.
Can it show only half marathons, or only trail races?
Yes. Add data-dist to the script (or dist= to the iframe link) with any of 5k, 10k, half, marathon, ultra and trail, separated by commas.
A race is missing or wrong. How do I fix it?
Email hello@racesnear.com with the race name, the city and its registration link. We check it against the official page and add or fix it, and the widget picks up the change on its own.
Does the widget track my visitors?
The widget sets no cookies and runs no ads. Race links carry a utm_source=club-embed tag so we can see that clicks came from a club site, and the ref option lets us see which one.
My city is not listed. Can you add it?
Tell us at hello@racesnear.com. We add cities over time and clubs asking is how we pick the next ones.
Questions, or want it set up for you?
Email us with your club's site and city, and we'll send the code ready to paste. We read every message.
hello@racesnear.comNo mail app? Open in Gmail · Open in Outlook