Color & Branding

Your brand colors and images create the visual identity customers see on your subscription page. Consistent, professional branding builds trust and makes your business memorable.

This guide explains how to customize your site's colors and images.

Accessing Color & Branding Settings

From My Site Settings:

1. Navigate to My Site (profile icon → My Site)

2. Find Color and Images in left panel

3. Click to expand each section

4. Changes appear instantly in right preview

✍️ TIP: Make all branding changes before publishing your site for the first time.

Color Settings

The Color section controls your site's color scheme:

Brand Color

What it affects:

• Header and menu highlights

• Navigation elements

• Cover image background (if no cover image uploaded)

• Visual accent elements

To set brand color:

1. Click Color to expand section

2. Find Brand color field

3. Click color picker square

4. Select color from picker, OR

5. Enter hex code directly (e.g., #ec4f27)

6. Preview updates instantly on right

Button Color

What it affects:

• All Subscribe buttons

• Select buttons

• Call-to-action buttons

• Any interactive buttons on site

To set button color:

1. Find Button color field (below Brand color)

2. Click color picker square

3. Select color from picker, OR

4. Enter hex code directly (e.g., #ec4194)

5. Preview updates instantly on right

✍️ TIP: Choose colors that match your existing brand identity. Use your logo colors for consistency.

Using the Color Picker

Two ways to set colors:

Method 1: Color Picker

• Click colored square

• Visual picker appears

• Click desired color

• Color applies instantly

Method 2: Hex Code

• Enter 6-digit hex code (e.g., #ec4f27)

• Include the # symbol

• Color applies instantly

• Useful for matching exact brand colors

Images Settings

The Images section controls your visual branding:

Brand Logo

Logo specifications:

• Size: 200 × 200 px

• File size: Up to 4 MB

• Format: PNG, JPG, or WEBP

• Background: Transparent preferred (PNG)

• Design: Square or slightly horizontal

To upload brand logo:

1. Click Images to expand section

2. Find Brand Logo field

3. Click Upload button (or Change if replacing)

4. Select logo file from computer

5. Wait for image to load in preview

6. Verify logo appears correctly

7. Click Publish Site to make live

Cover Image

Cover image specifications:

• Size: 1800 × 240 px

• File size: Up to 4 MB

• Format: PNG, JPG, or WEBP

• Aspect ratio: Wide horizontal banner

• Content: Relevant to your business

To upload cover image:

1. Find Cover Image field (below Brand Logo)

2. Click Upload button (or Change if replacing)

3. Select image file from computer

4. Wait for image to load in preview

5. Verify image appears correctly

6. Click Publish Site to make live

⚠️ IMPORTANT: If no cover image is uploaded, the Brand Color fills the header area instead.

Image Upload Actions

Upload button behavior changes based on status:

"Upload" button shows when:

• Never uploaded an image before

• Previously removed the image

• Starting fresh

"Change" and "Remove" buttons show when:

• Image already uploaded

• Want to replace with new image

• Want to remove current image

Actions available:

• Upload: Add new image (first time)

• Change: Replace existing image

• Remove: Delete current image (reverts to Upload button)

Image Positioning & Requirements

Critical Image Rules

⚠️ CANNOT reposition images after upload:

• Images display exactly as uploaded

• No cropping tools available

• No repositioning options

• No zoom or alignment controls

To ensure proper display: ✅ Use exact recommended dimensions ✅ Crop/edit images before uploading ✅ Test images at correct size first ✅ Center important content in frame ✅ Preview before finalizing

Best Practices

For Brand Logo:

• Center logo in 200×200 canvas

• Leave small margin around edges

• Use transparent background (PNG)

• Keep design simple and clear

• Test visibility at small size

For Cover Image:

• Use 1800×240 dimensions exactly

• Place key content in center

• Avoid text on edges (may crop on mobile)

• Use high-quality, professional photos

• Ensure good contrast with text

✍️ TIP: Create your images at exact specifications before uploading. Use image editing software like Canva, Photoshop, or free tools to prepare files properly.

Previewing Your Changes

Real-time Preview

Changes appear instantly:

• Change colors on left

• See updates on right immediately

• Toggle Desktop/Mobile views

• Test different combinations

• Experiment freely before publishing

After Publishing

Once satisfied with branding:

1. Click Publish Site (or Publish Changes)

2. Wait for confirmation

3. Click View Site to see live version

4. Check branding in actual site context

5. Verify on different devices

Common Branding Scenarios

Starting Fresh (No Images Yet)

1. Set Brand Color

2. Set Button Color

3. Upload Brand Logo (Upload button)

4. Upload Cover Image (Upload button)

5. Preview changes

6. Publish Site

Updating Existing Branding

1. Adjust colors as needed

2. Click Change to replace logo (Change button)

3. Click Change to replace cover (Change button)

4. Preview changes

5. Publish Changes

Removing Branding Elements

1. Click Remove next to logo or cover

2. Image disappears

3. Brand Color fills header (if cover removed)

4. Upload button appears

5. Publish Changes

✍️ TIP: Consistent branding across colors, logo, and cover image creates professional appearance and builds customer trust. Take time to get it right before publishing.