I am trying to change the tooltip of the fancyboy3 close button, but nothing seems to help.
I tried tpl: { closeBtn: '<a title="Test" class="fancybox-item fancybox-close" href="javascript:;"></a>'}
as well as
lang : 'de',
i18n : {
'de' : {
CLOSE : 'Test',
}
}
but both versions did not help. What am I doing wrong?
$('#btn-slider-edit').fancybox({
fullScreen: false,
closeBtn: true,
iframe: {
css: {
width: '80%',
height: '80%'
}
},
tpl: {
closeBtn: '<a title="Test" class="fancybox-item fancybox-close" href="javascript:;"></a>'
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
If you are using fancyBox v3.1, then
1) Your first snippet works as expected:
$( '[data-fancybox]' ).fancybox({
lang : 'de',
i18n : {
'de' : {
CLOSE : 'Test',
}
}
});
https://codepen.io/anon/pen/bReeow
1) This is how you can change button template:
$( '[data-fancybox]' ).fancybox({
btnTpl : {
close : '<button data-fancybox-close class="fancybox-button fancybox-button--close" title="{{CLOSE}} - TEST"></button>'
}
});