Customizing Background Images in Cockpit Print

  • 0

As a Superadmin, you can personalize the Cockpit experience by replacing the background images available to your Admin users. This guide explains how to customize these background options.

Background Image System

Cockpit provides nine customizable background slots that Admins can choose from:

  • Full-size images: /assets/img/cover.jpg through /assets/img/cover-9.jpg
  • Thumbnail images: /assets/img/cover/cover-thumb-1.jpg through /assets/img/cover/cover-thumb-9.jpg

How to Replace Background Images

  1. Prepare Your Images
    • Create or select 9 background images you want to use
    • Create corresponding thumbnails for each background
    • Recommended full-size dimensions: 1920x1080px or similar 16:9 ratio
    • Recommended thumbnail dimensions: 192x108px (maintaining the same ratio)
    • Recommended compress images before upload to reduce file size using tools like Handbreak
  2. Access Your Server Files
    • Connect to your server via FTP or file manager
    • Navigate to the Cockpit installation directory
  3. Replace Full-Size Background Images
    • Go to the /assets/img/ directory
    • Upload your new images, naming them:
      • cover.jpg
      • cover-2.jpg
      • cover-3.jpg
      • (and so on through cover-9.jpg)
    • Replace the existing files with your new images
  4. Replace Thumbnail Images
    • Navigate to the /assets/img/cover/ directory
    • Upload your new thumbnail images, naming them:
      • cover-thumb-1.jpg
      • cover-thumb-2.jpg
      • cover-thumb-3.jpg
      • (and so on through cover-thumb-9.jpg)
    • Replace the existing thumbnail files
  5. Verify Your Changes
    • Log in as an Admin user
    • Go to the theme or appearance settings
    • Confirm that your new backgrounds and thumbnails are displayed correctly

Important Notes

  • File Format: Make sure to use JPG files to maintain compatibility
  • File Names: Keep the exact naming convention (cover.jpg, cover-thumb-1.jpg, etc.)
  • File Size: Optimize your images for web to keep file sizes reasonable (under 500KB recommended for full-size images)
  • Consistency: Ensure each thumbnail matches its corresponding full-size image
  • Backup: Consider backing up the original images before replacing them
  • Permissions: Ensure uploaded files have correct permissions (typically 644)

By customizing these background images, you can create a branded experience that aligns with your organization's visual identity while still giving Admin users the flexibility to choose their preferred background.


Was this answer helpful?

« Back