1. Docs
  2. Weaverse Hydrogen

Getting Started

Published on Nov 20, 2023, updated 5 months ago

Taking the First Step

Welcome to Weaverse! This guide will walk you through integrating the Weaverse app with your Shopify store and initiating your first Weaverse Hydrogen project.

Exploring Before Committing: The Weaverse Playground

Not ready to install the app just yet? Try out our Weaverse Playground to get a feel for the features. For guidance, watch our brief tutorial video below.

Installing the Weaverse App from the Shopify App Store

Begin by installing the Weaverse app. Go to the Shopify app store, search for "Weaverse," and follow the installation instructions.

Weaverse on Shopify Apps Store

Creating a New Weaverse Hydrogen Project

Start a New Project

Create Weaverse Hydrogen Project

In the Weaverse dashboard, click "Create New Project" to begin.

Choose a Starter Theme

Select Weaverse Starter Theme

Select from various Hydrogen starter themes. The default "Pilot" theme is free and a great starting point.

Experiment with the Demo

Use the default Preview URL to explore the theme's features and interface.

Start setup Weaverse Project

When ready, click "Start Setup" to proceed with building or deploying your project.

Setting Up Your Project

Choose from two setup options:

  • For Developers: Clone the project locally or use our command to start the development server.
  • For Non-Developers: Follow our guide to deploy the project live. This option is less technical. For more information, refer to our deployment guide.

Accessing the Development Server

After setup, enter the development server preview URL (default http://localhost:3456) in the Preview URL field and click "Next."

Note: You can later modify the Preview URL in the Project Settings:

Weaverse Project Settings

💡 Tip: Use a Chrome-based Browser for optimal experience. Browsers like Safari may not support localhost.

Exploring the Theme Customizer

The Theme Customizer is designed to mirror Shopify's OS2 Theme Customizer for ease of use.

Adding Sections and Customizing

Start adding and customizing sections in the user-friendly Theme Customizer.

Next Steps

You're now ready to dive in! Build your first Weaverse Hydrogen Theme with our guide.

👉 Begin building your Weaverse Hydrogen Theme

Was this article helpful?