Want to use a specific font in your Secure Privacy banner that's not included in our default options? You can easily achieve this using custom CSS.

1. Choose Your Font:

• Select a font: You can choose from popular font libraries like Google Fonts.

2. Import the Font:

• Use the @import rule:Add the following line to the beginning of your custom CSS code:
  @import url('https://fonts.googleapis.com/css2?family=Your+Font+Name&display=swap'); 
• Replace "Your+Font+Name" with the actual name of the font from the font library.
• Important: Font imports must be placed at the very beginning of your CSS code for proper loading.

3. Apply the Font to Your Banner:

• Use CSS selectors: Target the specific HTML elements within the banner (e.g., headings, buttons) and apply the font using CSS properties like font-family.
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
.sp-banner-heading {
font-family: 'Roboto', sans-serif;
}

This code imports the "Roboto" font from Google Fonts and applies it to the heading within the Secure Privacy banner.

Remember:

• Test thoroughly: Always test your custom CSS changes carefully to ensure they function as expected and don't interfere with the banner's functionality.
• Refer to the font library's documentation: For specific instructions on how to import and use fonts from your chosen library.