Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Bootstrap Site Blueprints

You're reading from   Bootstrap Site Blueprints Without Bootstrap your web designs may not be reaching their full potential. This book will change that through a series of hands-on projects covering everything from custom icon fonts to JavaScript plugins.

Arrow left icon
Product type Paperback
Published in Feb 2014
Publisher Packt
ISBN-13 9781782164524
Length 304 pages
Edition Edition
Languages
Arrow right icon
Authors (2):
Arrow left icon
David Cochran David Cochran
Author Profile Icon David Cochran
David Cochran
Ian Whitley Ian Whitley
Author Profile Icon Ian Whitley
Ian Whitley
Arrow right icon
View More author details
Toc

Table of Contents (16) Chapters Close

Bootstrap Site Blueprints
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
1. Getting Started with Bootstrap 2. Bootstrappin' Your Portfolio FREE CHAPTER 3. Bootstrappin' a WordPress Theme 4. Bootstrappin' Business 5. Bootstrappin' E-commerce 6. Bootstrappin' a One-page Marketing Website Optimizing Site Assets Implementing Responsive Images Adding Swipe to the Carousel Index

Index

A

  • Accessible Rich Internet Applications (ARIA) /
  • attention-grabbing pricing tables, one-page marketing site
    • creating / Creating attention-grabbing pricing tables
    • variables, setting up / Setting up the variables, files, and markup
    • files, setting up / Setting up the variables, files, and markup
    • markup, setting up / Setting up the variables, files, and markup
    • table head, beautifying / Beautifying the table head
    • table body, styling / Styling the table body and foot
    • table foot, styling / Styling the table body and foot
    • packages, differentiating / Differentiating the packages
    • viewports, adjusting / Adjusting for small viewports
    • visual hierarchy, providing / Providing visual hierarchy to our tables

B

  • beginning files, Bootstrappin
    • sizing up /
  • Boilerplate .htaccess file
    • evaluating /
  • Boilerplate files
    • deleting /
    • updating /
    • pulling in /
  • Bootstrap
    • quality /
    • features /
    • about /
    • downloading /
    • source files /
    • project template folder, preparing /
    • CSS /
    • files list /
    • troubleshooting /
    • support, adding for Internet Explorer 8 /
  • Bootstrap CSS
    • compiling /
  • Bootstrap files
    • pulling in /
    • fonts /
    • JavaScript /
    • LESS files, using /
  • Bootstrappin
    • beginning files, sizing up /
    • complex banner area, creating /
    • utility navigation, adding /
    • responsive adjustments, making /
    • color scheme, implementing /
    • collapsed navbar, styling /
    • horizontal navbar, styling /
    • complex responsive layout, designing / Designing a complex responsive layout
    • complex footer, laying out / Laying out a complex footer
  • breadcrumbs, e-commerce
    • styling / Styling the breadcrumbs, page title, and pagination

C

  • carousel, online portfolio
    • marking up /
    • styling /
    • Font Awesome icons, setting for controls /
    • top and bottom padding, adding /
    • images, forcing to full width /
    • carousel height, constraining /
    • carousel indicators, re-positioning /
    • indicators, styling /
  • collapsed navbar, Bootstrappin
    • styling /
  • color scheme, Bootstrappin
    • implementing /
  • complex banner area, Bootstrappin
    • creating /
    • logo, placing above navbar /
    • navbar dropdown items, reviewing /
    • navbar dropdown items, checking /
  • complex footer, Bootstrappin
    • laying out / Laying out a complex footer
    • markup, setting up / Setting up the markup
    • tablet-width viewports, adjusting / Adjusting for tablet-width viewports
    • targeted responsive clearfix, adding / Adding a targeted responsive clearfix
    • details, refining / Refining the details
  • complex responsive layout, Bootstrappin
    • designing / Designing a complex responsive layout
    • medium and wide layout, adjusting / Adjusting the medium and wide layout
    • headings, adjusting / Adjusting headings, font sizes, and buttons
    • font sizes, adjusting / Adjusting headings, font sizes, and buttons
    • primary column, enhancing / Enhancing the primary column
    • tertiary column, adjusting / Adjusting the tertiary column
    • multiple viewports / Fine touches for multiple viewports
  • Content Delivery Network (CDN) /
  • CSS
    • optimizing /
  • custom base template, Roots theme
    • creating /
  • custom content template, Roots theme
    • creating /
    • carousel, building from custom fields /
    • content columns, adding from custom fields /
  • customer reviews tackling, one-page marketing site
    • about / Tackling customer reviews
    • captions, positioning / Positioning and styling the captions
    • captions, styling / Positioning and styling the captions
    • caption position, refining / Refining the caption position
    • Bootstrap grid classes, adding / Adding Bootstrap grid classes
    • Masonry JavaScript plugin, downloading / Downloading and linking up the Masonry JavaScript plugin
    • Masonry JavaScript plugin, linking up / Downloading and linking up the Masonry JavaScript plugin
    • Masonry JavaScript plugin, initializing on reviews layout / Initializing Masonry JavaScript on our reviews layout
    • image, trimming / Cutting and trimming our bricks
    • tiny screens, adjusting / Adjusting for tiny screens

D

  • design assets, Roots theme
    • swapping /

E

  • e-commerce, bootstrappin
    • products page markup, surveying / Surveying the markup for our products page
    • breadcrumbs, styling / Styling the breadcrumbs, page title, and pagination
    • page title, styling / Styling the breadcrumbs, page title, and pagination
    • pagination, styling / Styling the breadcrumbs, page title, and pagination
    • products grid, adjusting / Adjusting the products grid
    • options sidebar, styling / Styling the options sidebar
  • exercise files, online portfolio
    • surveying /

F

  • Features list, one-page marketing site
    • beautifying / Beautifying the features list
  • Font Awesome icons, online portfolio
    • adding /
  • footer, online portfolio
    • styling /
  • footer content, Roots theme
    • putting in place /

G

  • Glyphicon font icons /
  • Glyphicon fonts /

H

  • headings, one-page marketing site
    • enhancing / Adding the final touches
  • Home page content, Roots theme
    • adding back /
    • adding, WYSIWYG dump used /
    • adding, custom fields used /
  • horizontal navbar, Bootstrappin
    • styling /
  • HTML5 Boilerplate (H5BP)
    • about /
    • downloading /
  • HTML template file
    • setting up /

I

  • icon links, Roots theme
    • adding /
  • icons, online portfolio
    • adding /
  • ImageOptim app
    • URL /
  • images
    • optimizing /
  • images, Roots theme
    • adding /

J

  • JavaScript
    • optimizing /
  • JavaScript files, Roots theme
    • connecting /
  • jumbotron, one-page marketing site
    • customizing / Customizing the jumbotron
    • message design, refining / Refining the jumbotron message design

L

  • LESS
    • about /
    • nested rules /
    • variables /
    • mixins /
    • operations /
    • files, importing /
    • modular file organization /
  • LESS customization
    • performing /
    • variables, customizing /
    • variables, importing /
    • navbar variables, editing /
  • logo image, online portfolio
    • adding /
  • logo images, Roots theme
    • adding, to navbar and footer /

M

  • major structural elements
    • setting up /
  • mixins, LESS
    • about /
  • Modernizr /
  • modular file organization, LESS
    • about /

N

  • navbar, one-page marketing site
    • adding / Adjusting the navbar
  • navbar icon color, online portfolio
    • adding /
  • navbar items, Roots theme
    • configuring /
  • navbar markup
    • providing /
  • nav item padding, online portfolio
    • adjusting /
  • nested rules, LESS
    • about /

O

  • one-page marketing site
    • overview / Overview
    • beginning files, surveying / Surveying the starter files
    • page content, viewing / Viewing the page content
    • navbar, adjusting / Adjusting the navbar
    • jumbotron, customizing / Customizing the jumbotron
    • jumbotron message design, refining / Refining the jumbotron message design
    • Features list, beautifying / Beautifying the features list
    • customer reviews, tackling / Tackling customer reviews
    • attention-grabbing pricing tables, creating / Creating attention-grabbing pricing tables
    • headings, enhancing / Adding the final touches
    • ScrollSpy, adding to navbar / Adding ScrollSpy to the navbar
    • scroll, animating / Animating the scroll
  • online portfolio, Bootstrap
    • building /
    • features /
    • exercise files, surveying /
    • carousel, marking up /
    • responsive columns, creating /
    • links, turning into buttons /
    • logo image, adding /
    • nav item padding, adjusting /
    • icons, adding /
    • Font Awesome icons, adding /
    • navbar icon color, adjusting /
    • responsive navbar breakpoint, adjusting /
    • carousel, styling /
    • blocks of content, tweaking /
    • footer, styling /
    • recommended steps /
  • operations, LESS
    • about /
  • options sidebar, e-commerce
    • styling / Styling the options sidebar
    • basic styles, setting up / Setting up basic styles
    • Clearance Sale link, styling / Styling the Clearance Sale link
    • options list, styling / Styling the options list
    • Font Awesome icons, adding to option links / Adding Font Awesome checkboxes to our option links
    • LESS mixins, used for arranging option links / Using LESS mixins to arrange option links in columns
    • options list layout, adjusting for tablets and phones / Adjusting the options list layout for tablets and phones
    • options panel, collapsing for phone users / Collapsing the options panel for phone users
  • outdated browser message
    • adjusting /

P

  • page content, one-page marketing site
    • viewing / Viewing the page content
  • page scroll, one-page marketing site
    • animating / Animating the scroll
  • page template, Roots theme
    • customizing /
  • page title, e-commerce
    • styling / Styling the breadcrumbs, page title, and pagination
  • pagination, e-commerce
    • styling / Styling the breadcrumbs, page title, and pagination
  • Picturefill solution /
  • portfolio carousel
    • considering /
    • solutions, selecting from available solutions /
    • responsive images, preparing /
    • JavaScript, plugging in /
    • markup Structure, implementing /
    • testing /
    • adjusting /
    • end results /
  • products grid, e-commerce
    • adjusting / Adjusting the products grid
  • products page markup, e-commerce
    • surveying / Surveying the markup for our products page
  • project template folder
    • preparing /
    • H5BP, downloading /
    • Boilerplate files, deleting /
    • Boilerplate .htaccess file, evaluating /
    • Boilerplate files, updating /
    • favicon and touch icons, using /

R

  • responsive adjustments, Bootstrappin
    • making /
  • responsive columns, online portfolio
    • creating /
  • responsive images technique
    • about /
  • responsive navbar
    • compiling /
  • responsive navbar breakpoint, online portfolio
    • adjusting /
  • results
    • optimizing /
  • Roots assets folder
    • surveying /
  • Roots base template
    • about /
  • Roots theme
    • downloading /
    • URL /
    • installing /
    • navbar items, configuring /
    • Home page content, bringing into WordPress /
    • images, uploading into WordPress /
    • page template, customizing /
    • Roots base template /
    • custom base template, creating /
    • custom fields, using for custom structure /
    • custom content template, creating /
    • footer content, putting in place /
    • assets folder, surveying /
    • design assets, swapping /
    • stylesheet, connecting /
    • JavaScript files, connecting /
    • logo images, adding to navbar and footer /
    • icon links, adding /
    • WordPress-specific styles, adding back /

S

  • ScrollSpy, one-page marketing site
    • adding / Adding ScrollSpy to the navbar
  • site
    • title, providing /
    • outdated browser message, adjusting /
    • major structural elements, setting up /
  • stylesheet, Roots theme
    • connecting /

T

  • TouchSwipe jQuery plugin
    • reference link /
    • downloading /
    • initializing /
    • documentation /

U

  • utility navigation, Bootstrappin
    • adding /

V

  • variables, LESS
    • about /

W

  • WordPress-specific styles
    • adding /
  • WordPress custom fields
    • using, for custom structure /
lock icon The rest of the chapter is locked
arrow left Previous Section
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 $19.99/month. Cancel anytime