Skin:BootStrapSkin

From MediaWiki.org
Jump to: navigation, search
MediaWiki skins manual - category
Crystal Clear device blockdevice.png
BootStrapSkin

Release status: unmaintained

BootStrapSkin.jpg
Author(s) Lee Miller and Dennis Groenewegen (SwiftSystalk)
Latest version

1.0.44a (2016-06-29)

MediaWiki 1.27
PHP 5.4+
License GPL-2.0+
Download No download link provided

Translate the BootStrapSkin skin if it is available at translatewiki.net

Check usage and version matrix;

The BootStrapSkin is a commercially available modified Vector skin utilising Bootstrap (v3.1.1). It includes a custom Bootstrap style (33k lines of code) along with several jQuery and JavaScript utilities to create a dynamic, clean skin that allows for the addition of eye-catching typography.

The present page is only intended as a quick summary. Please visit http://www.mediawikibootstrapskin.co.uk for fuller details and demonstrations.

In addition to the main website, there is a separate demo site allowing you to create an account and have a play before deciding whether BootStrapSkin is for you. Extra features available to registered users include the opportunity to see how the administration links are displayed, to opt in/out for Bootstrap 'nav-tab' dropdowns which display at the top of the page, and to have a user page and talk page.

Features[edit]

  • Includes twelve colour stylesheets; Black, blue (the default colour), brick, brown, gray, green, leaf, pink, purple, red and turquoise, in addition to a rtl version. Just open boostrapskin.php and change bootstrap/bootstrap/css/bootstrap-blue.css to the appropriate color style, found in bootstrap/bootstrap/css.
  • Colour classes. The skin offers 23 colour classes (including 4 default Bootstrap colours, namely "info", "success", "warning" and "danger"), 5 shaded colours (dependant on the skin colour i.e. 5 shades of blue, brick, brown etc) and a further 14 custom colours, all of which can be applied to any of the typography items.
  • 'Typographical' features in the broad sense of the term. There are currently 27 such features that can be included into MediaWiki articles using nothing more than div, span and ul tags. No raw html input is required. All of the typography can be added using only tags allowed by MediaWiki. More features will be included over time. Some of the more popular ones are:
    • Carousel (preferred setting "$wgAllowExternalImages = true;" in LocalSettings.php)
    • FontAwesome, Glyphicons and Fam Fam icons
    • Buttons
    • Social buttons
    • BootStrap Prettify
    • Horizontal and vertical info boxes
    • In-content dropdown navigation
    • NavTabs
    • Dismissable/Sortable/Removable Portlets - Can be set to 'opened' or 'closed' on page load
    • Pagination
    • Tooltips - Position can be set to top, bottom, left and right
    • Popovers - As above
    • Modals - Use any of the features in the Modal
Visit the website for a complete list of features as well as guides on adding them to your site.

Screenshots[edit]

Mobile Features[edit]

As of version 1.0.43 BootStrapSkin is mobile friendly. Prior to release it was tested by a handful of users and the core team on the iPhone 4/5, HTC 1/8, Nokia Lumia, Samsung Galaxy, Google Nexus, iPad mini, Kindle Fire, Acer A500 and Blackberry Playbook.

The BootStrapSkinSidebar Extension and Mediawiki admin/user links are hidden when viewed on small devices and the font is reduced dependant on the screen sizes, 13px for small devices and 12px for extra small devices.

Compatibility[edit]

MediaWiki version[edit]

  • Does not work with Mediawiki versions <1.22.5
  • Tested and working on versions 1.22.5 through 1.23.5

Potential conflicts[edit]

Because BootStrapSkin is heavily reliant on JavaScript, its use should be tested and checked on installations that use other third-party extensions using JavaScript, particularly the jQuery-ui family. On MW 1.23, Extension:Semantic Forms v2.7 is found to conflict with the skin when a form includes multiple-instance templates. This may have been fixed in v2.7beta +.

Installation[edit]

For general documentation on the use of skins, see Help:Skins.
  • Download and extract the file(s) in a directory called "bootstrap" in your skins/ folder. Note that a base file in the root folder is no longer required in MediaWiki.
  • Add the following code at the bottom of your "LocalSettings.php"
require_once( "$IP/skins/bootstrap/bootstrapskin.php" );
$wgDefaultSkin = "bootstrapskin";

Configuration[edit]

Optional configuration settings in Localsettings.php which will help with some of the features:

$wgRestrictDisplayTitle = false; // Use Bootstrap to style the article titles?
$wgAllowExternalImages = true; // Carousel seems to render more effectively using a full URL!
Remove the comments starting with // when setting your configuration.

See also the "Post Install Configuration" (half way down the page).

Add-ons / extras[edit]

  • As of version 1.0.43 the download includes 11 colours: black, blue (which is default) as well as brick, brown, gray, green, leaf, pink, purple, red and turquoise.
  • Other add-ons for BootStrapSkin include:
    • BSS e-Commerce - Read more here
    • Fam Fam Icons, BootStrap Social Buttons and BootStrap Prettify require a small edit to install.
    • BootStapSkinSidebar (Google Nexus menu) (see demo for an example)
    • Custom footer with Social sharing functionality

Issues Solves[edit]

MediaWiki search (autocomplete now working as it should)

Support[edit]

  • Please visit the forums for support questions and queries, or for a private response submit a support in the client area. The developer of this skin only views the present page when the product is updated.
  • Alternatively, click here to report any bugs or problems.

Version history[edit]

Older versions remain active and downloadable, though please refer to separate installation instructions.

  • 0.0.38 - Released 17th June 2014 -
  • 0.0.39 - Released 23rd June 2014 - Changed naming convention
  • 0.0.40 - Released 24th June 2014 - Removed conflicting JavaScripts (lightbox,magnific-popup and holder)
  • 0.0.41 - Released 3rd July 2014 - Corrected an error which meant radio's and check boxes were not displaying.
  • 1.0.42 - Released 25th July 2014 - Removed lightbox bug, moved personal links, added several new features and footer icons.
  • 1.0.43 - Released 22nd August 2014 - Substantial mobile viewing improvements, solved search (autocomplete issue), custom footer and new extension.
  • 1.0.44 - Released 10th July 2016 - Used explicitly for pro versions of the skin.
  • 1.0.46 - Released 12th March 2015 - New Hadron Skin - proposed release date August 2015.
  • 1.0.47 - Released 5th November 2015 - Nexus 4 System - Duel Mediawiki skin and Wordpress theme.

Bootstrapskin Custom Extensions[edit]

As of 7th October 2014 we introduced a range of extensions that give extra visual functionality to Bootstrapskin. These include a gallery, news ticker, slideshow and social sharing extensions. Visit our extensions site for more information.

Official project skins built from BootStrapSkin[edit]

In February 2015 we released the following skins, include slightly different styling features and more modern menus.

These skins can be downloaded here.

1.0.45[edit]

The Bootstrapskin Anniversary skin (1.0.45) is now available for download, though at present it is in the Beta stage of developement. While I do not foresee any issues I generally err on the side of caution and subject my skins to rigerous testing prior to releasing a stable version.

Due to popular demand the old version of of Bootstrapskin (1.0.43) will remain available so long as it remains popular, mainly due to its abundance of styling options, the plan was to archive it once 1.0.45 became stable, but I was persuaded otherwise.

The Anniversary skin addresses Bootstrapskin's loading speed, I have removed the customised stylesheets and replaced with the default Bootstrap version, which has resulted in cutting the load speed in half. I have also removed jQuery-ui.js to help the skin play well with other popular extensions (i.e. Semantic Mediawiki and Semantic Forms).

Anniversary has also been updated to the very latest versions of Bootstrap (3.3.2) and Font Awesome (4.3.0).

A more detailed overview of the updates, installation instructions and how to apply the new styling features to wiki pages can be viewed at the demo.

View the demo here and download from here

Nexus 4[edit]

A WordPress / Mediawiki System that manages all of your online business applications.

Incorporating Bootstrap 4 and the latest version of Font Awesome, Nexus 4 utilises Sass, a popular CSS processor that precompiles CSS, along with a range of applications from a single code base, that displays perfectly on all devices.

View the demo here

Foundation[edit]

Our latest wiki skin uses the Foundation (6) front-end frame work, more info here. Launched 22nd Faebruary 2016.

See also[edit]

Other skins and extensions based on Bootstrap: