Simple Embeddable Javascript Widgets based on JSON data

I want two embeddable widgets designed for my website/API. Scripts should work on any website and be embeddable like the following example Disqus code. example <script> var disqus_config = function () { [login to view URL] = "[login to view URL]", [login to view URL] = "6" }; (function() { // DON'T EDIT BELOW THIS LINE var d = document, s = [login to view URL]('script'); [login to view URL] = '[login to view URL]'; [login to view URL]('data-timestamp', +new Date()); ([login to view URL] || [login to view URL]).appendChild(s); })(); </script> I've included a basic image of what I think the widgets should look like. I'm open to suggestions to make this better, I'm a relatively novice programmer. I would like options for animations/transitions between objects but I also want the widgets to be lightweight so please find a happy middle. sample config for widget #1 widget_title: 'My Top 10 Favorite Books', widget_title_font_size: '20px', widget_title_font_family: 'Caveat', widget_title_font_color: '#000', number_of_objects: 10, object_type: 'books', object_title_font_size: '20px', object_title_font_family: 'Open Sans', object_title_font_color: '#000', note: true or false, note_font_size: '14px', note_font_family: 'Open Sans', note_font_color: '#000', width: 100% or px value, bg_color: '#FFF', truncate: 200, border_radius: 10px; truncate should hide the remaining note text under an expandable fold widget #2 should have options for tooltips of the object title on image hover and the object title centered below the image, both optional data will be retrieved from a URL like so http://localhost:1011/embed/v1/users/username/top?class_name=books&total=10 example data from URL (wouldn't fit here) [login to view URL]