Reino Kawaii

Quem tem blog e curte personalizar deve ter entre seus favoritos sites que ensinam truques diversos para deixar o visual do jeitinho que a gente quer. Muitos desses sites oferecem códigos, às vezes, enormes para copiar, alguns até dão opção de copiar dentro da caixinha de código, como quem usa SyntaxHighlighter, outros não. Nesse tutorial vou mostrar como você pode adicionar a opção copiar código em qualquer site usando a extensão CodeCopy para navegadores.

Apenas você em seu navegador vai visualizar esse botão de copiar códigos, como na screenshot da minha tela do blog abaixo:

Primeiro, acesse o link do desenvolvedor da extensão: Zenorocha. Lá você encontrará os links para instalar a extensão no Chrome ou no Firefox. Eu uso o Chrome, vou mostrar como se faz nele então.
Baixe o arquivo zip do desenvolvedor (clique no botão verde Clone or download), descompacte e abra a pasta dist. Dentro dela há um arquivo com nome manifest.json.
Em um editor HTML, como Notepad++ por exemplo, abra esse arquivo. Abaixo de matches estão listados todos os sites que a extensão tem acesso para copiar códigos. Se quiser acrescentar qualquer um, basta digitar o link como na imagem abaixo:

Como eu quero copiar códigos dos posts aqui do blog, adicionei meu link. Salve o arquivo.
No Chrome, digite na aba de endereços: chrome://extensions/
Todas as extensões instaladas no seu navegador estão aí. Clique em Modo do Desenvolvedor e depois em Carregar Extensão Expandida. Procure pela pasta codecopy-master e depois dist e clique em Ok.

Pronto! Visite o site que tenha os códigos que deseja copiar adicionado por você em manifest.json e veja que, quando posicionar o mouse sobre alguma caixa de código, a opção de copiar aparece; basta clicar e colar onde quiser o conteúdo copiado.
Se quiser, ainda há como mudar a cor do botão copiar, do ícone e do tooltip, até mesmo os textos; para isso, altere em um editor HTML os arquivos main dentro da pasta styles, mudando as cores que vêm (backgrounds ou color), e main dentro da pasta scripts.
Por exemplo, para mudar a cor do ícone de copiar, acrescente ao código main (dentro de styles) o que destaquei abaixo:

E para deixar o texto diferente no arquivo main dentro de scripts:

Lembrando de salvar os arquivos e carregar a extensão no chrome sempre que alterar alguma coisa.
Há como mudar as imagens da pasta images dentro de dist também, elas devem ter o mesmo tamanho e formato (png) das que já vem na extensão.

Depois de tudo pronto, quando você abrir seu navegador verá uma mensagem dizendo que a extensão editada por você no modo desenvolvedor pode ser prejudicial e blalala... se essa mensagem te incomodar, vá em chrome://extensions/ - Modo do desenvolvedor - Compactar extensão... selecione a pasta dist e clique em Compactar extensão.
Será criada uma nova extensão chamada dist.crx. Arraste-a para o chrome, que vai instalar sua versão do Codecopy no navegador. Delete ou desative a outra que você editou anteriormente e deixe essa ativada, marcando a opção Permitir acesso aos URLs do arquivo.
Agora fica bem mais fácil copiar qualquer código de seus sites favoritos!