SwPanel – A Customized Shopify Admin Panel

This is one of my pet project, i was trying to create a customized ( not exactly ) Shopify Store Admin Panel ( don’t ask me why – just to get used with Shopify APIs ).

It has been designed as a Single page Java Script Driven Application. Most of the logic have been built by using Java Script, I followed the Convention Over Configuration Approach.


  • PHP5 for Server Side Logic
  • JS & jQuery for Client Side Logic
  • Foundation 4 for Responsive Skeleton & Styles

It is a fully hand coded Java Script with 1 Primary Module, 6 Context Modules and 2 Components.

Primary Module

  • suSwPanel Object ( client/scripts/swpanel.js )This is a Master control panel object, which initiate and maintain all context objects also handles all communication with SwPanel Server Side Module.

Context Modules

  • products ( client/scripts/model/swpanel/product.js )Render Product View and handles all products related Events
  • inventory ( client/scripts/model/swpanel/inventory.js )Render Inventory View and handles all inventory related Events
  • collections ( client/scripts/model/swpanel/collection.js )Render Collection View and handles all collection related Events
  • orders ( client/scripts/model/swpanel/order.js )Render Order View and handles all Order related Events
  • customers ( client/scripts/model/swpanel/customer.js )Render Customer View and handles all customers related Events
  • dashboard ( client/scripts/model/swpanel/dashboard.js )Render Dashboard View

Custom Components

  • swGrid ( client/scripts/utils/grid.js )Render the Archive & Sub Archive View for all Context
  • swDropDown ( client/scripts/utils/dropdown-paginate.js )Render Dropdown View for Context


  • swPanel-Config ( client/scripts/swpanel-config.js )The key object which has all configuration related to Contexts

It does almost all the things which can be done by Shopify Official Store Admin ( only in these five contexts Product, Inventory, Collection, Order and Customer )


  • Archive Products
  • Single Product
  • New Product
  • Create new Product
  • Update Products
  • Delete Products
  • Add Variants
  • Update Variants
  • Remove Variants
  • Add or Remove Collections
  • Add or Remove Images
  • Add or Remove Tags
  • Add Product Types & Vendors


  • Archive Variants
  • Add or Set Quantity


  • Archive Collections
  • Single Collection
  • New Collection
  • Create new Collection
  • Update Collections
  • Delete Collections
  • Add or Remove Products
  • Add Feature Images


  • Archive Orders
  • Single Order
  • Full fill Order
  • Mark as Payment Received
  • Cancel Order


  • Archive Customers
  • Single Customer


  • Just shows Counts of Product, Order, Collection and Customer
  • List recent store’s activity

If you install this application in your (test) shop, this application will install four magic .liquid template files in your current theme’s templates directory and one magic .liquid snippet file at your current theme’s snippets directory. If you wanna know why please read this article.

User : demo
Pass : password

Leave a Reply

Your email address will not be published. Required fields are marked *