Having built our business home page, it's time to design our online store.
We'll build on the design from the previous chapter, adding a new page with the following elements:
A grid of product thumbnails, titles, and descriptions
A left-hand sidebar with options to filter our products by category, brand, and so on
Breadcrumbs and pagination to ease navigation through our inventory
Take a few moments to visit websites such as Zappos (http://www.zappos.com) and Amazon (http://www.amazon.com). Search or browse for products and you will see product grids with features similar to what we will be creating in this chapter.
When complete, we want our products page to look like the following screenshot on medium, large and extra-large screens:
Layout for medium large and extra-large screens
On extra-small screens, we want our products page to adjust to the following single column layout:
Bootstrap gives us a big head start in accomplishing this design-after which we can...