Page MenuHomePhabricator

Wrap-up report for "Wikidata Pagebanner extension"
Closed, ResolvedPublic


WikidataPageBanner wrap-up report

About the project is a wiki about travel and holds rich details related to visiting places. This wiki has a special "culture" of showing page wide "banners" at the head of each of their articles to enhance the aesthetic appeal of their articles.
An example of such a banner can be seen here -
These banners are traditionally shown using a template on the wiki.
The banners shown through templates however had a few shortcomings such as:

  • Not delivering an optimum size banner for each device.
  • Not rendering properly on mobile devices.
  • Too small banners on small mobile screens.
  • Not being able to show more than one level Table Of Contents inside the banners.

The project is all about addressing these issues and adding capabilities through a Mediawiki extension to take the banner experience to the next level.
The following is an example of showing the banner on mobile using the extension. Note how the banner maintains a decent height inspite of originally being of aspect ratio 7:1

mobile1.png (405×366 px, 90 KB)

The extension also adds a new feature to focus the banner to specific spots if it is too large. Notice the focus in the three images
mobile3.png (407×368 px, 69 KB)

mobile1.png (405×366 px, 90 KB)

mobile2.png (408×369 px, 94 KB)

The above feature makes use of the origin parameter. More info can be found at


The extension has the capability to fetch images from the wiki or from wikidata if a link to wikidata for the article is defined.
The extension adds a magic word PAGEBANNER which can be used to invoke the banners on any page.
For example using {{PAGEBANNER: Vatican banner Rafael's "School of Athens".jpg}} would show a banner with the given image name. The extension will try to fetch the image from the wiki or from wikidata if an associated property exists.
The following page shows the example of using {{PAGEBANNER:Agra banner Taj Mahal.jpg|icon-unesco=Unesco}}

banner2.png (654×1 px, 459 KB)

For accessing the wikidata banner, the extension uses a configuration variable $wgWPBBannerProperty to look for the banner image on wikidata.
Eg. the page fetches a banner from a wikidata linked property defined here
banner1.png (713×1 px, 553 KB)

The extension also has the feature to add a Wikidata banner or a default defined banner if $wgWPBEnableDefaultBanner is set to true
The important parameter to {{PAGEBANNER:}} is the image name specified right after the keyword. Other optional arguments include:

  • pgname - Adds a custom title to the banner.
  • To add custom icons, add the parameter icon-icon_name=<Article about icon> to {{PAGEBANNER}}. Then define a background-image on .oo-ui-icon-icon_name, in Mediawiki:Common.css to use as the icon. Do this for any no. of icons to add to the page.
  • caption - Use '''caption=description''' to add a caption to the banner image.
  • tooltip - Use '''tooltip=image-caption''' to show image description on hovering over image.
  • toc - Use '''toc=yes''' to enable a Table Of Contents within banner.
  • bottomtoc - Use '''bottomtoc=yes''' to push Table Of Contents below banner.
  • origin - Use '''origin=<x>,<y>''' where '''x''' and '''y''' in angular brackets represent the x and y positions of the focus of the banner. This feature is particularly useful if any dimensions of the banner exceed that of the viewport, especially on the screen.

Missing Features/Known Bugs

The following are some bugs that are left to be addressed and would improve the extension:

Demo server link

The extension can be tested at -


Suggestions for contributions in future

The extension's code is heavily documented at each step and coupling it with the documentation at would make it fairly easy in future to contribute to it.
Giving a read to would help make the objectives of the extension clearer.