Você vai aprender o jeito mais fácil de criar extensões para FireFox. ;)

O que são scripts do Greasemonkey

São JavaScripts[bb] que podem ser adicionados em páginas específicas para adicionar novas funcionalidades. Por exemplo: mudar a cor de fundo dos links com rel="nofollow" para amarelo.

Bora criar uma extensão

Vamos usar o exemplo acima de colorir o fundo dos links com rel="nofollow".

  • Abra o User Script Compiler.
  • Em Creator Name, coloque seu nome.
  • Extension home page, seu site.
  • Extension version, 1.0.
  • Firefox min version, deixe como está.
  • Firefox max version, coloque 3.*.
  • Em User Script, cole o seguinte código:

</p>

// ==UserScript==

// @name Nofollow Highlighter

// @namespace http://pedromenezes.com

// @description Script de exemplo para colorir o fundo dos links com rel=”nofollow”

// @include *

// ==/UserScript==

var links = document.getElementsByTagName(’a')

for (x=0; x < links.length; x++)

if (/nofollow/ig.test(links[x].getAttribute('rel'))) links[x].style.backgroundColor = '#FF0'

</blockquote>

Os comentários (as linhas que começam com //) serão o nome da extensão, descrição, endereço da página da extensão e conterão as páginas que o script será executado ou não.

Para saber mais sobre esses comentários, leia o Dive Into Greasemonkey.

  • Clique em Compile.
Sua extensão está pronta!</p>

Como usar a extensão

  • Baixe-a.
  • Aperte Ctrl+o ou vá em Arquivo > Abrir Arquivo.
  • Abra o arquivo da extensão e instale-a.
  • Reincie o FireFox.
No Follow Highlighter</p>

Essa é sua extensão!

Agora é só testar. Abra um post do PedroMenezes.com e olhe os nomes das pessoas que comentaram. Os links estão com rel="nofollow".

Exemplo da extensão para FireFox

Extensão em funcionamento.

Viu? Não foi tão difícil.

Brinque um pouco aí, compartilhe idéias de extensões ou envie para o site oficial de extensões para FireFox.

Curtiram esse tutorial?

Diga o que gostou, o que pode melhorar, dê idéias ou fale qualquer coisa pelos comentários. :)