Jet Engine Popup Image css

Avec JetEngine, le popup est rendu via JetPopup qui injecte le contenu dans un overlay indépendant du DOM de la page. Le bloc Gutenberg s’affiche correctement dans l’éditeur parce que les styles Gutenberg sont chargés, mais dans le popup JetPopup en frontend, certains styles de blocs Gutenberg ne sont pas injectés.

Quant on utilise le Popup de jet engine, le css des éléments à l’intérieur du popup sont gérer par le popup. Certains éléments comme les images sont controlés par le CSS du popoup.

CSS additionnel dans Apparence → Personnaliser

Le popup Jet Popup a une classe wrapper identifiable. Dans les DevTools avec le popup ouvert, cherche une classe du type .jet-popup__container ou .jet-popup-overlay :

/* Popup Jetengine Border image */

.jet-popup__container .wp-block-image img {
  border: 5px solid #c9a96e;
}