> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.poool.fr/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Comment ajouter l'effet de flou au dessus du paywall ?

Afin d'optimiser l'intégration du paywall à votre contenu, vous pouvez ajouter facilement un effet au dessus de votre widget. Tout se paramètre sur votre Dashboard, dans votre apparence.

[![](https://storage.crisp.chat/users/helpdesk/website/-/b/8/d/4/b8d45c08375a4800/bca13aae-d0e6-401d-a1ae-7c81a7_1si2ocf.png)](https://downloads.intercomcdn.com/i/o/s22rivig/2126556230/e9ab77533fe317d9ee67b7a50146/Capture+d%E2%80%99e%CC%81cran+2026-03-04+a%CC%80+11_09_08.png?expires=1773414000&signature=5648215649158857c5aefdb38e0d3d537550b39966b8cf482aff52edddf66875&req=diElEMx7m4NcWfMW1HO4zQHR8DrzMJoyp6XU0TsRVqAJROryXkhqMCQAqQfu%0Aa5N6T1exdiCDs4dhzTY%3D%0A)

# Appliquer le style dans le bloc CSS du container parent

Dans la section Apparences > Modifier les propriétés de l'apparence

Il vous suffira pour cela d'intégrer un style spécifique dans le bloc CSS du conteneur parent.

[![](https://storage.crisp.chat/users/helpdesk/website/-/e/b/7/c/eb7c65072ea52800/4f757514-d9bc-45d4-949e-d2f4db_wgoyz5.png)](https://downloads.intercomcdn.com/i/o/s22rivig/2126560224/a68ec86e2ed883357d3b8c8563d0/Capture%2Bd-E2-80-99e-CC-81cran%2B2026-03-04%2Ba-CC-80%2B11_08_17.png?expires=1773414000&signature=be92160bfb27e7349a30f9f5f05aa779866a54328e4d7ec0ad1a6d8a41d00157&req=diElEMx4nYNdXfMW1HO4zZ22KXGA%2F0h17WX0HPC7qsoJXOXEODptEq1GK2VW%0AasTNT08dYjSZXrsJKQY%3D%0A)


|| Le conteneur parent est l'i-frame dans lequel le paywall est affiché. Le CSS ajouté dans le bloc CSS du container parent sera ajouté directement au sein de la page dans laquelle le paywall se trouve.

Voici le style à appliquer, que vous pouvez copier/coller dans votre bloc :

```
#poool-widget {  
  position: relative;  
}

#poool-widget::before {  
  content: "";  
  position: absolute;  
  pointer-events: none;  
  top: -90px;  
  left: 0;  
  width: 100%;  
  height: 90px;  
  background: linear-gradient(to bottom, transparent, white);  
  z-index: 10;  
}

#poool-widget:has(iframe.p3-outlet[style*="height: 1px"])::before,  
#poool-widget:has(iframe.p3-outlet[style*="height:1px"])::before {  
  display: none !important;  
}
```

Et voilà, votre effet est prêt ! 🎉

| Vous pouvez ajuster les valeurs du top et height en fonction du résultat attendu.

Vu qu'il s'applique au sein de la page contenant l'i-frame, celui-ci ne sera pas visible dans le Dashboard. N'hésitez pas à tester le rendu sur votre site directement.