Citation Formatting API
The Citation Formatting API accepts a CSL-JSON body with a specified citation style and locale and returns a formatted citation.
post
https://api.cloudcite.net
/cite
Cite
How It Works
Cite requires the following to be sent in the body of the POST request:
If you send null or "" fields such as author last name, sorting will not be done properly. Make sure to remove null or "" properties.
Cite Request Fields - MLA, en-US
Cite Request Example - MLA, en-US
1
{
2
style: "modern-language-association",
3
locale: "locales-en-US",
4
csl: <csl>
5
}
Copied!
1
{
2
"style": "modern-language-association",
3
"locale": "locales-en-US",
4
"csl": {
5
"SET-YOUR-OWN-ID": {
6
"issued": {
7
"year": "1953"
8
},
9
"id": "SET-YOUR-OWN-ID",
10
"author": [{
11
"given": "Tennessee",
12
"family": "Williams"
13
}],
14
"title": "A Streetcar Named Desire",
15
"publisher": "Dramatists Play Service Inc",
16
"ISBN": "9780822210894",
17
"number-of-pages": 107,
18
"dimensions": "20.00 cm x 12.70 cm x 0.60 cm",
19
"abstract": "THE STORY: The play reveals to the very depths the character of Blanche du Bois, a woman whose life has been undermined by her romantic illusions, which lead her to reject--so far as possible--the realities of life with which she is faced and which s",
20
"type": "book"
21
},
22
"SET":{
23
"issued": {
24
"month": "04",
25
"year": "2018",
26
"day": "25"
27
},
28
"id": "SET",
29
"director": [{
30
"given": "Joe",
31
"family": "Russo"
32
}, {
33
"given": "Anthony",
34
"family": "Russo"
35
}],
36
"title": "Avengers: Infinity War",
37
"publisher": "Walt Disney Pictures",
38
"publisher-place": "United States of America",
39
"source": null,
40
"abstract": "As the Avengers and their allies have continued to protect the world from threats too large for any one hero to handle, a new danger has emerged from the cosmic shadows: Thanos. A despot of intergalactic infamy, his goal is to collect all six Infinity Stones, artifacts of unimaginable power, and use them to inflict his twisted will on all of reality. Everything the Avengers have fought for has led up to this moment - the fate of Earth and existence itself has never been more uncertain.",
41
"type": "motion_picture"
42
}
43
}
44
}
Copied!
Cite will send the following back
Cite Response - MLA, en-US
1
[{
2
"maxoffset": 0,
3
"entryspacing": 0,
4
"linespacing": 2,
5
"second-field-align": false,
6
"entry_ids": [
7
["SET"],
8
["SET-YOUR-OWN-ID"]
9
],
10
"bibliography_errors": [],
11
"done": false,
12
"hangingindent": 2,
13
"bibstart": "<div class=\"csl-bib-body\">\n",
14
"bibend": "</div>"
15
},
16
[
17
" <div class=\"csl-entry\"><i>Avengers: Infinity War</i>. Walt Disney Pictures, 2018.</div>\n",
18
" <div class=\"csl-entry\">Williams, Tennessee. <i>A Streetcar Named Desire</i>. Dramatists Play Service Inc, 1953.</div>\n"
19
]
20
]
Copied!
How do I interpret the response?
maxoffset(integer): The width of the widest first field in the bibliography, measured in characters.linespacing(integer): Vertical line distance specified as a multiple of standard line height. You can force a minimum if there is none assigned such as 1.35.entryspacing(integer): Vertical distance between bibliographic entries, specified as a multiple of standard line height.second-field-align(boolean or integer): The position of second-field alignment.hangingindent(boolean or integer): Whether the bibliography items should be rendered with hanging-indents and the size of the indent.rightpadding(constant): .5- Each entry is assigned a CSS class. You apply properties based on the class assigned by CSL.
Example HTML
1
<div class="csl-bib-body">
2
<div class="csl-entry">
3
<div class="csl-left-margin">[1]</div>
4
<div class="csl-right-inline">M. Krämer, “citeproc-java: A Citation Style
5
Language (CSL) processor for Java,” 20-Nov-2016. [Online]. Available:
6
http://michel-kraemer.github.io/citeproc-java/. [Accessed: 29-Jul-2018].
7
</div>
8
</div>
9
<div class="csl-entry">
10
Williams, Tennessee. <i>A Streetcar Named Desire</i>. Dramatists Play Service Inc, 1953.
11
</div>
12
</div>
Copied!
Example CSS
For an example of how to add CSS to these classes, go to the Zotero repository. Here's a basic overview:
Here's what your CSS should look like for an the csl-bib-body class:
csl-bib-body class:1
'line-height: ' + linespacing + '; '
Copied!
If the container has no child with the csl-left margin class and a hanging indent, add the following CSS. Note CSS properties when second-field-align=false or no value and hangingindent=true or value combination is not currently supported by this logic.
1
'margin-left: ' + hangingindent + 'em; text-indent:-' + hangingindent + 'em;'
Copied!
Here's what your CSS should look like for an the csl-entry class:
csl-entry class:1
'clear: left; margin-bottom:' + entryspacing + 'em;'
Copied!
If you want to prevent text overflow such as with links, consider adding:
1
'word-break: break-all;'
Copied!
Here's what your CSS should look like for an the csl-indent class.
csl-indent class.1
'margin: .5em 0 0 2em; padding: 0 0 .2em .5em; border-left: 5px solid #ccc;'
Copied!
Here's what your CSS should look like for an the csl-right-inline class:
csl-right-inline class:1
'margin: 0 .4em 0 ' + (secondFieldAlign ? maxOffset + rightPadding : '0') + 'em;'
Copied!
If there's a hanging indent, add:
1
'padding-left: ' + hangingindent + 'em; text-indent:-' + hangingindent + 'em;'
Copied!
Here's what your CSS should look like for an the csl-left-margin class:
csl-left-margin class:1
'float: left; padding-right: ' + rightpadding + 'em;'
Copied!
If there's a second-field-align value or it is true, add this:
1
'text-align: right; width: ' + maxoffset + 'em;'
Copied!
Last modified 3yr ago