Skip to main content

Website Customization

Your BookWish store website can be customized to reflect your brand identity. Upload your logo, add a banner image, choose your brand colors, and write a compelling description to make your website uniquely yours.

Customization Options​

BookWish offers four main ways to customize your store website:

  1. Store Logo - Your brand mark displayed throughout the site
  2. Banner Image - A hero image at the top of your homepage
  3. Primary Color - Your brand's main color used for buttons and accents
  4. Store Description - Text that tells your story and welcomes customers

Your logo appears prominently on your website and helps customers recognize your brand.

Logo Specifications​

Image Requirements:

  • Format: JPG, PNG, WEBP, GIF, or HEIC
  • Maximum Size: 5MB
  • Recommended Dimensions: 256×256 pixels (square)
  • Processing: Automatically resized and optimized to 256×256 WebP

Design Tips:

  • Use a square format (1:1 ratio)
  • Ensure logo is legible at small sizes
  • Include adequate padding/whitespace
  • Use transparent backgrounds (PNG) if possible
  • Test on both light and dark backgrounds

Via BookWish App:

  1. Go to Shop tab
  2. Select Store Settings
  3. Tap Logo section
  4. Tap Upload Logo or Change Logo
  5. Select an image from your device
  6. Image uploads and processes automatically
  7. Your website updates immediately

Technical Details:

  • Logo is uploaded to secure cloud storage
  • Automatically converted to WebP for fast loading
  • Resized to exactly 256×256 pixels
  • Previous logo is replaced (not preserved)

Where Your Logo Appears​

Your logo is displayed in several places:

  • Website Header - Top of every page
  • Store Listings - When customers search for stores
  • Social Sharing - When your store link is shared
  • Mobile App - In store directory and details

Logo Best Practices​

Do:

  • Use high-resolution source images
  • Keep designs simple and recognizable
  • Ensure contrast with typical backgrounds
  • Test how it looks at small sizes
  • Update logo if you rebrand

Don't:

  • Use images with text-heavy designs that become illegible when small
  • Upload extremely large files (they'll be downsized anyway)
  • Use photos instead of logos (faces don't scale well)
  • Include excessive fine details

A banner image creates visual impact at the top of your store's homepage.

Image Requirements:

  • Format: JPG, PNG, WEBP, GIF, or HEIC
  • Maximum Size: 5MB
  • Recommended Dimensions: 1200×400 pixels (3:1 ratio)
  • Processing: Automatically resized and optimized to 1200×400 WebP

Design Tips:

  • Use wide, landscape-oriented images
  • Feature your store, books, or reading-related imagery
  • Ensure important elements are centered (edges may be cropped on mobile)
  • Use high-quality photography
  • Avoid text in the image (use your description instead)

Uploading Your Banner​

Via BookWish App:

  1. Go to Shop tab
  2. Select Store Settings
  3. Tap Banner section
  4. Tap Upload Banner or Change Banner
  5. Select an image from your device
  6. Image uploads and processes automatically
  7. Your website updates immediately

Technical Details:

  • Banner is uploaded to secure cloud storage
  • Automatically converted to WebP for fast loading
  • Resized to exactly 1200×400 pixels (3:1 aspect ratio)
  • Previous banner is replaced (not preserved)

Store Photography:

  • Interior shots of your bookstore
  • Shelves full of books
  • Your reading nook or cafe area
  • Events or book club meetings

Book-Related Imagery:

  • Stack of books with attractive covers
  • Reading scenes
  • Cozy reading spaces
  • Seasonal book displays

Community Focus:

  • Customers browsing your store
  • Local landmarks combined with books
  • Book club gatherings
  • Author events

Do:

  • Choose visually appealing, high-quality images
  • Feature your store's unique atmosphere
  • Update seasonally or for special events
  • Keep focal points in the center third
  • Use natural, well-lit photography

Don't:

  • Use stock photos that don't represent your store
  • Include text (it may be unreadable on mobile)
  • Choose dark or low-contrast images
  • Feature copyrighted material without permission

Primary Color​

Choose a brand color that represents your store and creates visual consistency.

Color Specifications​

Format: Hex color code (6-digit)

  • Example: #1a1a1a (dark gray)
  • Must start with # followed by exactly 6 characters (0-9, A-F)

Where Color Appears:

  • Buttons and links
  • Accent elements
  • Active navigation items
  • Important UI elements

Setting Your Primary Color​

Via BookWish App:

  1. Go to Shop tab
  2. Select Store Settings
  3. Tap Primary Color section
  4. Enter a hex color code (e.g., #2C5F2D)
  5. Tap Save
  6. Your website updates immediately

Default: If you don't set a custom color, BookWish uses #1a1a1a (near-black).

Choosing Your Color​

Consider:

  • Your existing brand colors
  • Physical store decor and signage
  • Logo colors
  • Readability and accessibility
  • Emotional impact (warm vs. cool colors)

Popular Bookstore Colors:

  • Deep greens - Natural, calming, literary
  • Warm browns - Classic, bookish, cozy
  • Deep blues - Trust, knowledge, calm
  • Burgundy/maroon - Classic, sophisticated, timeless

Finding Hex Codes​

Tools for Finding Colors:

  • Color picker in design software (Photoshop, Figma)
  • Online color picker tools
  • Browser developer tools
  • From your existing logo or website

Color Theory Tips:

  • Ensure good contrast with white backgrounds
  • Darker colors tend to work best for bookstores
  • Avoid overly bright or neon colors
  • Test readability on both light and dark backgrounds

Store Description​

Your store description tells your story and helps customers understand what makes your store special.

Description Guidelines​

Length: No strict limit, but aim for 2-4 paragraphs

What to Include:

  • Your store's history or founding story
  • Types of books you specialize in
  • Unique features or services
  • Community involvement
  • Your bookstore philosophy
  • What makes you different

Tone:

  • Warm and welcoming
  • Authentic and personal
  • Professional but friendly
  • Reflective of your store's personality

Setting Your Description​

Via BookWish App:

  1. Go to Shop tab
  2. Select Store Settings
  3. Tap Description section
  4. Type or edit your description
  5. Tap Save
  6. Your website updates immediately

Example Descriptions​

Community-Focused:

"Main Street Books has been Portland's neighborhood bookstore since 1998. We're more than just a place to buy books - we're a gathering spot for readers, writers, and thinkers. With over 10,000 used and new titles, regular author events, and three active book clubs, we're dedicated to fostering a love of reading in our community."

Specialty Store:

"Sci-Fi Central specializes in science fiction, fantasy, and graphic novels. From classic Asimov to the latest space operas, we curate the best in speculative fiction. Our knowledgeable staff can help you find your next adventure, whether you're into hard sci-fi, urban fantasy, or anything in between."

Used Book Focus:

"The Book Nook is your source for quality used books at great prices. We buy, sell, and trade books daily, ensuring our shelves are always filled with fresh finds. Whether you're looking for literary fiction, mystery thrillers, or classic literature, our ever-changing inventory means there's always something new to discover."

Description Best Practices​

Do:

  • Be specific about what you offer
  • Mention any specialties or unique features
  • Include your location or neighborhood
  • Showcase your personality
  • Update occasionally to reflect changes

Don't:

  • Copy generic bookstore descriptions
  • Make claims you can't back up
  • Include outdated information
  • Write in all caps or use excessive punctuation
  • Forget to proofread

Updating Your Customizations​

All customizations can be updated at any time:

  1. Changes take effect immediately
  2. No website "republishing" required
  3. Previous images are not saved (upload new versions as needed)
  4. Changes are reflected across all pages

Customization Checklist​

When setting up your store website, complete these steps:

  • Upload a professional logo
  • Add an attractive banner image
  • Set your primary brand color
  • Write a compelling store description
  • Preview your website
  • Share your URL with customers
  • Update customizations seasonally or as needed

Technical Details​

Image Processing​

  • All images are processed server-side
  • Original uploads are not stored
  • Processed images are optimized for web
  • Storage is handled securely in the cloud
  • Images are served via CDN for fast loading

Supported File Types​

Images:

  • JPEG (.jpg, .jpeg)
  • PNG (.png)
  • WebP (.webp)
  • GIF (.gif)
  • HEIC/HEIF (.heic, .heif) - iPhone photos

Security​

  • All uploads are scanned for security
  • File size limits prevent abuse
  • Only image files are accepted
  • Processing includes validation

Frequently Asked Questions​

Can I remove my logo or banner after uploading?​

Currently, you can only replace them with new images. To effectively remove a banner, upload a solid color or minimal image.

What if my logo isn't square?​

The system will crop non-square images to fit. For best results, prepare a square version before uploading.

Can I use different colors for different parts of the site?​

Currently, only one primary color is supported. This ensures consistent branding throughout your website.

How often should I update my banner?​

Many stores update seasonally (4 times per year) or for special events. Others keep a consistent banner year-round.

Are my old images saved somewhere?​

No, when you upload a new logo or banner, it replaces the previous one. Save copies locally if you want to preserve them.

Can I see a preview before uploading?​

The system doesn't offer a preview. Upload your image and visit your website to see how it looks. You can replace it immediately if needed.

What if my hex color code doesn't work?​

Make sure it:

  • Starts with #
  • Contains exactly 6 characters after the #
  • Uses only valid hex characters (0-9, A-F)
  • Example: #2C5F2D ✓ | 2C5F2D ✗ | #2C5 ✗

Can I customize other aspects of my website?​

Currently, logo, banner, color, and description are the customizable elements. More options may be added in future updates.