Bookmarklet Microformats

Por: Henrique C. Pereira

Publicado em Tuesday 30 January 2007 às 11:19

Categoria: HTML/CSS/JScript

Microformats é uma coisa que com certeza está fazendo minha cabeça! Navegando por ai encontrei um parser de microformats que varre seu HTML em busca dehCard e hCalendar quando você clica no bookmarklet que você vai colocar no seu browser. Como resultado ele mostra uma tela com os ítens encontrados e permite você selecionar o ítem que quiser e converter/exportar para .vcf (formato vcard) e .ics (formato icalendar) para ser importado por seu programa favorito!

Um bookmarklet (também conhecido como favelets) é um script pequeno que pode ser armazenado em uma url em um bookmark no seu browser (ou em um hyperlink no seu site) e que pode ser ativada apenas com um click! Para adicionar o bookmarklet microformats no seu browser (Firefox, Opera e Safari), basta inserir um item na navigation toolbar e adicionar o seguinte script:


javascript:if%20(!document.getElementById('MF_jq'))%20{var%20q=document.createElement('script');q.setAttribute('id',%20'MF_jq');q.setAttribute('src',%20'http://leftlogic.com/js/jquery.js');document.getElementsByTagName('body')[0].appendChild(q);}%20var%20s=document.createElement('script');s.setAttribute('id','MF_loader');%20s.setAttribute('src',%20'http://leftlogic.com/js/microformats.js');document.getElementsByTagName('head')[0].appendChild(s);void(s);

Ou então pressione o botão do mouse e arraste o link abaixo para a mesma navigation toolbar:

Microformats

Para encontrar microformats teste no meu site por exemplo. E se quiser ver uma página com vários hCard e vários hCalendar implementados, visite este site que possui vários trechos dessas duas especificações. Lembre-se que quanto maior for o HTML, mais o script demora para varrê-lo todo atrás de microformats. Por isso pode haver um pequeno delay.

Por causa da forma como este script foi desenvolvido ele não funciona em sites com o mime-type application/xhtml+xml. Faça o teste no Adactio por exemplo. Eu tive que trocar o mime type do meu próprio site para text/html para poder funcionar e escrever este texto. Eu já entrei em contato com o autor do script e dei este feedback a ele. Se alguém quiser pegar os scripts dele e tentar alterar de forma que funcione em sites application/xhtml+xml tanto quanto text/html, sinta-se á vontade! Darei os créditos aqui e tenho certeza que o cara do Left Logic fará o mesmo.

Este bookmarklet foi criado por Left Logic

Comentários dos leitores

Este artigo possui 4 comentários

  1. andre Tuesday 30 January 2007 às 14:01

    uma extens'ao do firefox pra detectar microformats…

    http://labs.mozilla.com/2006/12/introducing-opera…

  2. Rafael Oliveira #1° Thursday 01 February 2007 às 23:53

    Legal, já adicionei o bookmarklet aqui no meu FX. =)

    Além da Operator, que o andre citou acima, tem também a Tails.
    http://www.codeeg.com/tails/tails-0.3.7.xpi

    Té.

  3. William Grasel Marti #2° Friday 02 February 2007 às 13:36

    fiquei curioso para saber qual é esse tipo de microformats que você cita com o nome "dehCard" … hehehe

    brincadeiras a parte, concordo com suas opiniões sobre os benefícios desses padrões e a adoção deles! Esses scripts que manipulam eles são apenas exemplos de algo muito maior que esta por vir!

    por ultimo gostaria de falar sobre a borda dos campos de comentários do seu blog, em alguns monitores que são mais claros (como o "HP L176v" que estou usando agora no trabalho) elas se tornam quase invisível mesmo aumentando o contraste e etc. Seria interessante se fossem um pouco mais escuras.

    Abraços!

  4. riproliossy #3° Friday 06 January 2012 às 06:10

Deixe seu comentário:

Observação: Todos os campos obrigatórios estão marcados com um asterisco (*).

  1. As seguintes tags podem ser inseridas nos comentários: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Sobre este blog

Meu nome é Henrique C. Pereira e o Revolução Etc é o meu blog pessoal. Eu trabalho com design de interfaces, dispositivos móveis, planejamento de soluções web, arquitetura da informação, programação de interfaces, acessibilidade, padrões web, e-commerce e outras coisas relacionadas.
Leia mais sobre o autor.