Jump to content

Extension:Bootstrap

From mediawiki.org

PW
The Professional Wiki team maintains this extension professionally.
Professional Wiki provides official support for MediaWiki LTS releases only. It may work with other MediaWiki releases.
MediaWiki extensions manual
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
README on GitHub
Changelog on GitHub
Quarterly downloads 0

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[edit]

See the installation instructions for information on how to install this extension.

Usage[edit]

Within a skin[edit]

Use \Bootstrap\BootstrapManager::getInstance() to get the singleton managing the Bootstrap framework.

With the returned object:

  • add Bootstrap modules using addBootstrapModule(), addCoreBootstrapModules(), and addAllBootstrapModules()
  • set SCSS variables using setScssVariable() and setScssVariables()
  • 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 on how to include Bootstrap styles in a skin have a look at the Chameleon skin.

Standalone[edit]

To simply 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[edit]

Effect on Universal Language Selector[edit]

If 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
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