After a successful Google Summer of Code, Sumit (@codezee) on irc with help from Nicolas Raoul of the Wikivoyage editing community and myself, I am excited to announce that Wikivoyage is now using the WikidataPageBanner extension [1].

A bit of back story - the Wwikivoyage community built a template so articles could display banners to increase engagement with their content. The implementation had a few problems - for instance, templates do not allow you to ship different styles for smaller devices or use media queries, nor do they allow you to serve different images to different browsers. As a result not only did banners not render well on mobile but they also would result in a large image download for a reader.

New features include a drop down table of contents, responsive images and better mobile support. For the purposes of mobile, we have introduced a focus parameter called `origin` which allows editors to define which part of the banner shows on a smaller screen.

To take an example https://en.m.wikivoyage.org/wiki/Seattle before and after pictures of applying the parameter [2] and getting banners to focus on the space needle: http://imgur.com/iA1N1RC,K3EvpDi

I'm hoping we can write API's and tools to make this easier for editors to use and I'm hoping other wikis might adopt this interesting feature (they are very cool for user pages [3]!! :)).

There's still room for improvement. The banners on mobile can be made even better, I think, and there has been little design input for the mobile site so far. There are also issues with srcset support on older browers, and hard problems to think about. Tasks are open for tracking this work so please dive in [4].

I welcome any new contributors to help polish it even further by working on one of those tasks or contributing new tasks. I'll be at hand to help with code review.

If you have any questions please fire them away and please join me in congratulating Sumit on his first major contribution to our movement and building the first mediawiki extension to launch first on Wikivoyage :-).

Thanks to everyone who has helped advise, review the extension for deployment and provided input/discussions on Wikivoyage travellers pub and phabricator.

~ Jon [1] https://www.mediawiki.org/wiki/Extension:WikidataPageBanner [2] https://en.m.wikivoyage.org/wiki/Special:MobileDiff/2846318 [3] https://en.wikivoyage.org/wiki/User:Jdlrobson [4] https://phabricator.wikimedia.org/tag/wikidata-page-banner/board/