Gridsome Shopify Starter Theme

user

Hervé bitcoinvsalts

STOREFRONT

Icon for Shopify

Shopify Theme

Icon for Tailwind

Designed in Tailwind

bootstrap icon

Version : 1.0.0

bootstrap icon

Updated: 50 weeks ago

bootstrap iconPrice:
Free

Created:

24 April, 2023

Compatible Browsers:

Firefox, Safari, Opera, Chrome, Edge, Brave

High Resolution:

Yes

This is a boilerplate starter, optimized to reach the highest scores on Google Lighthouse, aiming to showcase how Gridsome and Shopify can work together, to create an amazingly fast shopping experience for consumers.

Check Live Preview: View Demo

Features

  • ✅ 4 x 100% Highest Scores on Google Lighthouse!
  • ✅ Full SSR (Server Side Rendering) Static Site
  • ✅ Progressive Web App (PWA) with "Add to Home Screen" button.
  • ✅ Connected to Shopify backend
  • ✅ Home Page showing Featured Products
  • ✅ Product Search
  • ✅ Product Page
  • ✅ Collection Search
  • ✅ All Collections Page
  • ✅ TailwindCSS with PurgeCSS to remove unused css.
  • ✅ SEO optimized
  • ✅ Sitemap
grindsome-hero-sectiongrindsome-seo-score

Installation Steps:

  • ✅ Click on Download button.
  • ✅ A modal asking for email address appears,please enter your email address, and click Download Now.
  • ✅ Extract the zip files.
  • ✅ You will need to create a private app in Shopify, and give it access to the Storefront API. Make sure to note the Storefront API key, and your store name.
  • ✅ Install necessary dependencies, along with gridsome cli
  • npm install -g @gridsome/cliyarn global add @gridsome/cli
  • ✅ You will need to add your Storefront API shop name (https://'shop-name'.myshopify.com) & token to an env file before running this starter.
  • GRIDSOME_SHOPIFY_STOREFRONT= 'shop name'GRIDSOME_SHOPIFY_STOREFRONT_TOKEN='storefront token'
  • Or you can manually edit the Shopify Source Plugin's configurations in gridsome.config.js.
  • ✅ Enter the site folder, and run following command to start a local development server.
    gridsome develop

Related Themes

View all

Subscribe to our newsletter!

Sign up for our newsletter and stay in the loop on all the latest updates and exclusive content.

support

BlogDocumentationCreate Support Ticket

follow

twitter logo
copyright2023 copyright All right Reserved