Welcome to the blog Hitech Tips

A blog about web and IT. Sharing things I use at work.

Faça posts de forma rápida e eficaz

Posted by Mr.Editor Monday, February 15, 2010 0 comments

1. Use o Windows Live Writer

image

Com o WLW, escreverá posts como se estivesse num processador de texto. Pode copiar imagens e coloca-las no post directamente a partir do clipboard, que o WLW colocará a imagem no seu álbum Picasa. Pode também copiar HTML de outras páginas e colar-lo no seu post sem que perca a formatação. Além disso, toda a edição é feita usando a formatação do blog, o que aumenta a produtividade. Duas dicas:

  • quando colar uma imagem, clique nela e depois vá às propriedades "Avançadas" (na barra lateral) e escolha o tamanho "original" na lista. Se precisar de redimensionar a imagem, pode ir ao às propriedades "Efeitos" e adicionar o efeito nitidez.
  • quando está a escrever e prime enter, está a inserir um novo parágrafo. Este comportamento é diferente daquele que o editor do blogger tem, pois no blogger o enter produz uma quebra de linha. A diferença é que o parágrafo geralmente tem algum espaço vertical entre o texto e a quebra de linha não (neste aspecto, o WLW segue o standard). Para inserir uma quebra de linha, basta fazer SHIFT ENTER e, assim, mudará de linha sem adicionar um parágrafo. Note que há formatação que se aplica a parágrafos inteiros (o estilo de parágrafo, por exemplo), pelo que não se surpreenda se esta mudar texto em linhas quebradas com o SHIFT ENTER.

2. Use um programa para capturar ecrãs

image

Quando preciso de copiar uma parte de outra página web (ou de outra aplicação de software), uso o programa de captura de ecrãs MWSnap, que é freeware. Tenho a opção para auto-copiar a imagem seleccionada (ver imagem) e assim basta-me fazer a captura da imagem (CTRL SHIFT A) e depois fazer colar-la no post (CTRL V) e está feito. Actualmente, até uso o MWSnap para redimensionar as imagens da forma que quero. Assim, visualizo a imagem num qualquer programa e depois faço a captura e colo a imagem no post. Desta forma poupo dois passos tediosos que são redimensionar a imagem num programa de tratamento de imagens e não preciso de fazer o upload da imagem (pois o WLW fá-lo automaticamente). Uma dica:

  • Imagine que precisa de imagens com uma dimensão específica, por exemplo com 650x250 pixéis. O MWSnap é a ferramenta ideal para isso! Coloque a dimensão da imagem como se segue:
    image
    e depois é só clicar no botão. A janela do MWSnap esconder-se-á (*) e ao arrastar o rato está a escolher área que irá copiar. Claro que antes de fazer a captura terá que ter a imagem visível no ecrã, com um zoom adequado à captura.
    * se isso não acontecer, vá ao menu Tools | Settings e depois verifique que tem estas opções activas:
    image

Conclusão

O WLW e o MWSnap constituem um ambiente produtivo para editar o blog. O primeiro permite-lhe concentrar-se na escrita e o segundo na ilustração do texto. Boas postagens.

image

 

60% dos visitantes deste blog usam o Internet Explorer (IE) e 30% usam o Firefox (FF). Este indicador não é o estatisticamente relevante mas não andará longe dos padrões de visitas globais. Ilustra o terreno que o FF tem conquistado ao IE, especialmente quando houve tempos (por volta de 2002) em que o IE chegou a ter 90% do mercado. Nessa altura, o IE era nitidamente o melhor browser do mercado, tanto em termos de performance como ao nível das especificações. Aliando a então boa apresentação do HTML e bom suporte para scripting ao facto de o browser vir de raiz com o sistema operativo mais popular, o Windows, eis como o IE se tornou um campeão no mundo dos browsers.

O que é que mudou então? O gigante dormiu à sombra do sucesso e investiu mais em práticas comerciais do que na melhoria do produto. Além disso, a estratégia da Microsoft de dominar os mercados onde esteja que sempre passou por incluir especificidades suas também passou pelo IE, o que no caso significou adicionar elementos de HTML que não eram padrão, mau suporte para estilos CSS e tentativa (falhada) de tornar o VBScript como linguagem de scripting no browser.

É neste contexto que surge o FF, com uma estratégia assente em três pontos:
- aumentar a performance do produto;
- seguir os standards definidos pelo W3C; 
- ter uma plataforma de extensões, aberta aos programadores, que permita expandir o browser.

O FF tem desta forma ganho terreno no mercado dos browsers e, apesar do percalço chamado Chrome, desde há vários anos o melhor browser para o utilizador final e para o programador de software. Neste último aspecto, está mesmo anos luz à frente da concorrência, graças a extensões específicas que foram sendo criadas para facilitar o desenvolvimento de software (exemplos: EditCSS, JavaScript Debugger, Web Developer, etc., etc.).

Por isso caro blogger, quando mudar o aspecto do seu blog (template, mini-aplicações, cores, fontes, etc.) confirme que o aspecto desejado não é exclusivo do IE. Não queira perder 40% dos seus visitantes e experimente pelo menos como fica o seu blog no FF e no Chrome.

Ainda há dias escrevi cobras e lagartos sobre o Windows Live Messenger. Mantendo o que então afirmara, venho agora tecer um elevado elogio a uma outra aplicação que faz parte do mesmo pacote, o Windows Live Writer (WLW). Caros editores, sejam do Blogger, do Wordpress ou de outro serviço, experimentem que vale a pena.

Ora, então porquê toda esta excitação? Simplesmente porque o WLW resolve-me uma série de problemas com que me tenho deparado nos tradicionais editores online:

  • Colar texto copiado de outros sites com opção de escolha quanto a manter ou remover a formatação. Por exemplo, optando pela opção "Remover Formatação", apenas fica o texto, quebras de linha e links. Com o "HTML Optimizado", fica adicionalmente alguma formatação básica.

    screen 00248 2009-11-19, 20_53_22 screen 00249 2009-11-19, 20_54_21
    Este foi sempre um aspecto que me fez perder imenso tempo ao compor os textos do blog quando queria citar outros textos. Tinha que colocar o texto no notepad (para remover toda a formatação) e depois adicionar os links, bolds, itálicos, etc. etc. Uma canseira. Este cuidado é necessário para não haver HTML mal formado nos posts, o que acaba com frequência por estragar a apresentação do blog.
  • Só pelo aspecto anterior já vale a pena usar o WLW. Mas há mais. Inserir imagens nos posts é sempre uma seca. Implica ter a foto no disco, carregá-la no blog e depois inseri-la no post. Com o WLW é mais simples. Se a foto estiver no disco, pode ser inserida directamente no post; se estiver noutro site, pode ser copiada e colada como se faz num editor de texto, sem necessidade de a guardar em disco primeiro. Tanto num caso como no outro, as imagens carregadas desta forma irão parar ao serviço de alojamento de imagens do blog (por exemplo, no Blogger, as imagens são carregadas para o álbum do Picasa que esteja associado ao blog).
  • Fazer tabelas também fica bem mais fácil. Mas com a funcionalidade de colar especial (ver o primeiro ponto), este aspecto até é secundário, pois a tabela pode ser feita no editor de texto ou na folha de cálculo!
  • O WLW tem uma funcionalidade de álbum de fotografias mas é algo rudimentar. O slide.com faz bem melhor. De qualquer das formas, está à mão de semear. É produzida uma imagem que serve de ante-visão. Quando se clica na imagem é-se levado para uma página do Windows Live (é preciso uma conta no Live, o que é fácil e gratuito).
    InlineRepresentation68fec14a-84fc-4089-9e61-d0c428ba796a[9]
    Note-se que se podem inserir imagens de forma isolada.
  • Finalmente, toda a escrita é muito semelhante a trabalhar num editor de texto, usando a formatação do blog. O post pode ser pré-visualizado antes de publicar, sendo mostrado no contexto do blog. E também se pode editar manualmente o HTML. As restantes funcionalidades são o que se poderia esperar delas, com uma nota negativa para a colocação individual de fotografias: as fotos são publicadas sem link para uma versão de tamanho grande! Mas há volta a dar: usar o plug-in Polaroid Picture.
Instalação
Ir a http://download.live.com/writer, descarregar e instalar o software. As imagens seguintes mostram alguns passos da instalação
screen 00238 2009-11-19, 20_37_38 screen 00239 2009-11-19, 20_40_50
Apenas precisa de instalar o Writer. Os outros componentes, se não os usar, podem ficar de fora. De seguida, optei pode desmarcar todas as opções como se vê na segunda imagem.
screen 00242 2009-11-19, 20_42_48 screen 00243 2009-11-19, 20_43_27
Como o meu blog é no serviço Blogger, escolhi "Outro serviço de blog". O mesmo para quem usar Wordpress. De seguida introduzi as credenciais de acesso a blog.
 screen 00245 2009-11-19, 20_44_10
Nesta pergunta é importante responder "SIM". Dessa forma, o WLW faz uma cópia do aspecto do blog, o que permite tornar a edição mais próxima do resultado final.

screen 00246 2009-11-19, 20_45_10
Finalmente, basta clicar no "Concluir" e está feito.

Plugins
Na página http://gallery.live.com/default.aspx?pl=8 encontram-se alguns plugins disponíveis. Experimentei o Flickr4Live e o Polaroid Picture e gostei.

Conclusão
Finalmente, um bom editor para produzir conteúdos para o blog, sem necessidade de pensar nas questões acessórias de alojamento e de HTML.

Antes de fazer qualquer alteração à template do blog, fazer sempre uma cópia de segurança primeiro. Assim, caso algo corra mal, pode-se sempre voltar a trás. As imagens seguintes mostram os sucessivos passos.

1. Cópia de segurança

Depois de entrar no blog, clicar em Esquema.

Clicar em Editar HTML

Clicar em Transferir modelo completo e gravar o ficheiro.

Está feito! Simples, não é? Pois pouca imenso trabalho quando algo corre mal. Sugestões:

a) guardar as sucessivas cópias de segurança da template, o que permite comparar duas versões;

b) nomear os ficheiros com a data de criação e incluindo-a no início do nome do ficheiro - assim os ficheiros estarão sempre ordenados temporalmente, mesmo que sejam alterados posteriormente. Exemplo: 2009-10-06_a_minha_template.xls

2. Para colocar em uso uma template antiga

Na mesma página onde se fez a cópia de segurança da template, clicar

em browse, escolher uma template antiga, e depois clicar em Carregar.

A nova template será colocada em uso logo de seguida.

No Usuário Compulsivo:

Que tal deixar a sua caixa de comentários incorporada as páginas de postagem do Blogger / Blogspot melhor integrada ao seu template?

Neste tutorial você vai aprender como colocar bordas na mensagem que aparece antes do formulário de comentários. Como deixar a área do formulário de comentários mais larga, igual a largura da coluna das postagens, e como otimizar o cabeçalho da área de comentários. (...)

Conselho que vale ouro

Posted by Mr.Editor 0 comments

image Há tempos, o email de suporte a este blog foi tomado de assalto. Não sei a origem deste ataque mas sei que o email foi usado para enviar um mail de spam a todos os contactos os meus contactos. Ainda para mais, esse mail foi enviado sem BCC, tornando públicos todos esses contactos. Apesar de ser alheio a este abuso, quero deixar na mesma aqui as minhas desculpas pelo incómodo.

Creio que terá sido alguma falha de segurança no Gmail terá sido explorada. Uma vez que não me mexeram no blog, suponho que terá sido "apenas" para mandar spam. Mudaram-me a password e neste momento não tenho acesso a esse email. Só não fiquei também sem acesso ao blog porque, apesar de eu ser o único editor do blog, tinha dois emails associados ao blog, cada qual com permissões de administração.

Deixo aqui aos companheiros de blogosfera um conselho que considero valer ouro: ter mais do que um utilizador do blog com privilégios de administração (podem pertencer à mesma pessoa mas com com diferentes emails).  Apresento a seguir instruções para o Blogger:

  1. entrar no blog e ir à página de administração do blog (http://www.blogger.com/home)
  2. clicar em  Definições
  3. clicar em Permissões
  4. clicar em Adicionar Autores
  5. na caixa "Convide mais pessoas para escreverem no seu blogue", inserir um email seu, diferente daquele que estiver actualmente associado ao blog
  6. clicar em Convidar
  7. entrar no email definido no ponto 5 e abrir o mail enviado pelo Blogger
  8. clicar no link que o mail refere e seguir até ao fim as instruções que o Blogger dará
  9. voltar a entrar no blog mas com o utilizador do ponto 1
  10. repetir os passos 1 a 3 para chegar à página das permissões
  11. clicar "conceder privilégios de administrador" na linha correspondente ao email inserido em 5

A partir deste momento passará a haver dois emails a partir dos quais é possível administrar o blog. Se se perder o acesso a um dos emails, pode entrar no blog com o outro email. Como ambos são administradores do blog, na página das permissões do blog pode remover o acesso a um dos emails.

Boas blogagens.

Este texto apresenta conceitos básicos sobre HTML e sobre a estrutura de templates do blogger, mas sem entrar demasiado pelo informatiquês. Servirá de apoio a à descrição de outras técnicas bloguísticas.

Se não se sente à vontade com o HTML e pretende aprender aprender, recomendo este curso online: http://pt-br.html.net

Conteúdo:

  1. Estrutura de um documento HTML
  2. Conceito de servidor/cliente
  3. CSS e DIV
  4. HTML ou XML?
  5. Estrutura de uma template do blogger
  6. Estrutura dos contentores da template
  7. Conclusão

Estrutura de um documento HTML

Um documento HTML é um simples documento de texto onde se misturam comandos para o browser interpretar com texto como este que está a ler. Genericamente, a estrutura de um documento HTML é a seguinte:


<html>
<head>
.....
</head>
<body>
.....
</body>
</html>


Neste exemplo podemos notar que:




  1. O pontinhos são conteúdo e comandos diversos; o resto são comandos HTML;


  2. Os comandos HTML (chamados de HTML tag ou simplesmente tag) estão contidos entre os caracteres < e >.


  3. Um comando HTML é formado por uma parte de "abertura do comando" (tal como "<html>") e outra de "fecho do comando" (tal como "</html>"). A parte de abertura de um comando começa por "<", seguindo-se-lhe o comando propriamente dito (caracteres até ao primeiro espaço ou até ao sinal ">"), continua com parâmetros específicos do comando e termina com ">". A parte de fecho do comando começa por "</", seguindo-se-lhe os mesmos caracteres do comando de abertura e termina por ">". Assim, os comandos das linhas 1 e 8 formam o respectivo par de abertura e fecho.


  4. Apesar de não mostrado no exemplo, alguns comandos fecham-se a si mesmos, como é o caso do comando que insere uma imagem: <img ..... />. Estes comandos começam "<", segue-se-lhes o comando propriamente dito (caracteres até ao primeiro espaço), continuam com parâmetros específicos do comando e terminam com "/>".


  5. Um documento HTML começa necessariamente com a linha 1 e termina com a linha 8. As linhas 2 a 4 e as linhas 5 a 7 formam os dois blocos principais. O primeiro bloco contém instruções para o browser e o segundo bloco contém o que o browser irá mostrar numa página. Antes da linha 1 deve constar a informação sobre que versão de documento se está a construir, o que é feito com o comando "<!DOCTYPE HTML PUBLIC ..... >".


  6. Há comandos específicos de cada um destes blocos.


  7. Genericamente, os comandos HTML que contenham parte de abertura e de fecho podem ser encadeados uns dentro dos outros, desde que se respeite a ordem "primeiro a abrir, último a fechar" (ver os comandos nas linhas 5 e 7).



Conceito de servidor/cliente



Chama-se cliente ao dispositivo onde o documento HTML será mostrado (o browser, geralmente) e chama-se servidor ao software que corre no computador ao qual se acede por um URL (o http://bloger.com, por exemplo).



Quando se coloca no browser o endereço de um site, o servidor processa o pedido e devolve um resultado. De seguida, o browser recebe o pedido e poderá realizar processamento adicional até que, finalmente, o resultado é mostrado. Exemplo:




  1. no browser digito http://fliscorno.blogspot.com;


  2. ao primir enter, o browser envia ao blogger o pedido da página inicial do blog;


  3. o blogger, que contém os textos dos posts numa base de dados, lê as configurações do blog, pega nos posts a mostrar e mistura-os com a template que estiver em uso. De seguida devolve o resultado ao browser;


  4. o browser pega na resposta devolvida pelo blogger e interpreta a resposta recebida. Além do conteúdo a exibir, entre os comandos podem estar comandos de formatação, de posicionamento e de processamento adicional (com javascript). Havendo javascript a ser processado, o browser executa-o, podendo alterar profundamente a resposta devolvida pelo servidor;


  5. finalmente, o resultado é apresentado ao utilizador.



CSS e DIV



A formatação e posicionamento dos conteúdos de uma página HTML pode ser feita com CSS, colocando o atributo class num elemento HTML. A propriedades definidas por pela classe de uma elemento serão válidas para esse elemento, bem para os que dentro dele estejam (salvo se forem redefinidos, por outra classe ou por formatações específicas).



DIV é um elemento estrutural do HTML e serve sobretudo para definir o posicionamento de conteúdos numa página. Um DIV associado a uma classe permite posicionar os conteúdos e atribuir-lhes formatações específicas.



HTML ou XML?



Um documento HTML é uma particularização de um documento XML. Neste âmbito não entrarei em especificidades mas quem quiser saber mais pode ler aqui: http://pt.wikipedia.org/wiki/Xml



Estrutura de uma template do blogger



Um template do blogger é um documento especial, em formato XML, semelhante a um documento HTML mas com comandos adicionais. Uma template pode ter várias estruturas, sendo os seguintes blocos uma abordagem bastante comum:




  1. Cabeçalho (header);


  2. Área de posts (posts area);


  3. Área de componentes (widget area);


  4. Rodapé (footer).





Nestas imagens (adaptadas daqui) vemos a disposição destes blocos. Também está realçado o facto de as áreas de componentes, frequentemente chamadas de "barra lateral", poderem ter número e posição variáveis. A seguir está uma simplificação do que poderia ser uma template correspondente à primeira imagem. NOTA: esta template não é funcional. Apenas serve para ilustrar conceitos.




<?xml .... ?>
<!DOCTYPE ... >
<html .... >
<head>
<b:skin><![CDATA[/*
#outer-wrapper {
....
}
#header-wrapper {
....
}
#main-wrapper {
....
}
#sidebar-wrapper {
....
}
#footer-wrapper {
....
}
]]></b:skin>
... outras definições ...
</head>
<body>
<div id='outer-wrapper'>
<div id='header-wrapper'>
.....
</div>
<div id='main-wrapper'>
.....
</div>
<div id='sidebar-wrapper'>
.....
</div>
<div id='footer-wrapper'>
.....
</div>
</div>
</body>
</html>


As linhas 1 e 2 classificam a template. Partir de uma template existente e deixá-las como estiverem.



As linhas 3 a 40 são o HTML a enviar para o browser. Contém comandos que serão interpretados pelo blogger antes de enviar a resposta ao cliente.



O bloco head do documento HTML está entre as linhas 4 a 23. Neste bloco é onde se incluem ficheiros de javascript, de CSS e onde se define o CSS estrutural do blog (linhas 5 a 21). O CSS estrutural do blog define um conjunto de classes (contentores) que posicionam os blocos como os das figuras anteriores em locais específicos da página HTML.



Entre as linhas 24 e 39 fica contido o conteúdo propriamente dito do blog (cabeçalho, posts, barra lateral e rodapé). Na figura são mostrados os blocos correspondentes aos da primeira das três figuras anteriores. De realçar:




  • os diversos blocos da template estão contidos entre tags DIV;


  • cada DIV tem uma propriedade "class" que identifica a classe d CSS correspondente. Essa classe está definida no bloco de CSS do head.



Estrutura dos contentores da template

Dentro de cada DIV que formam os contentores da template, existem blocos como os que se seguem:




<b:section ... >
<b:widget id='HTML1' type='HTML' ... >
<b:includable id='main'>
... conteúdo .....
</b:includable>
</b:widget>
</b:section>


As "section" agrupam blocos como por exemplo múltiplas colunas na barra lateral. Dentro de cada uma delas existem "widget" que são a "engenhoca" que mostra os conteúdos da secção. Finalmente, dentro do widget existem "includable" que são os conteúdos propriamente ditos: texto, fotos, javascript, etc.



Os widget aceitam conteúdos específicos em função do seu "type" e têm que ter uma identificação (id) única em toda a template. Esta identificação tem que ser formada pelo type seguindo de um número.



Os widgets podem ser do seguinte tipo:




  • BlogArchive


  • Blog


  • Feed


  • Header


  • HTML


  • SingleImage


  • LinkList


  • List


  • Logo


  • BlogProfile


  • Navbar


  • VideoBar


  • NewsBar



Para uma leitura mais aprofundada, o blogger tem alguma informação disponível (em inglês):





Conclusão



Uma template do blogger é um misto de HTML e comandos interpretados pelo blogger antes de enviar o resultado ao browser. Depois do browser receber uma página do blog, poderá haver lugar a processamento adicional com JavaScript.



As templates são formadas por blocos onde os conteúdos são mostrados. O seu posicionamento e formatação são feitos por CSS.



Criar ou alterar templates é um trabalho essencialmente de pachorra (para identificar os principais blocos da template) e de criatividade (pelo uso de CSS e outras técnicas no design).

Esta é segunda parte de três artigos sobre a forma de ter um ícone dinamicamente associado às categorias escolhidas para cada entrada no blog.

  1. O problema
  2. Implementação (este texto)
  3. Juntando as peças

No primeiro texto abordou-se o objectivo pretendido com estes ícones associados às categorias do post e as limitações do blogger para implementar esta funcionalidade. Neste texto irá ser descrita, de forma genérica, a solução encontrada.

 

(…. sorry, ainda n está terminado)

Este artigo explica como fazer para ter diferentes ícones antes do título

Quem por aqui passa já terá reparado que associado a cada post aparece um ícone e que não é constante. Com efeito, cada conjunto de categorias do blog (labels) está associado a um ícone, o qual é escolhido automaticamente. Assim, quando se cria um post, escolhe-se a categoria para o marcar e plimmmm depois de publicar o respectivo ícone aparece. Mais tarde, se alterar a categoria do post, o ícone mudará em correspondência.

Passo a expôr como implementei esta funcionalidade na template. Dada a extensão do artigo, este será partido em 3 partes:

  1. O problema
  2. Implementação
  3. Juntando as peças

Associar ícones às categorias do post- parte 1/3: O problema

O objectivo

Dizem as regras da boa blogagem, as quais supostamente ajudam a aumentar o número de visitantes, que se deve manter coêrencia no género de conteúdos abordados no blog. Por exemplo, evitar falar dos negócios da política num blog de culinária sob pena disso causar indigestão. A ideia subjacente é que quem vai a um site espera encontrar lá um certo tipo de conteúdos e isso fidelizará o visitante. Pela minha experiência pessoal, sei que assim é. E se não se quiser ter vários blogs para malhar em áreas diferentes conforme a pachorra do momento? Claro que para o visitante poderá ser algo frustrante, daí que optei por facilitar a identificação visual dos conteúdos pelo uso de um ícone que esteja relacionado com a categoria do post. Já agora, na mesma linha da separação da separação de conteúdos, também abordarei noutro artigo a forma de ter um feed por cada categoria.

As limitações do Blogger

Olhado para uma template genérica, vemos que a parte onde as categorias são mostradas é esta (ir a Layout | Edit HTML | Download Full Template e abrir o ficheiro XML descarregado):

<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>


Mais à frente explicarei este pedaço de código mas por agora basta verificar que existe um clico (loop) dentro do qual são listadas as categorias associadas ao post.



Portanto, para ter um ícone diferente para cada post, bastaria olhar para cada categoria e decidir sobre o ícone a usar. Algo assim:



<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
IF categoria = gracinha THEN
usa o ícone da gracinha
END IF
</b:loop>


O problema desta abordagem está no facto de o Blogger não ter o bloco IF ... THEN ... ELSE!



A solução



Como resolver então o problema? O truque que encontrei para contornar este problema foi:




  1. parte do processamento é feito pelo Blogger


  2. a parte restante é feita pelo browser ao receber a página.



Assim, na template do Blogger coloquei comandos para gerar um javascript. Este script é depois interpretado pelo cliente (o browser) para escolher o ícone certo a apresentar.



Na próxima parte deste artigo detalharei a solução implementada. Entretanto, se a curiosidade apertar, experimente ver o código fonte desta página e olhe para o script gerado (procure o texto "var all_labels")

Twitterfeed

Posted by Mr.Editor 0 comments

O http://twitterfeed.com é um serviço para lançar os posts do blog no Twitter. Para ver o resultado, dar uma olhada no meu Twitter: http://twitter.com/hitech_tips É um serviço que uso há algum tempo e é de tal forma transparente que agora, querendo recomenda-lo, precisei de fazer uma busca no Google para encontrar o respectivo site.

Yahoo Pipes

Posted by Mr.Editor 0 comments

image Os Yahoo Pipes, ou numa tradução livre, a Tubagem do Yahoo, é uma tecnologia com dois anos, lançada em Fevereiro de 2007. É uma interessante ferramenta para agregar, manipular e misturar conteúdos dispersos pela web, produzindo uma única saída. Tal como nos canos de água, em que vários tubos se vão unindo, com torneiras selectivas, para formar uma conduta única. Acresce que é uma tecnologia ao alcance de todos, mesmo para pessoas sem formação específica em informática.

Há vários vídeos a demonstrar o uso do Yahoo Pipes, seja no Youtube, seja no próprio Yahoo Pipes. Mas o melhor mesmo é vê-los em acção. Por exemplo, a pesquisa http://pipes.yahoo.com/pipes/search?q=flickr+blogger&x=0&y=0 devolve Pipes que usem o Flickr e o Blogger para juntar dados e mistura-los num único RSS. Em particular, este Pipe http://pipes.yahoo.com/pipes/pipe.info?_id=sqpS5Mzy3BGLF4Jz8jxBKg cria um slideshow com imagens obtidas num mashup do Google Reader composto por feeds do Flickr e do Picasa.

Por aqui, estou a usar os Pipes na nova template para este blog. Isso inclui filtrar os conteúdos para os agrupar por labels e juntar a bonecada do Flickr num misto de slideshow e textos do blog. Voltarei ao assunto quando a template sair.

Followers