The Default Browse Page uses the MobilePage
template with no user segments specified and it applies at all locations, as shown in the following figure:
![This illustration is described in the preceding text.](media/image3.png)
MobilePage template and result.
SecondaryContent
These are the cartridges used in SecondaryContent
.
Cartridge | Cartridge Type | Shared Cartridge | Description |
---|---|---|---|
Breadcrumbs | Breadcrumbs - Breadcrumbs | No | The breadcrumbs appropriate for the current navigation state. |
GuidedNavigation | ContentSlot-Secondary - Guided Navigation | Yes | The guided navigation container |
MainContent
These are the cartridges used in MainContent
.
Cartridge | Cartridge Type | Shared Cartridge | Description |
---|---|---|---|
Results List Slot | ContentSlot-Main - Results List | Yes | The results of the specified query. |
Search Adjustments | SearchAdjustments - Search Adjustments | No | Displays search adjustments messages such as “Did you mean” or auto-corrections. |
Category Page: This page uses the MobilePage template with a user segment of CategoryOnly
for the category/location feature, which serves to show only the category page when viewing a category. This organization and the result is shown in the following figure:
![This illustration is described in the preceding text.](media/image4.png)
MobilePage template organization for Category Page and result
SecondaryContent
This is the same as for the Default Browse Page.
MainContent
These are the cartridges used in MainContent
.
Cartridge | Cartridge Type | Shared Cartridge | Description |
---|---|---|---|
Category Products Grid | ProductList-ATGCategoryChildren - Category Products Grid | No | The child products of the current category |
Featured Items | ContentSlot-Main - Featured Items | Yes | The items to be displayed as featured items |
Side-by-side Comparison
Both CRS-M and the Commerce Reference Store desktop version create default browse and category pages. They use separate, shared instances of the same cartridges to construct the page definitions, as shown in the following figures.
![This illustration is described in the preceding text.](media/image5.png)
CRS-M and Commerce Reference Store compared
![This illustration is described in the preceding text.](media/image6.png)
Category Page organization for CRS Desktop
![This illustration is described in the preceding text.](media/image7.png)
Category Page organization for CRS-M
Default Browse Page Configuration
Within the Default Browse Page definition there is a MainContent
section that includes a single ContentSlot
-Main cartridge instance, called Results List, which renders the products that are appropriate for the shopper’s current navigation state. This Endeca content slot gets its content from the /content/Shared/Results List content collection. The Results List content collection has an item called Default Results List, which is returned for all locations. The Default Results List item gets its contents from a ResultsList cartridge that has been configured with Experience Manager to return a default 12 records per page.
Using Shared Cartridges
The advantage of sharing cartridges across Commerce Reference Store and CRS-M is that the same content is reused. For example, cartridges can be shared for reuse across different channels where the merchandiser wants the same content on both channels for a more consistent cross channel user experience. In the example in the following figure, the Featured Items cartridge in the Shared folder is used both in Commerce Reference Store and CRS-M.
![This illustration is described in the preceding text.](media/image8.png)
Using a shared cartridge
Dimensions
CRS-M uses dimensions to provide search refinement functionality. Dimensions are used to filter search results based on the properties of items in the result set, for example, price, feature, or color. The following illustration shows the search results screen with the “Filter” choices selected.
Results Screen with “Filter” Option
Category Page
The Category Page displays like simple browse page. However, the browse page data comes from the Endeca MDEX engine, and the category page receives data through an ATG CategoryLookup droplet. You configure this page in Experience Manager by selecting Mobile, Web Browse Pages, Category page, and choosing the “CatalogOnly” user segment.
When the shopper selects the Category Browse button and arrives at the main filter page the system displays the standard text “Filter by:” above all dimension groupings.
See the Commerce Reference Store Overview for more information on the Category Page feature.
Differences between Commerce Reference Store and CRS-M with regard to Search and Dimensions
CRS-M uses the same ResultsList (for search results) and GuidedNavigation cartridges as Commerce Reference Store, and does not modify their behavior, instead providing mobile-specific renderers.
Endeca Guided Navigation - Issues that are unique to mobile
In Commerce Reference Store the guided navigation controls display in the left column of the page and the search results in the right column of the page, while in CRS-M, they are “one behind the other,” meaning that CRS-M is either showing guided navigation or search results, and they toggle back and forth when the user selects “filter” or “done”. In this way, the shopper sees one screen at a time instead of both side by side, but with the data always present. Technically, CRS-M is either displaying guided navigation (SecondaryContent cartridges) or search results (MainContent cartridges).
CRS-M Categories
Empty Result Set Screen
Mobile JSP renderers for cartridges
The JSP renderers for the cartridges that are used in Commerce Reference Store are located in the store.war directory. The path to each JSP renderer follows this convention:
store.war/mobile/cartridges/cartridge-type/cartridge-type.jsp
For example, the path to the Breadcrumbs cartridge renderer is:
store.war/mobile/cartridges/Breadcrumbs/Breadcrumbs.jsp
Each renderer has its own directory, so that associated content (sub-pages, images, and so on) can be grouped together, making it possible for renderers to be packaged as stand-alone units. When you give each renderer a unique name it makes it easier to distinguish one file from another during various development tasks.
Cartridges unique to mobile
Cartridges that are unique for mobile are:
Mobile Page
HorizontalResultsList
Media Banner
Search Adjustments
MobilePage
MobilePage.jsp
is the main page template for mobile, the category page, and all of the mobile Endeca-driven pages. This is the page that displays the search result or the guided navigation filter. Other cartridges can be added to this template in Experience Manager.
store.war\mobile\cartridges\MobilePage\MobilePage.jsp
HorizontalResultsList
HorizontalResultsList.jsp
renders a results list horizontally inside a touch slider. The slider contains the number of records per page that is specified in the cartridge and provides a left and right arrow, where appropriate, for the user to navigate through pages. This cartridge is currently used in the Style by Zhanna brand landing page to showcase all products for this brand sorted by price descending.
store.war\mobile\cartridges\HorizontalResultsList\HorizontalResultsList.jsp
MediaBanner
MediaBanner.jsp
displays the media image that was specified in the cartridge. It also makes the image a hyperlink, if a URL was specified in the cartridge. This cartridge is currently used in the Style By Zhanna brand landing page to display an ad for the brand along with its logo.
store.war\mobile\cartridges\MediaBanner\MediaBanner.jsp
SearchAdjustments
SearchAdjustments.jsp
renders corrections and suggestions made to the search term to enhance search results.
store.war\mobile\cartridges\SearchAdjustments\SearchAdjustments.jsp
This cartridge supports two important features:
Auto-correct: Instead of letting the MDEX silently correct terms that returns zero results, the Search Adjustment cartridge displays a message to the user letting them know that their search term has been auto-corrected.
Did you mean?: If a search term returned very few results while other similar terms return more results, this renderer displays these alternative search terms to the user and allows them to modify their original search by simply clicking on one of those terms.