Pilot - Shopify Hydrogen Starter Theme

Discover the Pilot theme, a comprehensive starter theme brought to you by Weaverse. It's engineered to serve as a dependable cornerstone for your theme development and customization needs. Envision Pilot as the Dawn theme's counterpart for the Shopify Online Store 2.0.

Pilot finds its roots in Shopify's Hydrogen Demo Store and is seamlessly integrated with Weaverse. This integration facilitates efficient theme building and customization, ensuring adherence to industry best practices and standards.

Features

• Live Preview: Instantly see your theme changes in Weaverse Studio.
• Component Schema Definition: Create a customizable component schema in Weaverse Studio.
• Component-Level Loader: Incorporate a Remix-style loader at the component level, fetching data from the Shopify Storefront API or other third-party resources.
• Tailwind CSS Integration: Design with ease using Tailwind CSS, a utility-first framework for crafting custom interfaces.
• Shopify Resource Picker: Conveniently select Shopify resources like products, collections, pages, blogs, articles, etc.
• Multi-Market and Language Support: Expand your reach by selling in various markets and languages.
• Global Theme Settings: Customize broad theme aspects such as colors, fonts, and more.

Getting Started

Access the Pilot theme on GitHub. As an open-source project, you can deploy it directly to platforms like Oxygen/Vercel or clone it to your local environment for further customization.

Available Sections

• Image with Text: Showcase an image with a text overlay.
• Image Gallery: Create a stunning gallery of images.
• Featured Product: Highlight a product of your choice.
• Featured Collection: Showcase a specific collection.
• Related Products: Suggest related products to your customers.
• Blog Posts: Display recent blog entries.
• Rich Text: Present rich text content.
• Newsletter: Incorporate a newsletter subscription form.
• Map: Add an interactive map.
• Video: Embed a video.
• Testimonials: Share customer testimonials.
• Custom HTML: Include custom HTML content.
• Metaobject Demo: Demonstrate a Shopify metaobject.

Global Theme Settings

Pilot comes equipped with comprehensive global theme settings, offering extensive customization options. Learn more about these settings in our Global Theme Settings guide.

Metaobjects

Weaverse introduces a metaobject picker input, enabling users to select and display Shopify metaobjects within the theme. Here's how you can set up and use metaobjects with the Pilot theme.

Setting Up Metaobjects in Shopify

1. In Shopify Admin, navigate to Settings > Custom data.
2. Under Metaobjects, click Add definition.
3. Name your metaobject definition.
4. Add fields by clicking Add field. These fields determine the content of your metaobject, with each offering specific options and validations. For instance, to create a member's profile, include fields for an avatar, name, and title:

• Avatar: File type (limit to images by deselecting videos)
• Name: Single line text
• Title: Single line text
• Save your settings. Here's what your setup might look like:

Creating a Metaobject Entry in Shopify

1. Navigate to Content > Metaobjects in Shopify Admin.
2. Click Add entry and select your previously created metaobject definition.
3. Fill out the fields for your metaobject entry, such as avatar, name, and title for a member profile.
4. Save your entry.
5. Repeat to add more entries as needed.

Integrating Metaobjects in the Pilot Theme

1. In Weaverse Studio, go to Theme > Sections > Add section.
2. Choose the Metaobject demo section.
3. From the Inspector, select your created metaobject.
4. Preview your changes. Check out this video demo: