Have you ever wanted to display a specific set of products on a certain page, no matter who was viewing it? Perhaps that page wasn't even part of the "store" but was maybe part of your support area or blog. You might be showing all of your related books on a marketing landing page, just in case you might be able to convert a sale in addition to getting your customer to fill out a form. The product grid module allows you to select specific products from your catalog and display them in a grid style format.
The following prerequisites will be necessary to accomplish the goals of this article:
- Have access to your Hotcakes store administration
- Configure your store using the getting started wizard or do it manually
The information provided here is based upon the default configuration of Hotcakes and the default viewset. Your views may have more or less functionality, depending on how it was implemented by your technical team.
Product Grid Module
The product grid module is not placed for you anywhere on your site. If you wish to use it, you should add it to one or more pages, as desired. When you add this module to a page, it will begin working immediately without any configuration required.
The example above has only two products selected, and is being displayed as two columns. This may or may not want your store to display selected products the same way, but your designer can easily adjust that. We could be displaying 10 products with 10 columns, or with 2 columns. Everything is completely up to you.
This module has settings that are unique to how it works on your site for you and your customer. If you're not already familiar with how module settings work, you should see the module settings documentation to learn more.
These are the standard view settings you'll see across all of the store-oriented modules.
|View||This read-only setting will simply show you the view that was selected before viewing the current settings.|
|Select a View||If you wish to change the view that's being used to display the featured products, select the alternative view. By default, you'll only see "Index" as an option, unless your design team has created and added alternatives for you.|
This section allows you to use the common product picker control to look for products, and select them to be displayed in the grid. Please see the product picker control documentation to learn more about how the search works.
Once you see one or more products you'd like to have in the product grid, check the checkbox next to its name. When you've checked all of the products you intend to add, click the "Add Selected Products" button.
Products to Display
Initially, you won't see anything in this grid. You'll need to select one or more products first, and they'll begin to show here.
The grid allows you to sort the products by clicking the respective up and down links. You can also remove a product from the grid by clicking the delete link.
|Number of Columns||You'll have 3 columns by default, but you can put any integer value above 0 here. If your value doesn't match an expected format, it will be returned to 3. This value is used to help determine the width of each column when displayed on the page. For example, a 3 column layout will be 33% per column.|
Viewset View Location
You'll find the views for this module in the following location in your viewset: