Usando CSS externo no Blogger

Para reduzir o tamanho de carregamento do seu blog, um passo importante é usar o CSS em um arquivo separado do HTML total do blog.

Mas por quê?

Digamos que um visitante entra no seu blog pela primeira vez: seu blog demorará certo tempo para carregar. Se ele entra pela segunda vez, as imagens já estarão carregadas, mas o HTML é carregado novamente.
No Blogger, o CSS é integrado no HTML. Ou seja: toda vez que o visitante entra, tem que carregar o CSS. Mas, se for hospedado externamente, só será carregado uma vez, como as imagens.

Prós e contras

Se você não fica sempre mudando o seu template, é uma ótima escolha. Mas se você é daqueles que não conseguem deixar o esquema de cores do seu blog em paz, é melhor você nem seguir essas dicas.

Antes de começar, lembre-se: após fazer isso, não será possível mudar o esquema de cores pelo Painel do Blogger (Layout -> Fontes e cores).

Sem mais enrolação, vamos ao tutorial:

> Hospedando CSS e colocando no Blogger

1 - Faça todas as modificações de cores necessárias antes de começar. Também faça um backup do seu template.
2 - Entre em seu blog e vá em “Exibir -> Código Fonte” (ou aperte Ctrl+U, exceto no IE). Aparecerá algo assim (varia de acordo com o template):

3 - Copie o conteúdo depois de:

Início do CSS - Clique para ampliar

E antes de:

Fim do CSS - Clique para ampliar

4 - Abra o bloco de notas e cole o código copiado

5 - Em “Arquivo -> Salvar como”, selecione “Tipo” como “Todos os arquivos (*.*)” e nomeie o arquivo como style.css (ou qualquer outro nome, só não esqueça do ‘.css’ no fim do nome)

Salvando o CSS pelo Bloco de Notas - Clique para Ampliar

6 - Vá no FileDen e crie uma conta. Lembre-se de abrir sua caixa de e-mails e clicar no link de confirmação.

7 - Após ter sua conta confirmada, clique em “Upload” e envie o arquivo criado.

Fazendo o Upload

8 - Após concluir o envio, selecione a opção “Direct URLS” e copie a URL:

Copiando a URL direta do CSS

9 - Vá até a parte de edição de HTML do Blogger e exclua do <b:skin> ao </b:skin>

10 - Coloque isso no local do que você excluiu:

<link href='URLDOSEUARQUIVO' rel='stylesheet' type='text/css' />
<b:skin><![CDATA[ ]]></b:skin>

Lembre-se de trocar URLDOSEUARQUIVO pela URL que você copiou do FileDen

11 - Visualize para ver se está tudo certo e salve. Se deu errado, tente começar de novo, pois  você fez algo errado.

Observação:
O FileDen tem um limite de tráfego mensal de 5GB. Isso significa que, se você hospedar apenas um arquivo CSS de 10KB, você terá o suficiente para um blog de 15.000 visitas diárias.