Hospedar arquivos no Gist e importá-los no Blogger

Postado por em

Códigos CSS e JavaScript muitas vezes são úteis para a customização de um blog, mas deixá-los diretamente no código fonte, junto com todo o restante do blog pode acabar poluindo ou dificultando a organização do código. Para nos ajudar a "tirar" estes trechos de códigos do nosso fonte, podemos hospedá-los em alguns sites, como o Gist ou o GitHub, e fazer a importação deles dentro do nosso código.

Aprenda a hospedar estes arquivos no Gist e a como utilizá-los em seu blog com este tutorial.

Criando uma conta

Para criar uma conta no GitHub e no Gist, você deve acessar esta página e clicar em "Sign Up" ou "Inscrever-se". Criando uma conta, você pode utilizá-la tanto no GitHub quanto no Gist. Caso ele peça para você criar um repositório ou algo do tipo, não faça ainda. Por enquanto, você precisa apenar criar uma conta e logar.



Hospedando e importando arquivos no Gist

O Gist é ideal para a hospedagem de arquivos CSS ou JavaScript (JS), você pode acessá-lo clicando aqui.

1 Primeiramente, estando logado, clique no canto superior direito no símbolo de "+" para criar um novo arquivo.

Criar novo arquivo no Gist

2 Após isso, insira uma breve descrição, o nome com arquivo com a extensão (como por exemplo estilos.css) e o código de fato.

Preencher informações do arquivo Gist, como descrição, nome do arquivo e conteúdo

3 Para salvar, clique no botão de criar e selecione a opção "Criar gist público" e em criar novamente (que vai ser a opção do botão verde).

Selecionar opção de Criar Gist público

4 Com o arquivo criado, você irá para uma tela parecida com esta.

Exemplo de visualização de arquivo criado

5 Clique em "Raw", do perto do nome do arquivo, e copie o link da guia que será aberta.

6 No Blogger, vá em Tema > Editar HTML > Clique na caixa de código e aperte Ctrl + F ou F3 > Procure por </head> > Cole o seguinte código acima:

Para códigos CSS: <link href='LINK_DO_GIST' rel='stylesheet'/> Para códigos JavaScript: <script src='LINK_DO_GIST'/>

7 Antes de salvar, apenas faça a troca de gist.githubusercontent.com por gistcdn.githack.com. Isso fará seu arquivo ser importado corretamente no Blogger.

8 Salve.

Sempre que houver alguma alteração no código do arquivo, o link deve ser atualizado.

Comentários

Postar um comentário

Fique à vontade para interagir e tirar dúvidas.
• Peça tutoriais em Contato
• Você pode usar as tags negrito (<b>), itálico (<i>) e links (<a>)
• Comente com o link do seu blog para que eu possa visitá-lo ♪(^∇^*)