How to Customize Branding and Style

Jun 4, 2025 | FAQ, Training, Version 3.5

How to Customize Portal Branding and Styles in the Drip7 Platform

This guide outlines the process for customizing the branding and styles of the Drip7 platform, including logos for the user login, end-user portal, admin portal, and favicon, as well as primary and secondary colors for the top banner, buttons, and URLs. These changes ensure the platform aligns with your organization’s brand identity.

 

 

Step 1: Access the Drip7 Admin Dashboard

  • Log into the Drip7 platform using your admin credentials on a computer or PC.
  • Navigate to the branding settings, labeled “Styles” in the admin dashboard.

 

Step 2: Upload Custom Logos

  • In the branding settings, locate the logo upload section for:
    • User Login Logo: Displays on the sign-in page for all users.
    • End-User Portal Logo: Appears in the header of the learner interface.
    • Admin Portal Logo: Shown in the admin dashboard header.
    • Favicon: Appears in the browser tab and bookmarks.
  • For each logo, click “Upload” or “Choose File” and select a PNG, JPG, or SVG file from your device (SVG recommended for scalability;). Recommended sizes:
    • User Login/Portal Logos: 200x45px, max 50KB ().
    • Favicon: 32x32px or 50x50px, max 5KB ().
  • Save each upload to apply the new logos. Preview the changes to ensure proper display.

 

Step 3: Set Primary and Secondary Branding Colors

  • In the branding settings, find the color customization section for primary and secondary colors, which affect the top banner, buttons, and URLs (e.g., hyperlinks).
  • For each color:
    • Enter a hexadecimal code (e.g., #0052CC for primary, #FF5733 for secondary) or use the color picker to select a shade.
    • Alternatively, consult your organization’s brand guidelines or use a color picker tool on your logo to extract exact HEX values.
  • Save the changes to update the top banner background, button colors, and URL link styles across the platform.

 

Step 4: Preview and Test Changes

  • Use the preview feature in the branding settings to view how logos and colors appear in the user login, end-user portal, admin portal, and browser tab.
  • Test the user login page and end-user portal on different devices (e.g., desktop, mobile) to ensure logos scale correctly and colors remain consistent.
  • Verify that URLs (e.g., hyperlinks in training content) reflect the new secondary color for visual coherence and ADA visual compliance.

 

Step 5: Save and Publish Branding Updates

  • Click “Save” or “Publish” to apply the branding changes across the Drip7 platform.
  • If needed, clear your browser cache or refresh the page to confirm updates are visible.

 

Notes

  • Ensure logos are high-resolution and optimized for small sizes, especially favicons, to avoid blurriness.
  • Primary and secondary colors should contrast well with text for readability (e.g., white text on dark buttons;).
  • Contact Drip7 support at info@drip7.com for assistance with branding issues or to request custom theme options.