Basic Setup

After installing Plain Jane Starter, follow this guide to configure the essential settings for your store.

Step 1: Access Theme Settings

1. Go to Theme Editor

   Shopify Admin → Online Store → Themes

2. Open Customizer

   • Find "Plain Jane Starter" in your themes

   • Click "Customize" button

   • This opens the theme customizer

Captured automatically on 2025-07-17

Step 2: Essential Settings Configuration

Announcement Bar Setup

The announcement bar appears at the top of your store.

1. Navigate to Settings

   • In customizer, click "Theme settings" at bottom

   • Find "Announcement Bar" section

2. Configure Announcement

   • Announcement Text: Enter your message

     • Example: "Free shipping on orders over $50"

   • Show Announcement Bar: Toggle ON

   • Announcement Bar Color: Choose background color

   • Announcement Text Color: Set text color for readability

3. Best Practices

   • Keep text short and actionable

   • Use contrasting colors for readability

   • Update regularly with current promotions

Typography Configuration

Set your brand fonts across the entire store.

1. Find Typography Section

   • In theme settings, locate "Typography"

2. Configure Fonts

   • Body Font: For general text (paragraphs, descriptions)

   • Header Font: For headings and titles

   • Button Font: For button text

3. Font Selection Tips

   • Choose readable fonts for body text

   • Ensure headers complement your brand

   • Test on mobile devices

   • Stick to 1-2 font families maximum

Clock Settings

Set your store's timezone for consistent time display.

1. Access Clock Settings

   • Find "Clock Settings" in theme settings

2. Select Timezone

   • Choose from the dropdown list

   • Select your business location timezone

   • Examples: "America/New_York", "Europe/London", "Asia/Tokyo"

3. Why This Matters

   • Affects timestamp displays

   • Important for international customers

   • Ensures consistent time references

Step 3: Shop Logo Upload

Add your brand logo to establish identity.

1. Navigate to Shop Logo

   • Find "Shop Logo" in theme settings

2. Upload Logo

   • Click "Shop Logo" field

   • Upload your logo file (PNG, JPG, SVG recommended)

   • Logo Size: Adjust using the range slider (65-165px)

3. Logo Guidelines

   • Use high-resolution images

   • Transparent background (PNG) works best

   • Test at different sizes

   • Ensure readability on mobile

Step 4: Basic Shop Layout

Configure how products display on collection pages.

1. Find Shop Layout Settings

   • Locate "Shop Layout" section

2. Configure Grid

   • Desktop Columns: Choose 2 or 3 columns

   • Mobile Columns: Choose 1 or 2 columns

   • Column Gap: Spacing between products

   • Row Gap: Vertical spacing

3. Product Display Options

   • Product Image Size: Percentage of container (60-100%)

   • Product Box Width: Container size (550-780px)

   • Make Product Box Responsive: Recommended ON

   • Enable Endless Scroll: Enable infinite loading

4. Layout Tips

   • 3 columns work well for stores with many products

   • 2 columns give more space for product details

   • Mobile should typically use fewer columns

Step 5: Basic SEO Settings

Set up essential SEO elements.

1. Access SEO Settings

   • Find "SEO Settings" in theme settings

2. Upload Icons

   • Favicon: Small icon for browser tabs (32x32px)

   • Apple Touch Icon: For mobile bookmarks (120x120px)

3. Enable Rich Snippets

   • Product Rich Snippets: Turn ON

   • Article Rich Snippets: Turn ON

   • These help with search engine visibility

Step 6: Preview and Test

After basic configuration:

1. Preview Changes

   • Click "Preview" to see changes

   • Test on desktop and mobile

   • Check all essential pages

2. Test Essential Functions

   • Navigation works properly

   • Logo displays correctly

   • Fonts look good

   • Layout is responsive

3. Save Settings

   • Click "Save" in customizer

   • Changes are saved automatically but saving ensures nothing is lost

Common Setup Issues

Logo Not Displaying

• Check file format (PNG, JPG, SVG)

• Verify file size isn't too large

• Clear browser cache

Fonts Look Wrong

• Try different font combinations

• Check if font loads on mobile

• Clear browser cache

Layout Issues

• Adjust product box width

• Check responsive toggle setting

• Test on actual mobile device

Next Steps

With basic setup complete, move on to detailed customization:

👉 Next: Essential Configuration - Fine-tune your store appearance and functionality.

Quick Checklist

Before moving on, ensure you've completed:

• ✅ Announcement bar configured

• ✅ Fonts selected and tested

• ✅ Timezone set correctly

• ✅ Logo uploaded and sized

• ✅ Shop layout configured

• ✅ SEO settings enabled

---

Need Help?

💬 Join our community on Discord: https://discord.gg/hcc2GvgZc6

📧 Email us at: [email protected]

💻 Live chat with us: Available Monday–Friday, 10AM–6PM EST, directly on our website

• ✅ Preview tested on mobile and desktop