Q:

How to to add div to the fancybox-3 custom template?

I am trying to achieve result similar to one in the picture above:

With fancybox-3 plugin I have created custom template:
$('[data-fancybox="gallery"]').fancybox({

fullScreen : false,
slideShow  : false,
autoSize : false,
loop:true,
touch : {
vertical : false,
horizontal : false
},

thumbs : {
autoStart : true
},

onThumbsShow : function(instance, current) {
instance.Thumbs.$grid.appendTo( instance.$refs.inner );
},

clickOutside : 'close',
baseTpl :
'<div class="fancybox-container qv-container" role="dialog" tabindex="-1">' +
'<div class="fancybox-bg"></div>' +
'<div class="fancybox-inner">' +
'<button data-fancybox-prev title="{{PREV}}" class="fancybox-arrow fancybox-arrow--left" />' +
'<button data-fancybox-next title="{{NEXT}}" class="fancybox-arrow fancybox-arrow--right" />' +
'<button data-fancybox-close class="qv-close"></button>' +
'<div data-fancybox-close class="qv-close"></div>' +
'<div></div>' +
'</div>' +
'</div>',
});

and partly I have managed to achieve result similar to one in the picture below:

After all, I am missing divs with text below image. I have tried to use codepen example as reference but without any decent results :/ 
Does anyone know where I am missing the point? Many thanks for all possible help.
Looking forward,

A:

Seems it is possible to add additional content to fancybox via data-attributes;
Firstly, wrap content with data- attribute in html: 
<a href="images/img.jpg" class="gallery-img" data-content="lorem ipsum bla bla bla" data-fancybox="images" style="background-image: url('images/img.jpg')"></a>
Secondly, with jQuery find and add text into variable in fancybox options using   afterLoad: function() {}. Variable could be inserted with .html into <div>...</div> inside fancybox template
 baseTpl :
'<div class="fancybox-container qv-container" role="dialog" tabindex="-1">' +
....
'<div class="fancybox-div"></div>'+
....
'</div>',
afterLoad: function() {
    var content = $(this.opts.$orig[0]).data('content'); 
    $(".fancybox-div").html(content);
}

