citation-widget

Widget to generate and display a citation based on a DOI in any web page, using the Crosscite Citation Formatter (unsupported).

https://github.com/datacite/citation-widget

Science Score: 31.0%

This score indicates how likely this project is to be science-related based on various indicators:

  • CITATION.cff file
    Found CITATION.cff file
  • codemeta.json file
    Found codemeta.json file
  • .zenodo.json file
  • DOI references
  • Academic publication links
  • Academic email domains
  • Institutional organization owner
  • JOSS paper metadata
  • Scientific vocabulary similarity
    Low similarity (13.0%) to scientific vocabulary
Last synced: 6 months ago · JSON representation ·

Repository

Widget to generate and display a citation based on a DOI in any web page, using the Crosscite Citation Formatter (unsupported).

Basic Info
  • Host: GitHub
  • Owner: datacite
  • License: mit
  • Language: JavaScript
  • Default Branch: main
  • Homepage:
  • Size: 12.7 KB
Statistics
  • Stars: 2
  • Watchers: 6
  • Forks: 0
  • Open Issues: 0
  • Releases: 0
Created over 4 years ago · Last pushed about 1 year ago
Metadata Files
Readme License Citation

README.md

citation-widget

Widget to generate and display a citation based on a DOI in any web page, using the Crosscite Citation Formatter. Optionally adds schema.org JSON-LD metadata to the head element of the same page using Content negotiation.

NOTE: The code is for example purposes and is not among DataCite's officially supported tools and services. This code is available "as is", without guarantee that it will be maintained in the future.

Widget setup

Pre-requisites

  • You have a live website, and have access to add/edit HTML code including <script> tags on the page that you would like to embed the widget into
  • You are able host the citation-widget.js on your server, or copy the source code into your page.

Note: you cannot link to the .js file on github, as github will prevent it being loaded.

Basic setup

Copy and paste the code below into a page on your website that you'd like the widget to appear on. Edit the code to include your ORCID API client ID and the URL of the page that you've pasted the code into.

<script src="http://[YOUR SERVER LOCATION FOR THE SCRIPT]/citation-widget.js"></script>
<div id="citation" data-doi='[THE DOI THAT YOU WOULD LIKE TO GENERATE A CITATION FOR]' data-generate-schema='true'></div>

If you cannot host the .js file, then you can copy and paste the contents of citation-widget.js in between the script tags.

Configuration options

The following configuration options are available and can be added to the div tag as data- tag attributes.

| Tag attribute | Allowed values | Default | Description | | ------------- | -------------- | ------- | --------------------------------------| | data-doi | | | Required Full DOI URL or prefix/suffix only | | data-generate-schema | true, false | | Set to true if you would like to insert schema.org metadata into the head of your web page. This should be used in DOI landing pages only. For more information, see https://support.datacite.org/docs/how-do-i-expose-my-datasets-to-google-dataset-search |

Example

An example is in citation-widget.html. To view it, clone this repository locally and open citation-widget.html in a browser.

Owner

  • Name: DataCite
  • Login: datacite
  • Kind: organization
  • Email: info@datacite.org

Connecting research, identifying knowledge

Citation (citation-widget.html)

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>DOI Citation Widge</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!-- Fonts -->
  <link href="https://fonts.googleapis.com/css?family=Noto+Sans:400,700" rel="stylesheet">
  <!-- Styles -->
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
    integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>

<body>
  <div class="container">
    <div class="main">
      <h1>DOI Citation Widget Demo</h1>
      <p>Embed a citation for any DOI in a web page</p>
      <!--Citation widget-->
      <!--REPLACE location with wherever you put the .js file or copy and paste the javascript between the script tags-->
      <!--You cannot link to the github hosted file as github will prevent it loading!-->
      <script src="citation-widget.js"></script>
      <div id="citation" data-doi="10.5438/7z70-1155" data-generate-schema='true'></div>
    </div>
  </div>
</body>

GitHub Events

Total
  • Push event: 1
  • Pull request review event: 2
  • Pull request event: 2
  • Create event: 1
Last Year
  • Push event: 1
  • Pull request review event: 2
  • Pull request event: 2
  • Create event: 1

Issues and Pull Requests

Last synced: 7 months ago

All Time
  • Total issues: 0
  • Total pull requests: 1
  • Average time to close issues: N/A
  • Average time to close pull requests: 12 minutes
  • Total issue authors: 0
  • Total pull request authors: 1
  • Average comments per issue: 0
  • Average comments per pull request: 0.0
  • Merged pull requests: 1
  • Bot issues: 0
  • Bot pull requests: 0
Past Year
  • Issues: 0
  • Pull requests: 1
  • Average time to close issues: N/A
  • Average time to close pull requests: 12 minutes
  • Issue authors: 0
  • Pull request authors: 1
  • Average comments per issue: 0
  • Average comments per pull request: 0.0
  • Merged pull requests: 1
  • Bot issues: 0
  • Bot pull requests: 0
Top Authors
Issue Authors
Pull Request Authors
  • richardhallett (1)
Top Labels
Issue Labels
Pull Request Labels