Skip to content

codeandwander/blx

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

68 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

BLX β€” A lightweight collection of Webflow-friendly enhancements

BLX is a set of small, focused JavaScript packages designed to add useful behaviour to Webflow and similar no-code setups. Each package is self-contained, easy to integrate, and built with real-world Webflow constraints in mind.

The repository is structured so you can:

  • load only the packages you use
  • or load everything through a single global loader
  • keep clean versioning through GitHub Releases + jsDelivr CDN
  • scale the library as more packages are added

πŸ“š At the moment, BLX includes:

  • TOC (Table of Contents) package
  • Inline SVG package
  • Modal package
  • Social Share package
  • Copy to Clipboard package
  • Mapbox package

πŸš€ Usage

Loading via jsDelivr CDN

All packages are available via jsDelivr CDN, which automatically minifies them when you use the .min.js extension. You can load them individually or all together.

Load individual packages (recommended):

<!-- Core utilities (required for modal package) -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/core/index.min.js"></script>

<!-- TOC package -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/toc/index.min.js"></script>

<!-- Inline SVG package -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/inline-svg/index.min.js"></script>

<!-- Modal package -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/modal/index.min.js"></script>

<!-- Social Share package -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/social-share/index.min.js"></script>

<!-- Copy to Clipboard package -->
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/copy-to-clipboard/index.min.js"></script>

<!-- Mapbox package (requires Mapbox GL JS) -->
<link href="https://api.mapbox.com/mapbox-gl-js/v3.0.1/mapbox-gl.css" rel="stylesheet">
<script src="https://api.mapbox.com/mapbox-gl-js/v3.0.1/mapbox-gl.js"></script>
<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@latest/packages/mapbox/index.min.js"></script>

Or pin to a specific version:

<script src="https://cdn.jsdelivr.net/gh/codeandwander/blx@v1.0.5/packages/toc/index.min.js"></script>

File Sizes

The source packages are lightweight and automatically minified by jsDelivr on delivery:

  • Core utilities: ~849 bytes
  • TOC package: ~3.5KB
  • Inline SVG package: ~2.5KB
  • Modal package: ~7.4KB
  • Social Share package: ~1.5KB
  • Copy to Clipboard package: ~2.9KB
  • Mapbox package: ~9KB

πŸ“¦ Packages

Each package has its own detailed documentation. Click the links below to learn more:

  • TOC (Table of Contents) - Automatically generate navigable table of contents from headings
  • Inline SVG - Replace img tags with inline SVG for CSS styling
  • Modal - Accessible modal overlays with focus trapping and scroll locking
  • Social Share - Share links for LinkedIn, Twitter, Facebook, and Email
  • Copy to Clipboard - Copy URLs to clipboard with tooltip feedback
  • Mapbox - Interactive maps and globes with custom markers and Webflow collection integration

πŸ’‘ Roadmap More packages will be introduced soon. The structure is designed so each feature comes as a clean, independent module with:

  • its own folder
  • its own initialiser
  • auto-detection through the global loader

About

JavaScript utilities for BLX (BLOCKS)

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 3

  •  
  •  
  •