Popovers - Dismiss on next click


How do I get a popover to dismiss on next click anywhere on page?

It is mentioned in BootStrap docs (Popovers · Bootstrap v5.1) but can’t see it as an option in Pinegrow

Hi @wingers,
You will have to enter the dismiss code by hand. Just copy it from the Bootstrap docs and then place it in a script tag at the bottom of your document.

Added this to bottom of mypage but still doesn’t work?


var popover = new bootstrap.Popover(document.querySelector('.popover-dismiss'), {

  trigger: 'focus'



Could it be because my popover is triggered from clicking on an image

  <img class="mx-auto d-block" src="images/logo_main.jpg" data-content="gfgfgfg" data-html="false" data-toggle="popover" data-trigger="click" title="aaaa">

I haven’t worked a lot with popovers, but I think you need to add a class of ‘popover-dismiss’ to your img and change the data-trigger to focus. Also, if you have the Pinegrow script for popovers also on the page, change the variable name to something like ‘popoverDismiss’.
Let me know if this works,

Tried all that and still no joy, but thanks for trying to help.

For now I have set it to hover rather than click so it disappears anyway when moving mouse away from image