New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details → →
Socket
Book a DemoSign in
Socket
Book a DemoSign in

usercentrics-widgets

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

usercentrics-widgets

Lightweight placeholders compatible with Usercentrics CMP

latest
Source
npmnpm
Version
0.0.7
Version published
Maintainers
1
Created
Source

Usercentrics Widgets

GitHub release (latest by date) Build Status js-semistandard-style size ucw.js size ucw.legacy.js

Lightweight customizable placeholders for third party content of your website (e.g. Youtube Videos) compatible with the Usercentrics CMP.

Disclaimer

  • Unlike the Usercentrics Smart Data Protector, this library does not block third party content automatically. You have to change your website according the documentation in this README!

  • This is a community project and no official product from Usercentrics.

🐞 Report bugs

I have just started with this project, please create a Github issue if you encounter any bugs, thanks!

🚀 Quickstart

  • Setup Usercentrics CMP
  • For each iframe elements you want to replace
    • change src to data-src
    • add class="uc-widget"
    • add the attribute data-uc-id with the ID of the matching service (for example data-uc-id="BJz7qNsdj-7" for Youtube)
  • Download and add the files from the /dist/ folder to your website
    • ucw.min.css into the <head> section: 
      <head>
  <link type="text/css" rel="stylesheet" href="ucw.min.css"/>
</head>
    • ucw.js (or if you need IE11 support ucw.legacy.js) at the end of your <body> 
        <script src="ucw.js"></script>
</body>
</html>

Instead of downloading the files you can also use the jsdelivr CDN, however it's recommended to host the files on your server to avoid third party requests.

https://cdn.jsdelivr.net/gh/philsch/usercentrics-widgets@main/dist/ucw.js
https://cdn.jsdelivr.net/gh/philsch/usercentrics-widgets@main/dist/ucw.min.css

Refer to the /example/ directory for complete examples.

📺 Supported technologies

  • ✅ all iframes
  • ⏳ background images only for Youtube at the moment

🛠 Customization

All widgets can be changed via data attributes:

AttributeDescriptionExample
data-srcsrc of the original elementdata-src="https://www.youtube.com/embed/xxx"
data-textText for the placeholderdata-text="We need your consent"
data-acceptLabel for the accept buttondata-accept="ok"

🎨 Styling

screenshot customization

Instead of using the predefined CSS file, you can use your own. See /style/ucw.css as a reference which CSS classes need to be defined and /example/customized.html as an example.

FAQs

Package last updated on 08 Oct 2022

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

Feross on TBPN: How North Korea Hijacked Axios

Security News

Feross on TBPN: How North Korea Hijacked Axios

Socket CEO Feross Aboukhadijeh breaks down how North Korea hijacked Axios and what it means for the future of software supply chain security.

By Sarah Gooding  -  Apr 08, 2026