wikidata-elements
⚠️⚠️⚠️This is still pretty much work in progress, API/naming will likely be chaning very quickly
Installation
Install via npm
$ npm install wikidata-elements
or just include the umd build using the CDN url
Usage
Import the package if you installed it from npm:
<wd-entity>
- Render entity's label
=> Douglas Adams
- Render entity's description
=> British author and humorist
- Render entity's property
=> nm0010930
<a is="wd-link">
wd-entity
only render text content, what if you want render things a link of P856
or one's twitter url? Don't worry, we got you covered 😀.
So We extend the built-in a
tag to support this custom beahviour. All the attributes for a
would still work, you can continue use target="_blank"
to control in the link to be open in a new tab.
- Render property url (like
P856
), by passing a P value toproperty
attribute
Tim Berners-Lee's website
⬇️
Tim Berners-Lee's website
- Render external id as link(like twitter username
P2002
), using the samepropery
attribute.
Tim on twitter
⬇️
Tim on twitter
- Render wikimedia site link, by passing the sitename to the
site
attribute
ティム
⬇️
ティム
You can also pass a comma separated list of sitename, this we will render the first one it's available in the same order.
Tim's quote
⬇️
Tim's quote
1st Example: Make your own wikipedia infobox
Simple markup for access the data you need from Wikidata
Profession Place of Birth Height m Website
Style it whatever you want it, using the tool you have
< </
Then you would have this not so bad infobox in the page, try this in JSBin if you wanna play with it.
Tests
We're using pollyjs to record and replay all the http requests to wikidata in the test suits, this make the test cases more reliable.
To run our tests locally, first start the pollyjs process to record network request
npm run listen-request
and then just run the normal
npm run test
See also
- qLabel is a jQuery plugin to translate labels in a Website based on translations from Wikidata
Contributing
Bug reports and pull requests are welcome on GitHub.