100 randam posts widget with image thumbnail and snippet බොගට දමාගන්නා ආකාරය

ඔන්න ඉතින් අටමා මෙහෙම එකක් ලියලම නැ , මෙහෙම එකක් මට ඕන විදිහට හදාගන්ඩ මට හෙන උවමනාවක් තිබුනා , ‍මොකද කියනවානං අර linkwithin  ගැජට් එක දැන් ටික දවසක ඉදන් වැඩ කරන්නේ නැ. මොන රෙද්දක් වෙලාද මන්දා.

මම මෙහෙම එව්වා හෙන ගොඩක් බාගන බොගට දාලා බැලුවත් මට ඕන විදිහට තිබුනේ නැ , ඉංගිරිසිත් හරියට බැරුව HTML/JavaScript නිකං ග්‍රීක් වාගේ කේස් එකක් උනාට මාත් ඉතින් ටිකක් දිග ඇරගන බැලුවා එඩිට් පාරක් දාන්ඩ ,

ගන්න ගන්න හැම  එකේම මොකක් හරි අල්ලන්නේ නැති කෑල්ලක් තියන හන්දා මම බැලුවා එඩිට් පාරක් දාලා මට ඕන විදිහට හදාගන්ඩ , ඔය අතරේ මට  සැට් උනා මෙන්න මේක,



<style>
#random-posts img{border-radius: 10px;float:left;margin-right:5px;
width:75px;height:75px;background-color: #F5F5F5;padding: 3px;transition: all 0.2s linear 0s;}
#random-posts img:hover{opacity: 0.6;}
ul#random-posts {list-style-type: none;padding: 0px;}
#random-posts a {font-size: 12px;text-transform:uppercase; padding: 0px auto 5px;}
#random-posts a:hover {text-decoration: none;}
.rp-snippet {font-size: 11px;background: none; padding: 5px; margin-right: 8px;}
#random-posts span {}
#random-posts li {margin-bottom: 10px;border-bottom: 1px solid #EEEEEE; padding: 4px;}
</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=5;
var rdp_snippet_length=110;
var rdp_info='yes';
var rdp_comment='Comments';
var rdp_disable='Comments Disabled';
var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};
</script>
<script type='text/javaScript'> 
function random_posts(json){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"…";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu9IfawHiNSIn-LA3GJ_xocAmv9eSrUIRu779ubG_FOgWBNKJfqr7alSeNP6-mk3MadcDeOZGVXN1eW8Z6ds_kF6U7eicfyb9ElTfceWjs_IgtOSrfaW6ERV760W1cNyr9iEU8-kp-5zI/s1600/no_thumb.png"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div  class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_commentsNum)+'</div></span>'};document.write('<br/><div class="rp-snippet">'+rdp_snippet+'</div><div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};
</script>
</ul>

මේක මට ඕන විදිහට තිබුනා උනත් අදාල පෝස්ට් එකට වැටුන කමෙන්ට් ප්‍රමාණය සහ දිනය පවා පෙන්නන හන්දා මම නොදන්න HTML/JavaScript වලට බැස්සා , තටම තමට කියවලා ( ඇයි යකෝ ඉංගිරිසිනේ ) කොහොමහරි මට ඕන නැති එව්වා මකලා හදා ගත්තා මට ඕන විදිහට , දැන් ඔය බොගේ වම් පැත්තේ තියෙන්නේ බැබලි බැබලී,
මෙන්න තියනවා ඒකේ ස්කිරිප්ට් කෑල්ල



 <style>
#random-posts img{border-radius: 10px;float:left;margin-right:5px;
width:75px;height:75px;background-color: #F5F5F5;padding: 5px;transition: all 0.2s linear 0s;}
#random-posts img:hover{opacity: 0.6;}
ul#random-posts {list-style-type: none;padding: 0px;}
#random-posts a {font-size: 18px;text-transform:uppercase; padding: 0px auto 0px;}
#random-posts a:hover {text-decoration: none;}
.rp-snippet {font-size: 18px;background: none; padding: 5px; margin-right: 8px;}
#random-posts span {}
#random-posts li {margin-bottom: 5px;border-bottom: 0px solid #EEEEEE; padding: 10px;}
</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=100;
var rdp_snippet_length=110;
var rdp_info='no';
var rdp_comment='Comments';
var rdp_disable='Comments Disabled';
var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};
</script>
<script type='text/javaScript'>
function random_posts(json){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"…";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu9IfawHiNSIn-LA3GJ_xocAmv9eSrUIRu779ubG_FOgWBNKJfqr7alSeNP6-mk3MadcDeOZGVXN1eW8Z6ds_kF6U7eicfyb9ElTfceWjs_IgtOSrfaW6ERV760W1cNyr9iEU8-kp-5zI/s1600/no_thumb.png"}}};document.write('<li>');document.write('<a href="'+rdp_posturl+'" rel="nofollow"><img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/></a>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes'){document.write('<span><div  class="rp-info">'+rdp_postdate.substring(8,10)+'/'+rdp_postdate.substring(5,7)+'/'+rdp_postdate.substring(0,4)+' - '+rdp_)+'</div></span>'};document.write('<br/><div class="rp-snippet">'+rdp_snippet+'</div><div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};
</script>
</ul>

ඕක දැම්මහම පේන විදිහ තමා ඔය අටම්පහුරේ වැම් පැත්තේ තියෙන්නේ ,

 කමෙන්ට් සහ පෝස්ට් එක දාපු දිනයත් එක්ක ඕනම නං , ඔය මේකට කලින් උඩ තියන එක කොපි කරලා දාන්න.

මේ ස්කිරිප්ට් එකේ var rdp_numposts=100; කියන තැන ඔයාට ඕන නං පෝස්ට් ප්‍රමාණය වෙනස් කරලා දාන්න , මම නං දැම්මේ පෝස්ට් 100ක්.

ඔය කොල්ලො කෙල්ලේ මෙව්වා කොරාට , අපි වාගේ නාකි පොරවල් මෙව්වා නොකලට , පට්ට ආතල් එකක් එන වැඩක් කියලාමටත් තේරුනේ අද තමයි , එහෙනං කරලා බලන්ඩකෝ ,