Related Post Round Template
Edit The Code:
See Result »
Try it Yourself - ©
v5blogger
648px x 516px
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <style> .related-posts { width: 100%; margin: 2em 0; float: left; } .related-posts ul li { list-style: none; margin: 0 5px; float: left; text-align: center; border: none; } </style> <script type='text/javascript'> $(document).ready(function() { var maxSearched = 500; var minimum = 4; var maximum = 4; var imageSize = 120; var roundImages = true; var relatedTitle = true; var labelInTitle = true; var relatedTitleText = "More Posts About"; var defaultImage = ""; var campaignTracking = false; var campaignSource = ""; var campaignMedium = ""; var campaignName = ""; var postLabels = $('.post-labels a'); var insertBefore = $('.post-footer'); var labels=[];var label;var alternateLabel;var minposts=minimum-1;if(postLabels.length===1){label=postLabels.text().trim()}else if(postLabels.length>1){$(postLabels).each(function(){labels.push($(this).text().trim())});label=labels[Math.floor(labels.length*Math.random())];var labelLocation=labels.indexOf(label);if(labelLocation===labels.length-1){alternateLabel=labels[labelLocation-1]}else{alternateLabel=labels[labelLocation+1]}}if(label!==undefined){var title=$(".entry-title").text().trim();var labelCount=0;var alternateLabelCount=0;var matches=[];var url=$('link[rel="alternate"][title*="Atom"]').eq(0).attr("href");$.ajax({url:url,data:{"max-results":maxSearched,alt:"json-in-script"},dataType:"jsonp",success:function(e){$.each(e.feed.entry,function(t,n){if(e.feed.entry[t].category!==undefined){var r=[];for(var i=0;i<e.feed.entry[t].category.length;i++){r.push(e.feed.entry[t].category[i].term)}if($.inArray(label,r)!==-1){labelCount++}if($.inArray(alternateLabel,r)!==-1){alternateLabelCount++}}});if(labelCount<=minposts&&alternateLabelCount>=minposts){label=alternateLabel}$.each(e.feed.entry,function(t,n){if(e.feed.entry[t].category!==undefined){var r=[];for(var i=0;i<e.feed.entry[t].category.length;i++){r.push(e.feed.entry[t].category[i].term)}if($.inArray(label,r)!==-1){var s=e.feed.entry[t].title.$t.trim();if(s!==title){var o;for(var u=0;u<e.feed.entry[t].link.length;u++){if(e.feed.entry[t].link[u].rel==="alternate"){o=e.feed.entry[t].link[u].href}}var a;if(e.feed.entry[t].media$thumbnail!==undefined){a=e.feed.entry[t].media$thumbnail.url.split(/s72-c/).join("s"+imageSize+"-c")}else{a=defaultImage}if(matches.length<maxSearched&&campaignTracking===false){matches.push('<li><a href="'+o+'"><img src="'+a+'" alt="'+s+'" nopin="nopin">'+s+"</a></li>")}else if(matches.length<maxSearched&&campaignTracking===true){matches.push('<li><a href="'+o+"?utm_source="+campaignSource+"&utm_medium="+campaignMedium+"&utm_campaign="+campaignName+'"><img src="'+a+'" alt="'+s+'" nopin="nopin">'+s+"</a></li>")}}}}});if(matches.length>=minimum){if(relatedTitle===true&&labelInTitle===true){insertBefore.before('<div class="related-posts"><h5>'+relatedTitleText+' <span class="related-term">'+label+"</span></h5><ul></ul></div>")}else if(relatedTitle===true&&labelInTitle===false){insertBefore.before('<div class="related-posts"><h5>'+relatedTitleText+"</h5><ul></ul></div>")}else{insertBefore.before('<div class="related-posts"><ul></ul></div>')}matches.sort(function(){return.5-Math.random()});for(var t=0;t<maximum;t++){$(".related-posts ul").append(matches[t])}}insertBefore.css("clear","both");$(".related-posts ul li").css({"max-width":imageSize,"border":"none","padding":"0"});if(roundImages===true){$(".related-posts ul li img").css({"width":imageSize,"height":imageSize,"border-radius":"50%"})}else{$(".related-posts ul li img").css({"max-width":imageSize,"height":"auto"});}}})} }); </script> <!------------------ Remove the Below Code --------------------> <div class="related-posts"><h5>More Posts About <span class="related-term">featured</span></h5><ul><li style="max-width: 120px; border: none; padding: 0px;"><a href="http://v5demo.blogspot.com/2016/05/the-14-best-business-youtube-videos.html"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOe0465Tm7yWZ6enXfiQ7k1uh6rluyixdu6_YJkgxe74triHrcLME0AN1xNdmh4kCo9ZwGBYm10b3inIvYcQVkEB2H4cW3PHXv9Zck_lOYqnGCy2wey5esm0tYvSfnlBmmxsnfPktM1eh8/s120-c/business_Fotolia-Subscription-Monthly_145K.jpg" alt="The 14 best business youtube videos" nopin="nopin" style="width: 120px; height: 120px; border-radius: 50%;">The 14 best business youtube videos</a></li><li style="max-width: 120px; border: none; padding: 0px;"><a href="http://v5demo.blogspot.com/2016/05/what-beatles-could-learn-from-mutual.html"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsOHLSfVdvo5EiD9jJUKN37GKD6MqVe5Ja5q1dA6zpR4Xs7LOh14XluC-6yNgd46v71eIaS3wmd0DG4Lr3JXsWtBBm7EE128nvdLCar4wkWfPhjNrDiY2pZRopWHrWez5UcEGXSpr1HZAY/s120-c/business_the-spirit_118K.jpg" alt="What the beatles could learn from mutual funds" nopin="nopin" style="width: 120px; height: 120px; border-radius: 50%;">What the beatles could learn from mutual funds</a></li><li style="max-width: 120px; border: none; padding: 0px;"><a href="http://v5demo.blogspot.com/2016/05/why-you-never-succeed-at-elementary.html"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWo2p6lgqU6s-NOK3TEuUCmIOimxRszb-sO4I3wgh7tqAEoS_1o7X1XrW4l1Yk5oe-1Xo4AHSifKOH3mOZRe_57mk6JDl7pQeCcm_b-rfMBlWzTiMRaNpAmVyzM9EksDDIAGoyDsD09pLo/s120-c/world_businessman-as-president_329K.jpg" alt="Why you'll never succeed at elementary schools" nopin="nopin" style="width: 120px; height: 120px; border-radius: 50%;">Why you'll never succeed at elementary schools</a></li><li style="max-width: 120px; border: none; padding: 0px;"><a href="http://v5demo.blogspot.com/2016/05/8-least-favorite-cultural-solutions.html"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2bBGWkBPCvTMcYzNmm92FsbKcG1XU3zP4uovXeYqEcCDPtj7tOJC11J0Micijhviu9AkZCb8Fd_1mlogDYsc7yvZeI4dqRXleIyJjmyNsaUu129JKdqqr2759WBgK1UzEA4usxc6SSYJ-/s120-c/travel_icy-polar_022K.jpg" alt="8 least favorite cultural solutions" nopin="nopin" style="width: 120px; height: 120px; border-radius: 50%;">8 least favorite cultural solutions</a></li></ul></div>
Newer Post
Older Post
Home