Documentation

Denim Archive Theme

Back to Shopify

Complete guide for setting up, customizing, and using your Shopify theme.

Denim Archive LOOM&CRADLE Baby

Denim Archive Theme Documentation

Version: 1.0.0
Last Updated: January 2025

Welcome to the Denim Archive theme documentation. This guide will help you set up, customize, and make the most of your theme.

Table of Contents

  1. Getting Started
  2. Theme Installation
  3. Initial Setup
  4. Customization Guide
  5. Sections Overview
  6. Templates
  7. Settings
  8. Troubleshooting
  9. FAQ
  10. Support

Getting Started

What is Denim Archive?

Denim Archive is a premium Shopify theme designed for fashion and lifestyle brands, with a focus on denim and apparel. It features a clean, minimalist design that puts your products front and center.

Key Features

  • Fully Responsive Design - Looks great on all devices
  • Shopify 2.0 Architecture - Modern, flexible, and customizable
  • Advanced Product Filtering - Help customers find what they're looking for
  • AJAX Cart - Fast, seamless shopping experience
  • Blog Support - Share your brand story
  • SEO Optimized - Built for search engines
  • Accessibility Compliant - WCAG 2.1 AA standards

Theme Installation

Method 1: Upload via Shopify Admin

  1. Log in to your Shopify admin
  2. Go to Online Store > Themes
  3. Click Add theme > Upload zip file
  4. Select your denim-archive-theme.zip file
  5. Wait for the upload to complete
  6. Click Actions > Publish to make it live

Method 2: Using Shopify CLI

# Install Shopify CLI (if not already installed)
npm install -g @shopify/cli @shopify/theme

# Navigate to theme directory
cd /path/to/denim-archive-theme

# Push theme to your store
shopify theme push --store=your-store-name.myshopify.com

Initial Setup

1. Navigation Menus

Create your navigation menus:

  1. Go to Online Store > Navigation
  2. Create or edit your Main menu:
    • Add links to Collections, Pages, or Custom URLs
    • Example: Collections, Philosophy, Atelier, Journal
  3. Create Footer menus (optional):
    • Atelier Services
    • Our Commitment
    • Legal & Contact

2. Homepage Sections

Customize your homepage:

  1. Go to Online Store > Themes > Customize
  2. Click on each section to edit:
    • Hero Slider - Add your hero images and messaging
    • Current Curation - Showcase featured products
    • Crafted Section - Highlight your brand values
    • Featured Collection - Display a product collection

3. Product Setup

For best results:

  1. Product Images: Use high-quality images (recommended: 2000x2000px)
  2. Product Variants: Set up Size, Color, and other options
  3. Product Tags: Use tags for filtering (e.g., "Fabric:Cotton", "Fabric:Denim")
  4. Product Descriptions: Write detailed, engaging descriptions

4. Collection Setup

  1. Create collections in Products > Collections
  2. Add products to collections
  3. Set up collection filters in Theme Settings > Collection Filters
  4. Enable filters: Color, Size, Fabric, Availability, Price

Customization Guide

Theme Settings

Access theme settings via Online Store > Themes > Customize > Theme settings.

Colors

Customize your theme colors:

  • Background Color: Main background color
  • Text Color: Primary text color
  • Accent Color: Used for links, buttons, and highlights

Typography

Choose your fonts:

  • Body Font: Used for body text and paragraphs
  • Heading Font: Used for headings and titles

Social Media

Add your social media links:

  • Instagram URL
  • Facebook URL
  • Pinterest URL

Links will appear in the footer.

Section Customization

Each section can be customized individually:

  1. Go to Online Store > Themes > Customize
  2. Click on any section to edit
  3. Use the settings panel on the right
  4. Click Save when done

Sections Overview

Header

The header includes:

  • Logo (text or image)
  • Main navigation menu
  • Search icon
  • Cart icon with item count

Customization:

  • Upload logo in Header section settings
  • Select navigation menu
  • Customize colors and spacing

Hero Slider

Display multiple hero banners with:

  • Image slides
  • Heading text
  • Subheading text
  • Call-to-action button
  • Auto-play option
  • Transition effects (fade, slide, opacity)

Customization:

  • Add/remove slides
  • Position text (left, center, right)
  • Customize colors per slide
  • Set auto-play speed

Current Curation

Showcase featured products in a grid layout.

Customization:

  • Select collection to display
  • Set heading text
  • Adjust number of products shown

Crafted Section

Highlight your brand values with icons and text.

Customization:

  • Add/remove blocks
  • Upload custom icons (or use default icons)
  • Edit heading and descriptions

Featured Collection

Display a product collection with customizable heading.

Customization:

  • Select collection
  • Set heading text
  • Adjust grid layout

Footer

Footer includes:

  • Footer menus (up to 3)
  • Newsletter signup
  • Social media links
  • Copyright text

Customization:

  • Add footer menus
  • Customize newsletter form
  • Add social media links

Templates

Homepage (index.json)

The homepage template includes all homepage sections. Customize via the theme editor.

Product Page (product.json)

Features:

  • Product image gallery
  • Variant selector (Size, Color, etc.)
  • Quantity selector
  • Add to cart button
  • Product description
  • Related products

Customization:

  • Product images and descriptions are managed in Products
  • Layout and styling via theme settings

Collection Page (collection.json)

Features:

  • Product grid
  • Filter sidebar (Color, Size, Fabric, Price, Availability)
  • Sort options
  • Layout switcher (2, 3, or 4 columns)
  • Product count

Customization:

  • Enable/disable filters in Theme Settings > Collection Filters
  • Customize filter labels
  • Adjust grid layout

Cart Page (cart.json)

Features:

  • Cart items list
  • Quantity controls (+/-)
  • Remove items
  • Shipping estimation
  • Price summary
  • Checkout buttons (Checkout, Google Pay)

Customization:

  • Cart styling via theme settings
  • Checkout options in Settings > Checkout

Search Page (search.json)

Features:

  • Search input
  • Search results (products, pages, articles)
  • Results count

Blog Pages

  • Blog Listing (blog.json): Displays blog articles
  • Blog Article (article.json): Individual article page

Static Pages

  • Page Template (page.json): For About, FAQ, etc.
  • Contact Page (page.contact.json): Contact form with Google Maps

Other Pages

  • 404 Error Page: Custom error page
  • Password Page: For password-protected stores
  • Gift Card Page: Gift card redemption

Settings

Collection Filters

Configure product filters:

  1. Go to Theme Settings > Collection Filters
  2. Enable/disable filters:
    • Color Filter
    • Size Filter
    • Fabric Filter
  3. Customize filter labels

How Filters Work:

  • Color & Size: Uses product options/variants
  • Fabric: Uses product tags (format: "Fabric:Cotton", "Fabric:Denim")
  • Price: Price range slider
  • Availability: In stock / Out of stock

Contact Page Settings

Configure your contact page:

  1. Go to Contact Page section
  2. Set contact information:
    • Email address
    • Phone number
    • WhatsApp number
    • Physical address
  3. Enable Google Maps:
    • Option 1: Paste Google Maps embed URL (recommended)
    • Option 2: Use API key with address

Google Maps Setup:

See GOOGLE_MAPS_SETUP.md for detailed instructions.

Troubleshooting

Products Not Showing on Collection Page

Solution:

  1. Check that products are added to the collection
  2. Verify filters aren't hiding all products
  3. Clear browser cache
  4. Check that collection is published

Images Not Loading

Solution:

  1. Ensure images are uploaded to Shopify
  2. Check image file sizes (recommended: under 2MB)
  3. Verify image URLs in theme editor
  4. Clear browser cache

Filters Not Working

Solution:

  1. Verify filters are enabled in Theme Settings
  2. Check that products have proper variants/tags
  3. For Fabric filter, ensure tags start with "Fabric:"
  4. Clear browser cache

Cart Not Updating

Solution:

  1. Check browser console for JavaScript errors
  2. Ensure JavaScript files are loading
  3. Try disabling browser extensions
  4. Clear browser cache and cookies

Mobile Layout Issues

Solution:

  1. Clear browser cache
  2. Test in different browsers
  3. Check that images are properly sized
  4. Verify responsive breakpoints

Contact Form Not Sending Emails

Solution:

  1. Check email settings in Settings > Notifications
  2. Verify "Customer contact form" email is set
  3. Check spam folder
  4. Test with different email addresses

FAQ

How do I change the logo?

  1. Go to Online Store > Themes > Customize
  2. Click on Header section
  3. Upload your logo image
  4. Click Save

How do I add products to the homepage?

  1. Go to Online Store > Themes > Customize
  2. Click on Current Curation or Featured Collection section
  3. Select the collection you want to display
  4. Click Save

How do I customize colors?

  1. Go to Online Store > Themes > Customize > Theme settings
  2. Click on Colors
  3. Choose your colors
  4. Click Save

How do I change fonts?

  1. Go to Online Store > Themes > Customize > Theme settings
  2. Click on Typography
  3. Select your fonts
  4. Click Save

How do I add a new slide to the hero slider?

  1. Go to Online Store > Themes > Customize
  2. Click on Hero Slider section
  3. Click Add block or Add slide
  4. Upload image and add content
  5. Click Save

How do I enable/disable filters?

  1. Go to Online Store > Themes > Customize > Theme settings
  2. Click on Collection Filters
  3. Check/uncheck filters you want to show
  4. Click Save

How do I set up the contact page?

  1. Create a new page in Online Store > Pages
  2. Title it "Contact Us"
  3. Select contact from the Template dropdown
  4. Go to Customize and edit the Contact section
  5. Add your contact information and Google Maps (optional)

Can I customize the cart page?

Yes! The cart page can be customized via the theme editor. Go to Online Store > Themes > Customize and look for cart-related settings.

How do I add social media links?

  1. Go to Online Store > Themes > Customize > Theme settings
  2. Click on Social Media
  3. Add your social media URLs
  4. Click Save

What image sizes should I use?

  • Product Images: 2000x2000px (square)
  • Hero Images: 1920x1080px (landscape)
  • Collection Images: 1200x1200px (square)
  • Blog Images: 1200x800px (landscape)

How do I update the theme?

If you purchased the theme from the Shopify Theme Store:

  1. Go to Online Store > Themes
  2. Click Actions > Update
  3. Follow the prompts

Important: Always backup your theme before updating. Duplicate your theme first!

Support

Getting Help

If you need assistance with the Denim Archive theme:

  1. Check this documentation - Most questions are answered here
  2. Contact Support - Use our support form: https://elsysolutions.com/contact
  3. Email Support - info@elsysolutions.com
  4. Phone Support - +1 4029376787

Support Policy

What We Support:

  • Bug fixes and technical issues
  • Theme functionality questions
  • Setup and installation help
  • Customization guidance

What We Don't Support:

  • Custom development beyond theme scope
  • Third-party app integrations (we can provide guidance)
  • Store setup and product management
  • Marketing and SEO consulting

Response Time:

We aim to respond to all support requests within 2 business days.

Critical Bugs:

Critical bugs (broken layouts, dead links, logical errors) are fixed immediately or within 24 hours.

Before Contacting Support

Please provide:

  1. Store URL (e.g., https://yourstore.myshopify.com)
  2. Theme Version (found in config.yml or theme settings)
  3. Description of Problem - Be as detailed as possible
  4. Screenshots - If applicable, include screenshots or screen recordings
  5. Steps to Reproduce - How can we reproduce the issue?
  6. Browser/Device - What browser and device are you using?

Custom Development

If you need custom development beyond the theme's capabilities:

  • We recommend hiring a Shopify Partner
  • You can find certified developers at partners.shopify.com
  • Always duplicate your theme before making custom code changes

Additional Resources

Shopify Resources

Theme Development

Changelog

Version 1.0.0 (January 2025)

Initial Release:

  • Complete theme structure
  • All required templates and sections
  • Advanced product filtering
  • AJAX cart functionality
  • Contact page with Google Maps
  • Blog support
  • 404 and password pages
  • Mobile optimized
  • SEO optimized
  • Accessibility compliant

License

This theme is licensed for use on Shopify stores. See your purchase agreement for full terms.

Thank you for choosing Denim Archive!

For support, visit: https://elsysolutions.com/contact

Need Help?

If you have questions or need support, we're here to help.

Contact Support