We stand with Ukraine  

Add your bibliography on your website!

You don't want to edit your webpage each time you publish a new paper? You prefer focusing on your research than on maintaining the bibliography of your home page?
If yes, you're at the right place!
  • Your website isn't using jQuery and you don't want to use it, so just include these few lines: 
            <!-- This div is a placeholder which will contain the publications -->
<div id="pubszone">
  Loading publications...
</div>
<!-- Function which will handle the content received through JSONP -->
<script type='text/javascript'>
//<![CDATA[
    function mycallback(ad_content) {
    	document.getElementById('pubszone').innerHTML = ad_content.html;
    }
//]]>
</script>
<!-- Load of the remote JS which will call the callback function -->
<script src="https://www.csauthors.net/sten-karlsson/embed/bib.js?callback=mycallback"></script>
    Check how it looks here !
  • Your website is using jQuery and you want to benefit of it, so just include these few lines: 
            <!-- This div is a placeholder which will contain the publications -->
<div id="pubszone">
  Loading publications...
</div>
<!-- We do a JSONP call using jQuery -->
<script type='text/javascript'>
//<![CDATA[
    var csauthorsAPI = "https://www.csauthors.net/sten-karlsson/embed/bib.js";
    $.ajax({
    	url: csauthorsAPI,	 	
    	dataType: "jsonp",
    	success: function(bib) {
     		$("#pubszone").html(bib.html)
     	}
    });
//]]>
</script>
    Check how it looks here !
  • To have a nice layout, you'll need to play a bit with the CSS, here is a suggestion: 
            div.bibyear {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 150%;
    font-weight: bold;
}

div.bibdoi {
    display: inline;
}

div.bibtitle {
    font-weight: bold;
}

div.bibauthor {
    display: inline-block;
}

div.bibauthors {
    font-style: italic;
}

div.bibauthors a:link, div.bibauthors a:visited {
    color: #000000;
    text-decoration: none;
    font-weight: normal;
}

div.bibauthors a:hover {
    color: #000000;
    text-decoration: underline;
}

  Loading...