Designing Your Store with the Theme Editor

Once you've chosen your preferred store theme, you can access the theme editor to personalize your store using SHOPLINE's built-in tools. This guide will walk you through accessing the editor and introduce its core features, helping you quickly create an attractive online store.

Accessing the Theme Editor

After selecting your store's theme, follow these steps to access the theme editor and start customizing:

1. From your SHOPLINE admin panel, go to Online Store > Design.
   
2. Go to the My theme tab, locate the Current theme section, and click Design.
   
3. Begin customizing your theme within the theme editor.
   

Introduction to Theme Editor Features

SHOPLINE's theme editor offers a variety of tools to help you create a unique online store. 

Custom Design for Different Pages

You can switch between pages, such as the homepage, collection page, and product page, for customization. Certain pages, like product and blog pages, even allow custom templates for unique designs. After making adjustments, preview your design in desktop, tablet, phone, or full-screen mode in real time.

Intuitive Components for Easy Configuration

For each store page, use the components in the left sidebar to quickly configure the corresponding page modules. The drag-and-drop feature lets you easily reorder the modules as needed. Additionally, you can add theme or app components to enhance your store's functionality.

Theme Settings for a Consistent Design

The Theme Settings section enables you to maintain a consistent look across your entire store. Customize elements such as colors, typography, and product display settings to ensure a cohesive brand identity.

Apps to Expand Theme Functionality

Use the App embeds section to manage installed apps, which can extend your store's functionality and offer more personalized services tailored to your customers' needs.

Advanced Customization with CSS

For those with technical expertise, the theme editor supports CSS, allowing you to create custom elements and features for your store.

Real-time Store Theme Preview 

In addition to the real-time preview within the editor, you can also preview your live store once you're satisfied with your design. Save your changes, then click Preview your store to see how it looks live.

Managing Added Themes in the Theme Library

If you're interested in multiple themes from the Theme shop, you can add them to your theme library for future use. Here's how: 

1. In the Theme shop, select the theme you want and click Add theme.
   
2. You'll be directed to the Theme library section of the Store Design page, where you'll find the theme you just added.
   
3. For each theme, you can click Preview to see how it looks or Design to access the editor.
   
4. You can also click Options to perform actions like Publish, Duplicate, Rename, or Delete.