Caption under image and Fullscreen mode

hansinke's Avatar


29 Aug, 2018 04:10 AM

I succeeded to get the description of the image between the inage and the thumbs using the class rsCaption and adding your suggestions:



{{thumbnail}} {{#link_url}} {{title}} {{/link_url}}

and in my functions.php:
function add_additional_rs_code() {
?> $('.royalSlider').after( $('.rsGCaption') ); $('.rsGCaption').after( $('.rsNav') ); <?php } add_action('new_rs_after_js_init_code', 'add_additional_rs_code');

The caption is places in a div rsGCaption outside the royalSlider container. With my styling I can not get rid of the rsFullscreen class.
My testing site is here:

With or without Fullscreenmode I want to have text visible beneath the image. Maybe you have a solution?

Kind regards Han

  1. Support Staff 1 Posted by Dmitry Semenov on 29 Aug, 2018 05:03 AM

    Dmitry Semenov's Avatar


    The caption must be within .royalSlider element to be visible in fullscreen, as .royalSlider element gets stretched to fullscreen.

    Fullscreen content can be modified in two ways:

    • via CSS: In fullscreen, slider root element gets class rsFullscreen, you may use it to apply different styling.
    • via JS: using rsEnterFullscreen and rsExitfullscreen events:
    var slider = $('.royalSlider').data('royalSlider');
    slider.ev.on('rsEnterFullscreen', function() {
        // enter fullscreen mode 
    slider.ev.on('rsExitFullscreen', function() {
        // exit fullscreen mode 


  2. 2 Posted by hansinke on 30 Aug, 2018 11:17 AM

    hansinke's Avatar

    That works adding either .after (exit fullscreen and initial) or .prepend (enter fullscreen)
    $('.royalSlider').after( $('.rsGCaption') ); $('.royalSlider').prepend( $('.rsGCaption') ); Prepend places the caption again in the container so I could even style it in a different way.

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attaching KB article:


Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.

Keyboard shortcuts


? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac