Wikidata-powered citation lists with citation.js

I don't get enough time with the kids as I would like, but if your son ^[1] is doing interesting coding projects it makes that a lot easier. One project he is working on is citation.js ^[2], a JavaScript library to edit bibliographies. It has become really powerful and totally awesome! We all hate formatting bibliographies and that every journal has its own format. LaTeX and Citation Style Language< a href="#readabilityFootnoteLink-3" class="readability-DoNotFootnote" style="color: inherit;">^[3] have done wonders here, but all should even be simpler. As an author I want to be able to just give a DOI ^[4] and that should be enough.

Or a Wikidata ^[5] entity identifier ^[6].

And citation.js makes that last thing possible, and I spent some time with Lars to implement this for my homepage:

This is more or less what I had before too, but then everything hard coded. The citation.js way allow me to give just a list of two entity IDs (Q27062312 ^[7] and Q27062639 ^[8]) and citation.js outputs the above. I just have this snippet ^[9] in the HTML:

<ul class="cite" id="cite1" />
<script class="code" type="text/javascript">
var wikidata = new Cite()
wikidata.set( [ "Q27062312", "Q27062639" ] )
htmlOutput = wikidata.get( opt )
$('#cite1').html(
htmlOutput.replace( /&(lt|#60);/g, '<' )
.replace( /&(gt|#62);/g, '>' )
)
</script>

The formatting is actually mostly done with a CSL template (though it needs a hack to get it to output HTML), though adapted to also output the DOI hyperlink an d Altmetric ^[10] icon (you can find the customized CSL in the HTML source code as CC-BY-SA 3.0 ^[11]). The citation.js library fetches the data from Wikidata and actually has to deal with the structure there, which includes a mixture of 'author' and 'author name string' fields for author information. Well done!

If you like this, make sure to check out Wikicite ^[12], OpenCitations ^[13], and Scholia ^[14], projects that enabled and triggered some of the ideas behind the above citation.js use!