Bootstrap

Web Design Bootstrap Navigation

How to Integrate Tabs into Your Content with a Page Navigation Toolbar

You may find that you have too much page content to ideally fit a single page. Rather than creating a series of child pages, however, you can include a Page Navigation Toolbar that allows you to tab between content on a single page.

Paris Tuzun

Bootstrap Web Design

How to Showcase Your Team and Organizational Leadership

Showcasing your team or leadership can help personalize a brand or organization. This tutorial walks you through how to build a team page that humanizes your brand and messaging.

Paris Tuzun

Bootstrap Form Tutorials Web Design

How to Use Bootstrap to Create a Form with Inline Inputs

In order to conserve design space, you may need to have your form inputs inline rather than stacked. Bootstrap makes this incredibly easy to do.

Paris Tuzun

Web Design Bootstrap Navigation

How to Create a Department Listing or Directory Page (Part 2)

The most important information when showcasing a department or directory is a mission statement, leadership biography, and pertinent contact information. Here's how to design a website that makes those details look as important as they are to your organization.

Paris Tuzun

Web Design Navigation Bootstrap

How to Create a Department Listing or Directory Page (Part 1)

If you have multiple departments or directories in your organization, it’s important to create a single page that lists important info as well as links to separate pages.

Paris Tuzun

Bootstrap Navigation Search Web Design

How to Add Additional Links with Easy-to-Use Boxes Based on Bootstrap Columns

Often you need to add additional or relevant links to the bottom of your content. Do so with style using some simple boxes and default Bootstrap columns.

Paris Tuzun

Web Design Navigation Bootstrap

How to Create Stylish, Informative Breadcrumbs

Breadcrumbs are fantastic UI components that help the user navigate across a given website. They can also further your branding and web design efforts.

Paris Tuzun

Web Design Bootstrap

How to Use Absolute Positioning with Your Images

Your guide to using absolute bottom positioning with your images so that they are fixed and appear to peek over a designated break line.

Paris Tuzun

Web Design Navigation Bootstrap

How to Use Javascript to Make Bootstrap Rows Clickable

You can make basic Bootstrap rows entirely clickable as a link utilizing the JavaScript “onclick” function.

Paris Tuzun

Bootstrap Web Design Navigation

Build a Fixed Top Navigation that Disappears as Users Scroll

Fixed top navigation better allows your users to navigate your site as they go through its content. However, fully fixed navigations can often take up precious real estate as a user scrolls down a page. The solution? Have fixed navigation that only shows as a user scrolls back up.

Paris Tuzun

Web Design Bootstrap

How to Use Bootstrap Columns to Create a Stacked List of Features

Need to highlight your product’s features? List them in a distinctive column using default Bootstrap.

Paris Tuzun

Web Design Bootstrap

How to Make an Image Fill the Page Margins

When using Bootstrap containers, your image and text section will by default have padding on either side of it. Often, however, you will want your image to meet the page’s edge without padding.

Paris Tuzun

Web Design Navigation Bootstrap Sliders

How to Combine FontAwesome with a Slider to Create Quick Links

Getting users quickly to their end destination can be tricky. With strategic icons and simple text, however, you can help your audience quickly find what they need.

Paris Tuzun

Web Design Bootstrap

Create Showcase Section with Bootstrap Nav-Pills

With nav pills, you can highlight your products, services, or values in an easy-to-use content showcase.

Paris Tuzun

Web Design Bootstrap

How to Create Service Boxes with Text Hovers

Give your visitors additional information without compromising on sleek visual design by using these service boxes with text hovers.

Paris Tuzun

Web Design Bootstrap

How to Create Clickable Image Overlays

Are you an organization with multiple locations? Here's how to make a custom map to showcase more information about your business on your map feature.

Paris Tuzun

Bootstrap Web Design

How to Create a Hero with a Video Background

Video content remains some of the highest-converting content on your website, and hero images are one of the first ways your audience interacts with your brand. Here's how to combine the power of video with the eye-catching design of a hero banner.

Paris Tuzun

Web Design Bootstrap

Making Your YouTube Embeds Mobile Responsive with Bootstrap

Mobile video is more than just a trend; it's becoming the norm. Here's how to ensure your YouTube video embeds still look great and function properly on your website using Bootstrap.

Scott Madara

Web Design Bootstrap

Ultimate Guide to Understanding Bootstrap Tables

Tables don't have to be the most frustrating element of your web design. Bootstrap classes can help style your tables with a wide array of formats in no time at all.

Scott Madara

Web Design Bootstrap

How to Validate Forms with Bootstrap

Validating forms found on your website is one of the most critical elements of gathering information from your site's visitors. Here's an easy way to validate forms using Bootstrap.

Scott Madara

Web Design Bootstrap

How to Use Bootstrap Accordions to Organize FAQ Pages

FAQs are some of the most helpful pages on a website. Here's how to consolidate and style them in a way that makes sense to users without overwhelming them with copy.

Scott Madara

Web Design Bootstrap

Using Lazy Load Images within a Bootstrap Grid

Combat slow website speeds with a simple tutorial of lazy loading your images using a Bootstrap Grid.

Scott Madara

Web Design Bootstrap

Craft a Beautiful Web Design for your Portfolio Showcase

In this tutorial Solodev will show you how to create an amazing portfolio to showcase your work in a way that allows for total design freedom and lazy loads your images to increase page speed

Matthieu McClintock

Web Design Bootstrap Search

Adding a Filter to your Search Input using Bootstrap

In this article, we teach you how to add a category filter to your site search to provide more relevant search results to website visitors.

Matthieu McClintock