https:////example.com/style.css X

body { margin:0; padding:0 50px; background-color:white; font:normal normal 11px/1.4 Arial,Sans-Serif; color:black; } #random-post-container {width:400px} #random-post-container ul, #random-post-container li { margin:0; padding:0; list-style:none; overflow:hidden; } #random-post-container img { display:block; float:left; border:1px solid; margin:2px 7px 5px 0; } #random-post-container a { font-weight:bold; font-size:110%; } #rancom-post-container .clear { display:block; clear:both; }

https:////example.com/script.js X

// Feed configuration var homePage = 'https:////idtutorplus.blogspot.com', maxResults = 5, summaryLength = 170, noImageUrl = 'https:////3.bp.blogspot.com/-vpCFysMEZys/UOEhSGjkfnI/AAAAAAAAFwY/h1wuA5kfEhg/s72-c/grey.png', containerId = 'random-post-container'; // Function to generate random number limited from `min` to `max` // Used to create a valid and safe random feed `start-index` function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min + 1)) + min; } // Function to shuffle arrays // Used to randomize order of the generated JSON feed function shuffleArray(arr) { var i = arr.length, j, temp; if (i === 0) return false; while (--i) { j = Math.floor(Math.random() * (i + 1)); temp = arr[i]; arr[i] = arr[j]; arr[j] = temp; } return arr; } // Get a random start index function createRandomPostsStartIndex(json) { var startIndex = getRandomInt(1, (json.feed.openSearch$totalResults.$t - maxResults)); if (window.console && window.console.log) console.log('Get the post feed start from ' + startIndex + ' until ' + (startIndex + maxResults)); // document .write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts"></scr' + 'ipt>'); add_script(homePage + '/feeds/posts/summary?alt=json-in-script&orderby=updated&start-index=' + startIndex + '&max-results=' + maxResults + '&callback=randomPosts'); } // Widget's main function function randomPosts(json) { var link, summary, img, ct = document.getElementById(containerId), entry = shuffleArray(json.feed.entry), skeleton = "<ul>"; for (var i = 0, len = entry.length; i < len; i++) { summary = ("summary" in entry[i]) ? (entry[i].summary.$t.replace(/<.*?>/g, "")).substring(0, summaryLength) + '…' : ""; img = ("media$thumbnail" in entry[i]) ? entry[i].media$thumbnail.url.replace(/\/s[0-9]+(-c)?/, "/s72-c") : noImageUrl; for (var j = 0, jen = entry[i].link.length; j < jen; j++) { link = (entry[i].link[j].rel == "alternate") ? entry[i].link[j].href : '#'; } skeleton += '<li>'; skeleton += '<img src="' + img + '" alt="" width="72" height="72">'; skeleton += '<a href="' + link + '">' + entry[i].title.$t + '</a><br>'; skeleton += '<span>' + summary + '</span>'; // Show all post labels ... skeleton += ' <small>'; var tags = entry[i].category, labels = []; for(var z = 0, zen = tags.length; z < zen; ++z) { labels.push('<a href="' + homePage + '/search/label/' + encodeURIComponent(tags[z].term) + '?max-results=20" rel="tag">' + tags[z].term + '</a>'); } skeleton += labels.join(', '); skeleton += '</small>'; skeleton += '<span class="clear"></span></li>'; } ct.innerHTML = skeleton + '</ul>'; } // document .write('<scr' + 'ipt src="' + homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex"></scr' + 'ipt>'); add_script(homePage + '/feeds/posts/summary?alt=json-in-script&max-results=0&callback=createRandomPostsStartIndex'); /** * `document[dot]write` is disallowed in JSFiddle envioriment and might break your fiddle. */ function add_script(url) { var s = document.createElement('script'); s.src = url; document.getElementsByTagName('head')[0].appendChild(s); }

<h2>Random Post</h2> <div id='random-post-container'>Memuat…</div>