Subtitles placed below the player

Julio Castaño 8 years, 7 months ago

Please…
Is it possible to get the subtitles placed just below the player?
Some HTML and CSS adjusments?

Thanks in advance…

Viewing 4 replies - 1 through 4 (of 4 total)

Julio Castaño 9 years ago

Hi,
First of all, congratulations for this fantastic plugin!
I was considering the possibility of buying it for my multilanguage WordPress site. But I woul need to get the subtitles appearing not over the video image, but just below the player.
Is it possible to do it with HTLM and CSS development or configuration?

Thanks in advance.
Regards

Martin 9 years ago

Hello Julio,

are you really looking for a way of putting the subtitles below the player (it might be hard to read for most people) or is this some kind of workaround for some feature other than subtitles?

But I asked our CSS designer to look at this.

Thanks,
Martin

Julio Castaño 9 years ago

Hello Martin,

Thanks a lot for your response.
We need to put the subtitles just below the player due to the fact that our clips are educational content, mainly conferences, which were recorded without taking into account this requirement: subtitling.
There is no space enough at the bottom of the image, and it is really disturbing to see the subtitles appearing very frequently almost over the speaker’s face…
We would need to get something like this:

http://flowplayer.blacktrash.org/test/captions-below.html

(but with the subtitles centered, of course…)
Thanks very much for your kindness, Martin. And congratulations for this fantastic player.

Julio Castaño
viktor 9 years ago
Hello Julio,

you might want to try this short CSS code to put the captions below the video. Although, in fullscreen mode they will be in their default location – inside the video.
```
/* Captions under the player */
.flowplayer {
margin-bottom: 80px !important;
}
.flowplayer.is-fullscreen {
margin-bottom: 28px !important;
}
.flowplayer .fp-subtitle {
bottom: -58px !important;
background-color: #000;
display: block;
}
.flowplayer.is-fullscreen .fp-subtitle {
bottom: -28px !important;
background-color: transparent;
}
```
thanks
vk
- This reply was modified 8 years, 7 months ago by viktor.

Viewing 4 replies - 1 through 4 (of 4 total)