How to Set Up Clickable Timestamps (Pro)
Clickable Timestamps is a Pro feature and is not included in the Free subscription. For a look at how Pro compares to Free, go here.
Setting Up Clickable Timestamps
First, go to Settings > Fusebox Player and click on the Timestamps tab. You will see this:
Clickable Timestamps Settings
- RSS feed URL: This will, by default, pull in the RSS feed URL you have designated in the Player Defaults tab. The Clickable Timestamps will pull from whatever RSS feed URL you have in that box; you can leave the default, or add another RSS feed URL there if you want.
- Include time in brackets: You want to check this box to include the time in brackets before each Clickable Timestamp. An example with the "Include time in brackets" box checked would be: "[15:32] Pat wishes he could be Marty McFly".
With the "Include time in brackets" box unchecked, the Clickable Timestamp would look like this: "Pat wishes he could be Marty McFly".
- Select the episode from your feed: Here you will see all the episodes from the RSS feed URL you have indicated in the RSS feed URL box above. Use the up/down arrow to scroll through your episode list to pick which episode you'd like to create a Clickable Timestamp set for.
- Time / Text: Here's where the magic happens. Once you have picked which episode to create Clickable Timestamps for, this is where you will create the actual Time and Text that will be clickable on the front-end.
Here's an example of what that could look like:
And this is what it looks like on the front-end:
- Reference: The Reference is a text string, or number you want to be the identifying reference information within the Clickable Timestamp shortcode. Our recommendation is to make your Reference text relevant to the episode you're creating the Clickable Timestamp for: In the example above, the Reference is "SPI 354" because it is the SPI podcast episode 354.
- Shortcode to use: Once designated your RSS feed URL, checked/unchecked the "Include time in brackets" box, selected the episode from your feed, and created your Time and Text, the Shortcode to use is . . . almost ready. You first need to click Save Changes. If you don't, and for example you scroll through your episode feed to start building a new set of Clickable Timestamps for another episode, the changes will be lost. Be sure to click Save Changes before you add your Clickable Timestamps code to your page!
As you saw above, this is what it would look like on the front-end:
And this is what the back-end of that page would look like:
Clickable Timestamps in Action!
Michael Wilson of the This Is Horror podcast does a wonderful job integrating clickable timestamps into his show notes. See it in full here.
Clickable Time, Not Whole Text
You could also, if you like, make only the time part clickable, and not the whole text—but it's a manual process.
You would add your clickable timestamp shortcode like this:
[ftp_timestamp time="3:05" newline="false"][3:05][/ftp_timestamp] content here
And the end result is:
A few things to note about creating shortcodes for Clickable Timestamps:
- When creating your podcast episode shortcode, make sure to choose Play a specific episode of your podcast (instead of Play the most recent episode in your feed). This way your Clickable Timestamp code is associated with a specific episode, as opposed to a feed that will change episodes as you release new ones.
- In the Gutenberg editor, you can use the [/] Shortcode block, or a regular HTML editor if you are using a different editor. Paste your Clickable Timestamps shortcode below your track player shortcode.
- If you want to bypass your defaults in your Clickable Timestamps settings, you can also add timestamps manually. This would be accomplished by adding a shortcode like this:
[ftp_timestamp time="1:30"]Some content[/ftp_timestamp]
Again, if you have any questions or want a more thorough walk-through, scroll up to watch the video. Or you can always reach us at email@example.com.