How to add close button in fancybox 3 like fancybox 1?

Question

css

now by default in fancybox 3 there is a close panel with a fullscreen button, but how to set the parameters so that it is like inline content? Regular cross?
https://codepen.io/fancyapps/pen/NjXbXw
example 1 and 3

Answer 1

create your template.
fancyapps.com/fancybox/3/docs/#options look
through the code, there is baseTpl

baseTpl	:
    '<div class="fancybox-container" role="dialog" tabindex="-1">' +
      '<div class="fancybox-bg"></div>' +
      '<div class="fancybox-inner">' +
        '<div class="fancybox-infobar">' +
          '<button data-fancybox-prev title="{{PREV}}" class="fancybox-button fancybox-button--left"></button>' +
          '<div class="fancybox-infobar__body">' +
            '<span data-fancybox-index></span>&nbsp;/&nbsp;<span data-fancybox-count></span>' +
          '</div>' +
          '<button data-fancybox-next title="{{NEXT}}" class="fancybox-button fancybox-button--right"></button>' +
        '</div>' +
        '<div class="fancybox-toolbar">' +
          '{{BUTTONS}}' +
        '</div>' +
        '<div class="fancybox-navigation">' +
          '<button data-fancybox-prev title="{{PREV}}" class="fancybox-arrow fancybox-arrow--left" />' +
          '<button data-fancybox-next title="{{NEXT}}" class="fancybox-arrow fancybox-arrow--right" />' +
        '</div>' +
        '<div class="fancybox-stage"></div>' +
        '<div class="fancybox-caption-wrap">' +
          '<div class="fancybox-caption"></div>' +
        '</div>' +
      '</div>' +
    '</div>',