Cacher is the code snippet organizer for pro developers

<?php

// Add the colorbox style sheet
$GLOBALS['TL_CSS'][] = 'assets/colorbox/css/colorbox.min.css|static';

?>

<script src="<?= $this->asset('js/colorbox.min.js', 'contao-components/colorbox') ?>"></script>
<script>
    jQuery(function ($) {
        $('a[data-lightbox]').map(function () {
            $(this).colorbox({
                // Put custom options here
                loop: false,
                rel: $(this).attr('data-lightbox'),
                maxWidth: '95%',
                maxHeight: '95%'
            });


            if ($(this).hasClass('cboxinline')) {
                $(this).colorbox(
                    {
                        inline: true,
                        href: $(this).attr('href'),
                        onClosed: function () {
                            let formid = $(this).attr('href');
                            $(formid).hide();
                        },
                        onOpen: function () {
                            let formid = $(this).attr('href');
                            $(formid).show();
                        }
                    });
            } else {
                $(this).colorbox({inline: false});
            }
        });
    });
</script>