segunda-feira, 31 de outubro de 2016

Recent Post degan widget 2 Styles

recent post degan terbaru

Hoje vamos apresentar 2 novos estilos de recent post degan widget para colocar na sidebar do Blogger, algumas pessoas perguntam mas para que serve isso? isso serve para melhorar a visibilidade do que há de novo temos 2 novos estilos o primeiro estilo é o citado acima caso deseje adicionar isso ao seu template siga os passos abaixo:


Para adicionar o estilo acima siga os passos:

Faça login no blogger então va no menu layout 
procure a sidebar então clique em adicionar novo gadget 
com as teclas combinadas CTRL+F busque por Html/JavaScript 
adicione o seguinte código:

<style>
.clear { clear:both; } .recent-post-title { background:#fff; margin:0 0 5px; padding:0; position:relative; } .recent-post-title h2 { font:normal bold 14px Arial,sans-serif; height:26px; line-height:26px; margin:0 0; padding:0 10px; background:#0b944b; color:#ffffff; display:inline-block; } .recent-post-title h6 { float:right; font:normal bold 10px Arial,sans-serif; height:26px; line-height:26px; margin:0 0; padding:0 10px; color:#ffffff; display:inline-block; border-bottom:5px solid #906090; } .recent-post-title h2 a { color:#ffffff; } .recent-post-title h2 a:after { content:"\f18e"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-left:6px; } .recent-post-one-thumb { float:left; width:50%; margin:0 0; } .recent-post-one-thumb .widget { padding:0 10px 10px 0; } .recent-post-one-thumb .widget-content { background:#ffffff; border:1px solid #e5e5e5; padding:15px; } .recent-post-one-thumb ul { list-style-type:none; margin:0 0 0 0; padding:0 0 0 0; } ul.rp_thumbs { margin:0 0 0 0; } ul.rp_thumbs li { font-size:12px; height:auto; margin:0 0 5px; padding:0 0 2px; border-bottom:1px solid #e5e5e5; } ul.rp_thumbs .rp_thumb { position:relative; background:#fbfbfb; margin:3px 0 10px 0; width:100%; height:0; padding-bottom:46%; overflow:hidden; } ul.rp_thumbs .rp_thumb img { height:auto; width:100%; } ul.rp_thumbs2 { font-size:13px; } ul.rp_thumbs2 li {    height: auto;font-size: 11px;
    margin: 0 0 5px;
    padding: 0 0 2px;
    border-bottom: 1px solid #e5e5e5;} ul.rp_thumbs2 .rp_thumb2 { background:#fbfbfb; float:left; margin:3px 8px 8px 0; height:auto; width:100%; } ul.rp_thumbs2 .rp_thumb2 img { height:auto; width:100%; } span.rp_title { font:normal normal 14px Arial,sans-serif; display:block; margin:0 0 5px; line-height:1.4em; } span.rp_title2 { font-size:14px; } span.rp_summary { display:block; margin:6px 0 0; color:#666666; } span.rp_meta { background:transparent; display:block; font-size:11px; color:#666666; } span.rp_meta a { color:#666666 !important; display:inline-block; } span.rp_meta_date,span.rp_meta_comment,span.rp_meta_more { display:inline-block; margin-right:8px; } span.rp_meta_date:before { content:"\f073"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } span.rp_meta_comment:before { content:"\f086"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } span.rp_meta_more:before { content:"\f0a9"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } ul.rp_thumbs2 li a:hover,ul.rp_thumbs li a:hover { color:#0072C6; }
</style>
<script type='text/javascript'>
var numposts = 1;
var numposts2 = 5;
var showpostthumbnails = true;
var showpostthumbnails2 = true;
var displaymore = false;
var displaymore2 = false;
var showcommentnum = false;
var showcommentnum2 = false;
var showpostdate = false;
var showpostdate2 = false;
var showpostsummary = false;
var numchars = 100;
var thumb_width = 300;
var thumb_height = 170;
var thumb_width2 = 300;
var thumb_height2 = 170;
var no_thumb = 'http://1.bp.blogspot.com/-7vDs5hMaDho/U268E2ecF4I/AAAAAAAADY8/RBHVTTuJrxc/w300-h140-c/no-image.png'
var no_thumb2 = 'http://3.bp.blogspot.com/-ltyYh4ysBHI/U04MKlHc6pI/AAAAAAAADQo/PFxXaGZu9PQ/s60-c/no-image.png'
</script>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(e){for(var t=0;t<numposts;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var l;try{l=n.media$thumbnail.url;l=l.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){l=d}else l=no_thumb}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);document.write('<ul class="rp_thumbs">');document.write("<li>");if(showpostthumbnails==true)document.write('<a href="'+i+'"><div class="rp_thumb"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+r+'" title="'+r+'" src="'+l+'"/></div></a>');document.write('<span class="rp_title"><a href="'+i+'" title="'+r+'" target ="_top">'+r+"</a></span>");var y="";document.write('<span class="rp_meta">');if(showpostdate==true){y=y+'<span class="rp_meta_date">'+g+"/"+m+"/"+v+"</span>"}if(showcommentnum==true){if(u=="1 Comments")u="1 Comment";if(u=="0 Comments")u="No Comments";u='<span class="rp_meta_comment"><a href="'+f+'" target ="_top">'+u+"</a></span>";y=y+u}if(displaymore==true){y=y+'<span class="rp_meta_more"><a href="'+i+'" class="url" target ="_top">Read More...</a></span>'}document.write(y);document.write("</span>");document.write('<span class="rp_summary">');if("content"in n){var w=n.content.$t}else if("summary"in n){var w=n.summary.$t}else var w="";var E=/<\S[^>]*>/g;w=w.replace(E,"");if(showpostsummary==true){if(w.length<numchars){document.write("");document.write(w);document.write("")}else{document.write("");w=w.substring(0,numchars);var S=w.lastIndexOf(" ");w=w.substring(0,S);document.write(w+"...");document.write("")}}document.write("</span>");document.write("</li>");document.write("</ul>")}document.write('<ul class="rp_thumbs2">');for(var t=1;t<numposts2;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=1;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var x;try{x=n.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){x=d}else x=no_thumb2}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);if(showpostthumbnails2==true)document.write('<a href="'+i+'"><div class="rp_thumb2"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+r+'" title="'+r+'" src="'+x+'"/></div></a>');document.write("<li>");document.write('<span class="rp_title rp_title2"><a href="'+i+'" title="'+r+'" target ="_top">'+r+"</a></span>");var y="";document.write('<span class="rp_meta rp_meta2">');if(showpostdate2==true){y=y+'<span class="rp_meta_date rp_meta_date2">'+g+"/"+m+"/"+v+"</span>"}if(showcommentnum2==true){if(u=="1 Comments")u="1 Comment";if(u=="0 Comments")u="No Comments";u='<span class="rp_meta_comment rp_meta_comment2"><a href="'+f+'" target ="_top">'+u+"</a></span>";y=y+u}if(displaymore2==true){y=y+'<span class="rp_meta_more rp_meta_more2"><a href="'+i+'" class="url" target ="_top">Read More...</a></span>'}document.write(y);document.write("</span>");document.write("</li>")}document.write("</ul>")};
//]]>
</script>
<script>
document.write("<script src=\"/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs\"><\/script>");
document.write('<div class="recent-post-title"></div>');
</script>


Estilo 2:

post recent degan new style blogger widget

Adicione o seguinte código:

<style>
.clear { clear:both; } .recent-post-title { background:#fff; margin:0 0 5px; padding:0; position:relative; } .recent-post-title h2 { font:normal bold 14px Arial,sans-serif; height:26px; line-height:26px; margin:0 0; padding:0 10px; background:#0b944b; color:#ffffff; display:inline-block; } .recent-post-title h6 { float:right; font:normal bold 10px Arial,sans-serif; height:26px; line-height:26px; margin:0 0; padding:0 10px; color:#ffffff; display:inline-block; border-bottom:5px solid #906090; } .recent-post-title h2 a { color:#ffffff; } .recent-post-title h2 a:after { content:"\f18e"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-left:6px; } .recent-post-one-thumb { float:left; width:50%; margin:0 0; } .recent-post-one-thumb .widget { padding:0 10px 10px 0; } .recent-post-one-thumb .widget-content { background:#ffffff; border:1px solid #e5e5e5; padding:15px; } .recent-post-one-thumb ul { list-style-type:none; margin:0 0 0 0; padding:0 0 0 0; } ul.rp_thumbs { margin:0 0 0 0; } ul.rp_thumbs li { font-size:12px; height:auto; margin:0 0 5px; padding:0 0 2px; border-bottom:1px solid #e5e5e5; } ul.rp_thumbs .rp_thumb { position:relative; background:#fbfbfb; margin:3px 0 10px 0; width:100%; height:0; padding-bottom:46%; overflow:hidden; } ul.rp_thumbs .rp_thumb img { height:auto; width:100%; } ul.rp_thumbs2 { font-size:13px; } ul.rp_thumbs2 li {    height: auto;min-height: 66px;
    font-size: 11px;
    margin: 0 0 5px;
    padding: 0 0 2px;
    border-bottom: 1px solid #e5e5e5;} ul.rp_thumbs2 .rp_thumb2 { background:#fbfbfb; float:left; margin:3px 8px 0 0; height:60px; width:60px; } ul.rp_thumbs2 .rp_thumb2 img { height:60px; width:60px; } span.rp_title { font:normal normal 14px Arial,sans-serif; display:block; margin:0 0 5px; line-height:1.4em; } span.rp_title2 { font-size:14px; } span.rp_summary { display:block; margin:6px 0 0; color:#666666; } span.rp_meta { background:transparent; display:block; font-size:11px; color:#666666; } span.rp_meta a { color:#666666 !important; display:inline-block; } span.rp_meta_date,span.rp_meta_comment,span.rp_meta_more { display:inline-block; margin-right:8px; } span.rp_meta_date:before { content:"\f073"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } span.rp_meta_comment:before { content:"\f086"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } span.rp_meta_more:before { content:"\f0a9"; font-family:FontAwesome; font-style:normal; font-weight:normal; text-decoration:inherit; padding-right:4px; } ul.rp_thumbs2 li a:hover,ul.rp_thumbs li a:hover { color:#0072C6; }
</style>
<script type='text/javascript'>
var numposts = 1;
var numposts2 = 5;
var showpostthumbnails = true;
var showpostthumbnails2 = true;
var displaymore = false;
var displaymore2 = false;
var showcommentnum = false;
var showcommentnum2 = false;
var showpostdate = false;
var showpostdate2 = false;
var showpostsummary = false;
var numchars = 100;
var thumb_width = 180;
var thumb_height = 100;
var thumb_width2 = 60;
var thumb_height2 = 60;
var no_thumb = 'http://1.bp.blogspot.com/-7vDs5hMaDho/U268E2ecF4I/AAAAAAAADY8/RBHVTTuJrxc/w300-h140-c/no-image.png'
var no_thumb2 = 'http://3.bp.blogspot.com/-ltyYh4ysBHI/U04MKlHc6pI/AAAAAAAADQo/PFxXaGZu9PQ/s60-c/no-image.png'
</script>
<script type='text/javascript'>
//<![CDATA[
function labelthumbs(e){for(var t=0;t<numposts;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var l;try{l=n.media$thumbnail.url;l=l.replace("/s72-c/","/w"+thumb_width+"-h"+thumb_height+"-c/")}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){l=d}else l=no_thumb}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);document.write('<ul class="rp_thumbs">');document.write("<li>");if(showpostthumbnails==true)document.write('<a href="'+i+'"><div class="rp_thumb"><span class="rollover"></span><img width="'+thumb_width+'" height="'+thumb_height+'" alt="'+r+'" title="'+r+'" src="'+l+'"/></div></a>');document.write('<span class="rp_title"><a href="'+i+'" title="'+r+'" target ="_top">'+r+"</a></span>");var y="";document.write('<span class="rp_meta">');if(showpostdate==true){y=y+'<span class="rp_meta_date">'+g+"/"+m+"/"+v+"</span>"}if(showcommentnum==true){if(u=="1 Comments")u="1 Comment";if(u=="0 Comments")u="No Comments";u='<span class="rp_meta_comment"><a href="'+f+'" target ="_top">'+u+"</a></span>";y=y+u}if(displaymore==true){y=y+'<span class="rp_meta_more"><a href="'+i+'" class="url" target ="_top">Read More...</a></span>'}document.write(y);document.write("</span>");document.write('<span class="rp_summary">');if("content"in n){var w=n.content.$t}else if("summary"in n){var w=n.summary.$t}else var w="";var E=/<\S[^>]*>/g;w=w.replace(E,"");if(showpostsummary==true){if(w.length<numchars){document.write("");document.write(w);document.write("")}else{document.write("");w=w.substring(0,numchars);var S=w.lastIndexOf(" ");w=w.substring(0,S);document.write(w+"...");document.write("")}}document.write("</span>");document.write("</li>");document.write("</ul>")}document.write('<ul class="rp_thumbs2">');for(var t=1;t<numposts2;t++){var n=e.feed.entry[t];var r=n.title.$t;var i;if(t==e.feed.entry.length)break;for(var o=1;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var u=n.link[o].title;var f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var x;try{x=n.media$thumbnail.url.replace("/s72-c/","/w"+thumb_width2+"-h"+thumb_height2+"-c/")}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){x=d}else x=no_thumb2}var p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var g=p.substring(8,10);if(showpostthumbnails2==true)document.write('<a href="'+i+'"><div class="rp_thumb2"><img width="'+thumb_width2+'" height="'+thumb_height2+'" alt="'+r+'" title="'+r+'" src="'+x+'"/></div></a>');document.write("<li>");document.write('<span class="rp_title rp_title2"><a href="'+i+'" title="'+r+'" target ="_top">'+r+"</a></span>");var y="";document.write('<span class="rp_meta rp_meta2">');if(showpostdate2==true){y=y+'<span class="rp_meta_date rp_meta_date2">'+g+"/"+m+"/"+v+"</span>"}if(showcommentnum2==true){if(u=="1 Comments")u="1 Comment";if(u=="0 Comments")u="No Comments";u='<span class="rp_meta_comment rp_meta_comment2"><a href="'+f+'" target ="_top">'+u+"</a></span>";y=y+u}if(displaymore2==true){y=y+'<span class="rp_meta_more rp_meta_more2"><a href="'+i+'" class="url" target ="_top">Read More...</a></span>'}document.write(y);document.write("</span>");document.write("</li>")}document.write("</ul>")};
//]]>
</script>
<script>
document.write("<script src=\"/feeds/posts/default?orderby=updated&alt=json-in-script&callback=labelthumbs\"><\/script>");
document.write('<div class="recent-post-title"></div>');
</script>


Obs: Caso deseje selecionar por label apenas modifique o código JS acima por esse:

<script>
document.write("<script src=\"/feeds/posts/default/-/Label?orderby=updated&alt=json-in-script&callback=labelthumbs\"><\/script>");
document.write('<div class="recent-post-title"></div>');
</script>

NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post

Nenhum comentário:

Postar um comentário

NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post
 

Delivered by FeedBurner