ShopBase Developers
  • Getting started
  • Build An App
    • Making your first request
      • Authentication
        • Public apps
        • Private apps
        • OAuth
        • API access scopes
      • Rest API References
        • Rate limits
      • Using webhooks
        • Webhook events and topics
      • Response status codes
    • How to submit an app to ShopBase App Store
    • Getting your app approved
      • App requirements
      • Testing your app
      • Submitting your app
      • The review process
  • BUILD A THEME
    • Getting started building themes
    • Theme development resources
      • Connect to your store & start developing
      • Theme structure
      • Theme object, methods, and props
      • Theme editor
        • How to update configure for theme editor
    • How to submit a theme to ShopBase Theme Store
    • Storefront SDK
  • Test and Debug app
    • Debug apps with Postman
  • Tutorial
    • Manage orders and shipping
      • Manage orders with the REST Admin API
        • Transaction
        • Order
      • Edit an existing order with the Admin API
      • Manage fulfillments with Fulfillment and FulfillmentService resources
      • Get a country field using Admin API
  • Integrate a payment gateway
    • How to create your payment gateway on ShopBase
    • Technical Specifications
Powered by GitBook
On this page

Was this helpful?

  1. BUILD A THEME
  2. Theme development resources

Theme structure

Theme structure

src
   assets [1]
   config [2]
   layouts [3]
   sections [4]
   blocks [5]
   pages [6]
   templates [7]
   plugin.js [8]
   index.js [9]
.editorconfig: [10]
.env: [11]
.eslintrc.js [12]
.gitignore [13]
.prettierrc.js [14]
package.json [15]
  1. It contains all the assets used in the theme, including images and stylesheets files.

  2. It Contains theme editor configuration, including schema and default data.

  3. It contains theme layout templates.

  4. It contain all theme sections, which are reusable modules of content that can be customized and re-ordered by users of the theme.

  5. Custom reusable components that can be referenced in any page templates.

  6. Theme templates for core pages.

  7. There might be cases where you need a different markup for the same page. For example, you might want a sidebar on one product page but not in another. The workaround for this is to create alternate templates.

  8. Defines routes component. Each route component should map to a template in the pages folder.

  9. Since themes also function as plugins, this is a required file in order to use this theme as a plugin.

  10. ShopBase will use the environment variables declared in this file to connect to your ShopBase store.

Required files and folders: src/assets/styles/style.scss, src/config, src/index.js, .eslintrc.js, .prettierrc.js, .package.json

PreviousConnect to your store & start developingNextTheme object, methods, and props

Last updated 5 years ago

Was this helpful?