#
Customizing Shopify App Blocks
#
Introduction
You can use Nimstrata's pre-defined CSS classes within the Shopify theme editor or your existing stylesheets to customize the look and feel of the Search Results, Collection Pages, and Recommendations AI App Blocks.
Nimstrata's App Blocks are designed to be very flexible, offering Shopify merchants, developers, or marketing agencies the ability to quickly customize them to match style or branding requirements.
Default Styles Available
The Shopify app includes default styles so you can get started with no code, or, you can add your own custom CSS. Nimstrata has also partnered with best-in-class Shopify agencies to design and build pixel-perfect pages. Schedule a call to learn more.
#
Custom Styling
Each App Block has several CSS classes that match the BEM, or Block-Editor-Modifier methodology, beginning with rcc for “Retail Cloud Connect”, followed by the App Block type, component, and state.
Shared CSS Classes
Collection pages and search results are powered by the same Google Cloud Discovery AI functionality, so Search Results and Product Grid Collection Page App Blocks share CSS class names.
#
Inspecting Elements
The fastest way for most front-end developers to get started is to install an App Block, inspect each element, then edit a custom stylesheet.