» Códigos, Dicas, Templates, Tutoriais para deixar o seu blog do seu jeito!

Colocando Gadget de Posts Recentes

Esta widget mostra os últimos posts criados por você.

Para colocar este recurso em seu blog:
Vá em Layout→ Modelo→ Elementos de página→Escolha onde quer adicionar a widget de Posts Recentes

1ª Opção - Usando o Códidigo Javascript hospedado em um site de sua preferência:

»Clique em Adicionar um elemento de página→ Escolha tipo HTML→ Copie o código abaixo e cole na widget.
<ul>
<script src='LINK DO JAVASCRIPT' type='text/javascript'>
</script>
<script style="text/javascript">
var numposts = 5;
var showpostdate = true;
var showpostsummary = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://Endereço do seu BLOG/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts">
</script>
</ul>

Configurando seu Gadget

►Se quiser alterar o número de posts altere o número 5 em [var numposts = 5;] por um número maior ou menor.
►Se não quiser mostrar a data dos posts troque true em [var showpostdate = true;] por false.
►Se não quiser que apareça o resumo do post troque true em [var showpostsummary = true;] por false.

►Se você optou por mostrar o resumo do post altere a quantidade de caracteres nesta linha [var numchars= 100;] alterando o número 100 por o número que lhe convier.

»A gadget de Posts Recentes funciona com um JavaScript que deve ser hospedado por você→ Veja como fazer no fim do post;

» Ou você tem a opção de colocar o código javascript incorporado ao seu template, ou seja, Hospedar no próprio Blogger, para que não corra o risco do site de hospedagem dar problemas.

2ª Opção - Usando o Javascript completo:

O código ficará assim:
<ul>
<script>
// ----------------------------------------
// SHOW RECENT POSTS
// ----------------------------------------
// This functions takes a blogger-feed in JSON
// format and displays it.
// Version: 2.0
// Date:    2006-12-01
// Author:  Hans Oosting
// URL:     beautifulbeta.blogspot.com
// ----------------------------------------

function showrecentposts(json) {

for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdyear = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdday = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;}
else
if ("summary" in entry) {
var postcontent = entry.summary.$t;}
else var postcontent = "";
var re = /<S[^>]*>/g;
postcontent = postcontent.replace(re, "");
if (!standardstyling) document.write('<div class="bbrecpost">');
if (standardstyling) document.write('<li>');
document.write(posttitle);
if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday + ', ' + cdyear);
if (!standardstyling) document.write('</div><div class="bbrecpostsum"">');
if (showpostsummary == true) {
if (standardstyling) document.write('<br/>');
if (postcontent.length < numchars) {
 if (standardstyling) document.write('<i>');
 document.write(postcontent);
 if (standardstyling) document.write('</i>');}
else {
 if (standardstyling) document.write('<i>');
 postcontent = postcontent.substring(0, numchars);
 var quoteEnd = postcontent.lastIndexOf(" ");
 postcontent = postcontent.substring(0,quoteEnd);
 document.write(postcontent + '...' + readmorelink);
 if (standardstyling) document.write('</i>');}
}
if (!standardstyling) document.write('</div>');
if (standardstyling) document.write('</li>');
}
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('');
if (!standardstyling) document.write('</div>');

}
</script>
<script style="text/javascript">
var numposts = 5;
var showpostdate = true;
var showpostsummary = true;
var numchars = 100;
var standardstyling = true;
</script>
<script src="http://Endereço do seu BLOG/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts">
</script>
</ul>

Como fazer com o Javascript para usar a 1ª Opção

» O código em AZUL é o Javascript dos Posts Recentes.
» COPIE as linhas em AZUL acima COLE em um bloco de notas;
» Salve no bloco de notas em seu computador com a extensão .js no nome do arquivo - Ex: Clique em Salvar Como e escreva o nome: Posts Recentes.js
»Hospede este arquivo em um site de sua preferência colocando o LINK fornecido por sua hospedagem onde está indicado na 1ª opção deste tutorial;


»Desta forma não haverá o risco de seus posts recentes não funcionarem, a não ser que muitas pessoas usem o mesmo endereço do java e sua taxa de transmissão de banda ultrapassar o limite do site de hospedagem.

Fonte: http://ustadz.net/typoxp-21-blogger-template.htm


Última Atualização:14/07/2013
Colocando Gadget de Posts Recentes Colocando Gadget de Posts Recentes Reviewed by Áurea on 12/16/2007 Rating: 5

9 comentários:

  1. Ola, n eh mais facil escolher feed como elemnto de paginas e colok a url do seu proprio feed??

    Eu particularmente achop bem mais facil


    Obriagdo

    Abraços
    Bye!

    ResponderExcluir
  2. ola... tentei fazer isso ai.. e deu tudo certo quando visualizo o post, mais quando salvo ele não funciona.. eu não consegui baixar o arquivo java que vc menciona

    ResponderExcluir
  3. Eu também faço o que o Hideki falou. É mais fácil e sempre funciona!

    ResponderExcluir
  4. Tu é muito fera!!!!!
    ameiiii nem precisa responder o que eu tinha perguntado em relação ao "leia mais" para o template listen rosa..... agora tá tudo certo
    show de bola
    amei
    se pudesse te abraçava pessoalmente fiquei taooo feliz............ fazem horas e horas e horas q estou tentando fazer isso
    bjao

    ResponderExcluir
  5. bem lgw.... agradeço pelo por tudo!

    uma pergunta: tem como desabilitar a imagem? ou apenas redimencionar ela?

    ;)

    ResponderExcluir
  6. @' ॐ п α п δ σ ॐ ' Qual imagem?

    ResponderExcluir
  7. oi você, tudo bem?...
    estou passando por aqui atrás de widgets de posts recentes com efeito ou pelo menos com uma linha pra dividir um link do outro igual vc tem aí no seu lindo e utilizável blog... tem como vc me passar o código que deixa essa linha entre um link e outro:???

    por favor!

    grato

    bay, Jeff Louis

    parabéns pelo seu site..


    fica com Deus

    ResponderExcluir
  8. Valeu pelo código . Funcionou perfeito .

    ResponderExcluir

Todos os comentários são lidos e moderados antes da publicação.
Para que seu comentário seja publicado leia a Política de Comentários do Blog no post Regras do Blog

Tecnologia do Blogger.