Themes are rendered in the user devices and interact with the Store backend on StoreHippo platform through REST APIs. StoreHippo follows a fresh new approach to theme development by using AngularJS as the templating engine. The new mobile-first approach shifts the control from the server to user devices and that gives a great deal of flexibility to theme developers.
Theme layout is the top-level layout that acts a container for different pages of the theme. The layout contains the elements e.g. header, footer, navigation etc. that is common to multiple or all pages of the theme. StoreHippo allows hierarchical layouts.
Theme pages control layouts for specific parts of the theme e.g. product, category or blog pages. Each page has unique URL schema.
Widgets are reusable blocks of HTML code that can be referred in theme pages and layouts.
The theme has configuration variables that can change the look as well as the functionality of the entire theme without needing to edit the code.
StoreHippo uses AngularJS as the templating engine.
The functionality is enabled through widgets. StoreHippo offers a number of global widgets which exposes objects, variables, and functions to be used in themes. For example, ms.product widget exposes product object.
StoreHippo uses "ms." (represents MyStore) asnamespacefor various components including widgets, entities, global objects etc. Namespacing helps in avoiding conflict between global components and custom components created by theme developers.
Apart from objects provided by widgets, there are few global objects that are available throughout the theme. For example, ms.cart, ms.user