BootstrapComponents/Modal

→ Back to Bootstrap Components overview

Description

The Modal component is a dialog box/popup window that is displayed on top of the current page.

For available options to this component, please see the documentation on github.

Examples

With a button trigger

<bootstrap_modal color="info" text="Modal trigger!" heading="This is the modal headline" footer="And some footer text">Lorem ipsum dolor sit amet, ..</bootstrap_modal>

Modal trigger!

With an image trigger

<bootstrap_modal text="[[File:Blue marker.png]]" heading="Better watch this!">[[File:KarateKat.jpg]]</bootstrap_modal>

CSS adaptions

There may be issues with "modal" on some skins. In this case just add the following CSS to your "MediaWiki:Common.css" page.

/** BootstrapComponents
 * hide modal-backdrop
 */
.modal-backdrop {
	display: none;
}

/*
 * get clear of the header elements
 */
.modal {
	top: 60px;
}