Extension:Bootstrap
Bootstrap Release status: stable |
|
---|---|
Implementation | Skin |
Description | Provides the Bootstrap 4 web front-end framework |
Author(s) | Stephan Gambke (F.trotttalk) |
Maintainer(s) | Professional Wiki |
Latest version | 5.0.0 (2024-04-26) |
Compatibility policy | For every MediaWiki release that is a Long Term Support release there is a corresponding branch in the extension. |
MediaWiki | 1.39+ |
PHP | 8.0+ |
Database changes | No |
Composer | mediawiki/bootstrap |
License | GNU General Public License 3.0 or later |
Download | GitHub: Note: README on GitHub Changelog on GitHub |
The Bootstrap extension provides the Bootstrap 4 (documentation) web front-end framework to MediaWiki. It can be activated directly or used from skins or extensions.
Installation
editSee the installation instructions for information on how to install this extension.
Usage
editWithin a skin
editUse \Bootstrap\BootstrapManager::getInstance()
to get the singleton managing the Bootstrap framework.
With the returned object:
- add Bootstrap modules using
addBootstrapModule()
,addCoreBootstrapModules()
, andaddAllBootstrapModules()
- set SCSS variables using
setScssVariable()
andsetScssVariables()
- add style files using
addStyleFile()
- add cache trigger files using
addCacheTriggerFile()
Finally, to add the Bootstrap styles and javascript to the page, use $out->addModuleStyles( 'ext.bootstrap.styles' )
for styles and $out->addModules( 'ext.bootstrap.scripts' )
for scripts.
For an example of how to include Bootstrap styles in a skin, have a look at the Chameleon skin.
Standalone
editTo enable Bootstrap styles on all pages, add the following code to your "LocalSettings.php" file:
$wgHooks['SetupAfterCache'][] = function(){
\Bootstrap\BootstrapManager::getInstance()->addAllBootstrapModules();
return true;
};
$wgHooks['ParserAfterParse'][]=function( Parser &$parser, &$text, StripState &$stripState ){
$parser->getOutput()->addModuleStyles( ['ext.bootstrap.styles'] );
$parser->getOutput()->addModules( ['ext.bootstrap.scripts'] );
return true;
};
Known issues
editEffect on Universal Language Selector
editIf you have the Universal Language Selector (ULS) extension installed, installing the Bootstrap extension will make the ULS's dropdown-menu look disordered and break its search bar (screenshot on GitHub). However, this can be fixed by adding the following code to MediaWiki:Common.css:
.uls-language-list {
display: block;
}
.uls-search {
display: block;
}
See also
edit- Websites
- the Bootstrap framework homepage
- the SASS/SCSS homepage
- the Bootstrap for MediaWiki wiki — Examples and Demos
- Skins and Extensions
- the Chameleon skin that uses this extension
- the Medik skin that also uses Bootstrap
- the BootstrapComponents extension that uses this extension and lets editors utilize its potential inside wiki markup
- Blog post
- Enhance Your MediaWiki with Bootstrap — Blog post about improving your wiki by integrating it with Bootstrap and its components; published January 20, 2024
This extension is included in the following wiki farms/hosts and/or packages: This is not an authoritative list. Some wiki farms/hosts and/or packages may contain this extension even if they are not listed here. Always check with your wiki farms/hosts or bundle to confirm. |