Skip to main content
Organization settings allow you to customize your organization’s display name and upload a logo that appears across the Client Portal.

​
Accessing Organization Settings

Navigate to Settings from the Client Portal sidebar, or go directly to /settings.

​
Organization Name

Your organization name is displayed:
  • In the Client Portal header
  • On event pages and branding templates (via {{org_name}} variable)
  • In email notifications to attendees
  • In the Super Admin’s client list

​
Updating Organization Name

1

Navigate to Settings

Go to /settings from the Client Portal sidebar.
2

Edit the organization name

In the General card, update the Organization Name field.
3

Save changes

Click the Save button below the name field.
4

Confirmation

A success toast confirms: “Settings saved”. The new name appears immediately in the header.
Changing your organization name does not affect your organization slug. The slug is set during registration and cannot be changed.
The organization logo is displayed in the Client Portal header, next to the PassTru logo. It provides branding consistency across all pages in your portal.

​
Logo Requirements

RequirementSpecification
File FormatPNG only (.png)
Maximum File Size1 MB
Recommended Dimensions100px height × 300px width
Display SizeMaximum 80px height (auto-scaled)
StorageUploaded to org-logos storage bucket
1

Prepare your logo

Ensure your logo file meets the requirements:
  • PNG format
  • Under 1 MB
  • Clear and readable at small sizes
2

Navigate to Settings

Go to /settings from the Client Portal sidebar.
3

Click Upload Logo

In the Logo card, click the Upload Logo link.
4

Select your logo file

A file picker opens. Select your PNG logo file.
5

Upload processing

The system:
  • Validates the file format and size
  • Uploads to the org-logos/{organizationId}/logo.png path
  • Generates a public URL
  • Updates your organization record
6

Confirmation

A success toast confirms: “Logo uploaded”. The logo appears immediately in the portal header.

​
Logo Display Locations

  • Client Portal Header — Top-left corner, next to the PassTru logo
  • Event Portal Header — Visible when navigating event-specific pages
  • All authenticated pages — Consistent branding across your entire portal experience
Only PNG files are accepted. If you upload a non-PNG file, you’ll see an error: “Only PNG files are allowed.”

​
Logo Validation

The system performs the following validations:

​
File Type Check

if (file.type !== "image/png") {
  toast.error("Only PNG files are allowed");
  return;
}

​
File Size Check

if (file.size > 1024 * 1024) {
  toast.error("Logo must be under 1MB");
  return;
}
If either validation fails, the upload is rejected and an error message is displayed. To replace your current logo:
  1. Click Upload Logo again
  2. Select a new PNG file
  3. The new file is uploaded with upsert: true, replacing the old logo
  4. The logo URL is updated in your organization record
  5. The new logo appears immediately across all pages
Replacing a logo does not require deleting the old one first. The system automatically overwrites the existing file.

​
Logo Storage Structure

Logos are stored in the org-logos Supabase storage bucket: 
org-logos/
  └── {organizationId}/
      └── logo.png
  • Each organization has a dedicated folder identified by organizationId
  • The logo is always named logo.png (or logo.{ext} if other extensions are supported in the future)
  • Public URL format: https://{supabase-url}/storage/v1/object/public/org-logos/{organizationId}/logo.png

​
Troubleshooting

​
Logo Not Appearing

If your logo doesn’t appear after upload:
  1. Refresh the page — Hard refresh (Cmd+Shift+R or Ctrl+Shift+R) to clear cache
  2. Check file format — Ensure it’s a valid PNG file
  3. Check file size — Ensure it’s under 1 MB
  4. Verify upload success — Look for the success toast notification

​
Upload Failed Error

If you see “Upload failed: [error message]”:
  • Check your internet connection
  • Ensure the file is not corrupted
  • Try a different PNG file
  • Contact your Super Admin if the issue persists

​
Logo Appears Distorted

If your logo looks stretched or pixelated:
  • Use a high-resolution PNG file (at least 100px height)
  • Ensure transparent background for best results
  • Test the logo appearance at 80px height before uploading

​
Best Practices

1

Use transparent backgrounds

PNG files with transparent backgrounds look best in the header, especially when switching between light and dark modes.
2

Optimize file size

Compress your PNG to reduce file size while maintaining quality. Tools like TinyPNG can help.
3

Test readability

Ensure your logo is readable at small sizes (80px height). Avoid overly complex designs.
4

Consider aspect ratio

Logos with a horizontal aspect ratio (wider than tall) work best in the header layout.

Build docs developers (and LLMs) love

Get started for freeTalk to us