PHPackages                             dnafactory/module-bootstrap - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. dnafactory/module-bootstrap

ActiveMagento2-module

dnafactory/module-bootstrap
===========================

Magento 2 Bootstrap source integration

0.1.16(3y ago)62.0k—0%1[1 issues](https://github.com/dnafactory/magento2-bootstrap/issues)1BSD-3-ClauseSCSSPHP ^7.1|^8.1

Since Dec 3Pushed 2y ago3 watchersCompare

[ Source](https://github.com/dnafactory/magento2-bootstrap)[ Packagist](https://packagist.org/packages/dnafactory/module-bootstrap)[ RSS](/packages/dnafactory-module-bootstrap/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (8)Dependencies (2)Versions (12)Used By (1)

Bootstrap source integration for Magento 2
------------------------------------------

[](#bootstrap-source-integration-for-magento-2)

[![License](https://camo.githubusercontent.com/d76db1401f48ce3b2726e4b38612edb14e8db366c02a2ddddf4d05f7c8c04fb2/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f4c6963656e73652d425344253230332d2d436c617573652d626c75652e7376673f7374796c653d666f722d7468652d6261646765)](https://opensource.org/licenses/BSD-3-Clause)[![Magento](https://camo.githubusercontent.com/ced6e633ac5017aa0fb6caf2c5d859de2c8af5090c60b40179d7f6e429c28bca/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f426f6f7473747261702d76342e352e332d626c756576696f6c65742e7376673f6c6f676f3d626f6f74737472617026267374796c653d666f722d7468652d6261646765)](https://github.com/twbs/bootstrap)
=======================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================================

[](#)

This Magento 2 module provides a full integration of [Bootstrap 4](https://getbootstrap.com/) 's sources.

**This is not a porting!**

It uses [dnafactory/module-scss](https://github.com/dnafactory/magento2-module-scss) to integrate the official [Bootstrap 4 package](https://github.com/twbs/bootstrap)so it can be built with your Magento 2 theme configuration.

---

### Installation

[](#installation)

The extension must be installed via composer:

```
composer require dnafactory/module-bootstrap
php bin/magento module:enable DNAFactory_Bootstrap
php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy
```

### How to use CSS

[](#how-to-use-css)

By default, the extension will deploy a *DNAFactory\_Bootstrap/css/bootstrap.css* build based on all Magento .less lib values defined in your active theme. So, if you want to change some theme specific style as can be the primary color, you can do it by simply editing *@theme\_\_color\_\_primary* in your **css/sources/\_theme.less** file, as usual.

However, you can change these values or add other custom variables using one or more of the extension points provided:

- **source/scss/themes/\_extends.scss** where you can put your custom scss vars and other useful stuff, which we will cover later in this document.
- **source/scss/\_extends.scss** where you can put Bootstrap-specific customizations in scss
- **source/scss/\_extend.scss** module related extension file, for small customizations.

#### Well, what if I'm working on a custom theme?

[](#well-what-if-im-working-on-a-custom-theme)

Just put your .less theme variables file reference in **source/scss/themes/\_extends.scss**:

```
// @vars_import 'source/my_marvellous_theme/_variables.less';
```

or, when your variables file is stored in a theme-level directory (most common case):

```
//@vars_import (lib) 'relative_path_to_theme_base_css_dir/_variables.less'
```

For example, using

```
//@vars_import (lib) '../../_variables.less'
```

from **view/frontend/web/css/source/scss/themes/\_magento.scss**, it will point to **YourVendor/YourTheme/your\_locale/css/source**.

Refer to [dnafactory/module-scss's doc](https://github.com/dnafactory/magento2-module-scss), for more info about the *@vars\_import* directive.

### How to use JS

[](#how-to-use-js)

Bootstrap js plugins are designed to run on demand and they can be requested using these aliases:

- bs.alert
- bs.button
- bs.carousel
- bs.collapse
- bs.dropdown
- bs.modal
- bs.popover
- bs.scrollspy
- bs.tab
- bs.toast
- bs.tooltip

Simply add the required plugin to your module's dependencies.

### Note for Developers

[](#note-for-developers)

To update one or more dependencies (as Bootstrap or popper.js) to the latest one, just use npm as needed and then run:

```
npm run update-src
```

*Happy Coding*

###  Health Score

31

—

LowBetter than 68% of packages

Maintenance17

Infrequent updates — may be unmaintained

Popularity24

Limited adoption so far

Community13

Small or concentrated contributor base

Maturity59

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~84 days

Recently: every ~103 days

Total

10

Last Release

1227d ago

PHP version history (2 changes)0.1.1PHP ~7.1|~7.2

0.1.15PHP ^7.1|^8.1

### Community

Maintainers

![](https://www.gravatar.com/avatar/ae060630c3f388ec31ba0a230764210b441db7fdca225c670e11e843cbce3ef6?d=identicon)[dnafactory](/maintainers/dnafactory)

![](https://www.gravatar.com/avatar/f2ba17e191fadc64eef7e823f27ac0c807d278683af25fe2f7b59ec8ae1d8c07?d=identicon)[ciroarcadio](/maintainers/ciroarcadio)

---

Top Contributors

[![ciroarcadio](https://avatars.githubusercontent.com/u/5919607?v=4)](https://github.com/ciroarcadio "ciroarcadio (12 commits)")

---

Tags

bootstrapmagento2

### Embed Badge

![Health badge](/badges/dnafactory-module-bootstrap/health.svg)

```
[![Health](https://phpackages.com/badges/dnafactory-module-bootstrap/health.svg)](https://phpackages.com/packages/dnafactory-module-bootstrap)
```

###  Alternatives

[bostondv/bootstrap-ninja-forms

Adds Bootstrap classes to Ninja Forms

222.2k](/packages/bostondv-bootstrap-ninja-forms)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)