terça-feira, 25 de agosto de 2009

Widget: Posts Recentes com Thumbnails (pequena imagem de exibição)

Bem, como pode ser visto nos posts anteriores a nossa Equipe não como se faz as coisas, pois bem, aqui lhe ensinaremos como fazer um widget com Posts Recentes.

Basta você copiar e colar o código e apenas fazer alguns ajustes que estarão detalhados:
Segue abaixo o código que você deverá copiar e colar em um gadget de "HTML/JavaScript":

<script language="JavaScript">
imgr = new Array();

imgr[0] = "http://ENDEREÇO-IMAGEM-1";
imgr[1] = "http://ENDEREÇO-IMAGEM-2";
imgr[2] = "http://ENDEREÇO-IMAGEM-3";
imgr[3] = "http://ENDEREÇO-IMAGEM-4";
imgr[4] = "http://ENDEREÇO-IMAGEM-5";

showRandomImg = true;

tablewidth = 200;
cellspacing = 2;
borderColor = "transparent";
bgTD = "transparent";

imgwidth = 40;
imgheight = 40;

fntsize = 12;
acolor = "#333";
aBold = true;
icon = " ";

text = "comentários";

showPostDate = false;

summaryPost = 100;
summaryFontsize = 9;
summaryColor = "#666";
icon2 = " ";

numposts = 8;

home_page = "http://bloggeae.blogspot.com/";

</script>
<script src="https://ecnukw.blu.livefilestore.com/y1pDLLJm4dfxZRUmZNxUHWGf4elp9wkUYcNgaK3Zzy5_1OXcPN_3QRWxe0fK6s0cuPmr4XvbSKXYZj6MJCx19JrflU4qVhZk7N3/Posts%20Recentes.js" type="text/javascript"></script>


Abaixo segue os ajustes que você deverá fazer para deixar seu blog mais organizado:

tablewidth = 200; - Edite somente o número para ajustar o largura limite do widget, se você não souber o tamanho certo da sua sidebar, vá fazendo testes. -existem coisas bem mais cansativas.

imgwidth = 40; - largura da imagem contida na postagem;
imgheight = 40; - altura da imagem contida na postagem.

fntsize = 12; - o número que você colocar depois do sinal de igual indica o tamanho da fonte do texto no widget, entre 10 e 15 seria o ideal, mas cada caso é um caso, então faça do jeito que você achar melhor.

acolor = "#333"; - a numeração entre aspas significa a cor que o sistema em HTML reconhece, aqui não seria o lugar ideal para explicar o funcionamento desse código, você pode encontrar vários valores para o código no próprio sistema do blog, clicando na aba "Layout" e depois em "Fontes e Cores", selecione a cor e veja o código em uma caixa de texto. Já fica a promessa para colocar um sistema de código de cores.

text = "comentários"; - o texto que vem logo após o número de comentários, caso você queria mudar e não tenha ideia, você pode colocar: "respostas", "observações" entre outras.
summaryPost = 100; - número que você colocar depois do sinal de igual vai indicar o limite de caracteres que irão ser utilizados para fazer uma breve introdução da postagem.

summaryFontsize = 9; - o número que você colocar depois do sinal de igual indica o tamanho da breve introdução da postagem.

numposts = 8; - o número que você colocar depois do snal de igual indica o número de postagens recentes que irão aparecer.

home_page = "http://bloggeae.blogspot.com/"; - como mostra, você deverá colocar a URL do seu blog entre as aspas, caso contrário o widget não irá funcionar.

</script>
<script src="https://ecnukw.blu.livefilestore.com/y1pDLLJm4dfxZRUmZNxUHWGf4elp9wkUYcNgaK3Zzy5_1OXcPN_3QRWxe0fK6s0cuPmr4XvbSKXYZj6MJCx19JrflU4qVhZk7N3/Posts%20Recentes.js" type="text/javascript"></script> - aqui vai o link do arquivo java hospedado na internet, se qualquer caractere for apagado, o widget não irá funcionar.

Nenhum comentário:

Postar um comentário

Gostou do artigo?
Poste aqui um comentário, é claro que o comentário deve estar de acordo com o tema do artigo!
Grato pela atenção! Equipe do EAE!