Page MenuHomePhabricator

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

Description

WikidataPageBanner wrap-up report

About the project

https://en.wikivoyage.org 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 - https://en.wikivoyage.org/wiki/Agra
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


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



The above feature makes use of the origin parameter. More info can be found at https://www.mediawiki.org/wiki/Extension:WikidataPageBanner

Usage

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


For accessing the wikidata banner, the extension uses a configuration variable $wgWPBBannerProperty to look for the banner image on wikidata.
Eg. the page http://pagebanner.wmflabs.org/wiki/NorthAmerica fetches a banner from a wikidata linked property defined here http://pagebanner.wmflabs.org/wiki/Item:Q8

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 - https://pagebanner.wmflabs.org

Resources

Suggestions for contributions in future

The extension's code is heavily documented at each step and coupling it with the documentation at https://www.mediawiki.org/wiki/Extension:WikidataPageBanner would make it fairly easy in future to contribute to it.
Giving a read to https://en.wikivoyage.org/wiki/Wikivoyage:Banner_Expedition would help make the objectives of the extension clearer.

Event Timeline

Niharika created this task.Aug 17 2015, 1:36 PM
Niharika assigned this task to Sumit.
Niharika raised the priority of this task from to Medium.
Niharika updated the task description. (Show Details)
Niharika added subscribers: Aklapper, Niharika, Sitic and 3 others.
Sumit updated the task description. (Show Details)Aug 18 2015, 7:53 PM
Sumit set Security to None.
Sumit updated the task description. (Show Details)Aug 18 2015, 8:08 PM
Sumit updated the task description. (Show Details)Aug 20 2015, 6:01 PM
Niharika closed this task as Resolved.Aug 31 2015, 2:14 PM

Perfect!