Synopsis
Chapters
Transcript
If you ask me how is Foliovision making the world a better place or how are we making the web work for you, I would say that we use all the open source and open standards so our products are not going to lock you inside of some box, like, in past we moved hundreds of websites out of restrictive content management system into Wordpress, into open source world. The secret is that we are doing things differently here. Our clients aren’t just numbers for us, because we are crafting something personal for each of them. And this really makes a difference. All of our clients have really great stories and they all deserve to be told so it’s up to me to find a way to tell them online. We start by finding something special about the client and then we turn this special thing into something that’s a part of every marketing campaign we do. We are a small and strong group of like-minded young professionals trying to achieve our company's goal, which is to make our clients happier and to make their daily life easier. Quick reactions are very important to our clients. That is why we make our services available at all times. What making the web work for you means to me is that whatever the level of technology our clients come to us with, we will make this sophisticated and ever-changing internet technology accessible to them. The part of my job is training clients to actually use their new websites, so I'm not just creating the websites for them, I also guide them through what the website does and how it works. We have a plugin tracking the number of post or website shares. Several social media channels have recently limited the access to this data so we had to adjust our plugin - and we were one of the first ones to accomplish this. With FV Player we are doing the cutting edge work, we haven’t seen some of our features in any other product, for example the way we improved the embedding for Youtube and Vimeo so that you can use all of our advanced features - I think that it’s pretty unique. Some of our clients actually like to be very involved on the technology side, but many of them, actually they’re just publishers, people who know a lot about cakes, or they’re people who know a lot about baseball, or soccer, or Middle Eastern politics, but they don’t know very much about how Internet technology works. But for all of them we’re able to make it possible for them to publish at the highest possible level with all the same tools that the sites like The New York Times, or the Guardian or any of these other huge sites enjoy.
This is using the “Tabby Responsive Tabs” plugin shortcodes like this:
[fvplayer id="19"]
[tabby title="Chapters"]
[fvplayer_chapters]
[tabby title="Transcript"]
[fvplayer_transcript]
[tabbyending]
You also have to use some additional CSS to make the transcript show without borders:
/* Use your actual tab ID to avoid spacing around the transcript container */
#tablist1-panel3 {
padding: 0;
}
.tabcontent .fv_fp_transcript_wrapper {
margin-bottom: 0;
}
.tabcontent .fv_fp_transcript_boxy, .fv_fp_transcript_light {
box-shadow: unset;
}
.tabcontent .toggle_transcript_collapse {
display: none;
}
.tabcontent .fv_fp_transcript_wrapper .fv_fp_transcript_search {
width: calc(100% - 186px)
}
/* Disable dragging */
.tabcontent .fv_fp_transcript_head {
pointer-events: none;
}
.tabcontent .fv_fp_transcript_head input, .tabcontent .fv_fp_transcript_head button {
pointer-events: auto;
}
The first rule is tricky as you have to use the actual ID of the tab which contains the transcript.
The dragging is better to disable with WordPress filters, see the PHP code here: Interactive Video Transcript