Search icon
Subscription
0
Cart icon
Close icon
You have no products in your basket yet
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletters
Free Learning
Arrow right icon
Bootstrap 4 Site Blueprints - Second Edition

You're reading from  Bootstrap 4 Site Blueprints - Second Edition

Product type Book
Published in Oct 2016
Publisher Packt
ISBN-13 9781785889653
Pages 404 pages
Edition 2nd Edition
Languages
Authors (2):
Ian Whitney Ian Whitney
Profile icon Ian Whitney
David Cochran David Cochran
Profile icon David Cochran
View More author details

Table of Contents (15) Chapters

Bootstrap 4 Site Blueprints
Credits
About the Authors
About the Reviewer
www.PacktPub.com
Preface
1. Getting Started with Bootstrap 2. Creating Your Own Build Process with Gulp 3. Customizing Your Blog with Bootstrap and Sass 4. Bootstrappin' a WordPress Theme 5. Bootstrappin' Your Portfolio 6. Bootstrappin' Business 7. Bootstrappin' E-Commerce 8. Bootstrappin' a One-Page Marketing Website 9. Building an Angular 2 App with Bootstrap

Chapter 7. Bootstrappin' E-Commerce

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...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at €14.99/month. Cancel anytime}