Bookmarks

I keep bookmarks on ma.gnolia.com, so that’s what I cover here. del.icio.us, the API for which predates ma.gnolia’s, uses JSON in a similar way (as does Twitter).

Embedding via JavaScript:

Source: http://ma.gnolia.com/people/ads.

Uses a simple script:

<div class="feed">
	
	<h2>Recent bookmarks</h2>
	
	<script type="text/javascript" 
		src="http://ma.gnolia.com/js/none/people/ads?length=4"></script>
	
</div> <!-- // magnolia -->

Embedding via JSON:

Source: http://ma.gnolia.com/people/ads.

Uses the Magnolia.bookmarks object:

<div class="feed">
	
	<h2>Recent bookmarks</h2>
		
	<dl class="magnolia-linkroll">
		<script type="text/javascript" 
			src="http://ma.gnolia.com/json/default/people/ads"></script>
		<script type="text/javascript">
		  var c = 0;
		  for (i=0; i < Magnolia.bookmarks.length; i++) {
			if (c < 8) {
			  document.write('<dt><a href="'+Magnolia.bookmarks[i].url+'">');
			  document.write(Magnolia.bookmarks[i].title+'</a></dt>');
			  document.write('<dd>'+Magnolia.bookmarks[i].description+' 
				  <small>('+Magnolia.bookmarks[i].created+')</small> 
				  '+'</dd>');
			  c = c + 1;
			}
		  }
		</script>
	</dl>
	
</div> <!-- // magnolia -->

And here’s the relevant CSS:

dd {font-size:1.1em; margin:0 0 0 1.1em; padding-left:0;}
dt {margin:.5em 0 0;}
h2 {font-size:1.4em; font-weight:bold; margin:2em 0 1em;}
.feed {background-color:#FFC; padding:1em 1.5em 1.5em; width:67%;}
.feed {border-top:1px solid #FD9; border-bottom:1px solid #FD9;}
.feed h2, .feed h3 {margin-top:0;}