Vendored Bootstrap & Icon Assets

By Amr

Bootstrap 5.3.3 CSS/JS and Bootstrap Icons are committed under assets/vendor/ for GitHub Pages safety and offline development. How to use and refresh them.

Estimated reading time: 1 minutes

• Share on Reddit
• Share on LinkedIn
• Share on Twitter

• ---

• Page Improvements

• Improve Page Polish content, structure, and presentation of this page
• Expand Page Add depth, examples, and missing sections to this page
• Update Page Refresh outdated content, versions, links, and screenshots
• Fix Page Issue Report a typo, broken link, layout glitch, or content bug
• SEO Optimize Improve discoverability, metadata, and structured data
• Accessibility Audit Audit this page for WCAG 2.1 AA compliance

• ---

• Site Improvements

• UI/UX Improvement Propose a design or UX refinement for the theme
• New Feature Propose a new site-wide feature or capability
• Component Enhancement Improve a Jekyll layout, include, or shared component
• Performance Optimization Improve load time, Core Web Vitals, and asset delivery

Edit on GitHub

Table of Contents

Vendored Bootstrap & Icon Assets

Bootstrap 5.3.3 CSS/JS and Bootstrap Icons are committed under assets/vendor/ rather than loaded from a CDN. This ensures:

• GitHub Pages safety — Pages’ default Jekyll build does not run npm or curl
• Offline development — works without an internet connection
• Version pinning — no surprise CDN updates breaking the theme

For full details on refreshing vendor files, see the Vendor Assets guide.

Directory Layout

assets/vendor/
├── bootstrap/
│   ├── css/
│   │   └── bootstrap.min.css
│   └── js/
│       └── bootstrap.bundle.min.js
└── bootstrap-icons/
    └── font/
        ├── bootstrap-icons.css
        └── fonts/

Additional vendor libraries (MathJax, Mermaid, Font Awesome, …) are also stored here and listed in vendor-manifest.json.

How Assets Are Loaded

CSS (via _includes/core/head.html)

<link href="{{ '/assets/vendor/bootstrap/css/bootstrap.min.css' | relative_url }}" rel="stylesheet">
<link rel="stylesheet" href="{{ '/assets/vendor/bootstrap-icons/font/bootstrap-icons.css' | relative_url }}">
<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">

JavaScript (via _includes/components/js-cdn.html)

<script src="{{ '/assets/vendor/bootstrap/js/bootstrap.bundle.min.js' | relative_url }}"></script>

Refreshing Vendor Files

# Full vendor refresh (requires Node and curl)
npm install
./scripts/vendor-install.sh

# npm shortcut (manifest-only)
npm run vendor:install

vendor-manifest.json in the repo root lists every curl-downloaded asset with its expected SHA-256 checksum.

Custom CSS Override

Place site-specific CSS overrides in assets/css/user-overrides.css (linked from _includes/core/head.html). Do not load a second full Bootstrap stylesheet.

Related

• Vendor Assets (Maintainer Guide)
• Bootstrap Integration
• Dependency Updates

See also

• [[Bootstrap Integration]]
• [[Development]]