Botões com efeitos de foco sutis para Blogger

Olá e bem-vindo ao Mult-focos. Neste post trazemos um tutorial de como fazer botões com efeitos de foco sutis para Blogger.
 Veja um demo clicando no botão abaixo ou em Result no Box de códigos.
DEMO Como adicionar em seu blog

• Copie o código CSS do Box de códigos Vá ao painel do Blogger->modelo->editar HTML->use Ctrl+F e localize]]></b:skin>
• Acima desta tag cole o código CSS 

Próximo passo

• Ir para o painel do blogger->layout Clique em Adicionar um Gadget. 
• Na janela Adicionar um gadget->HTML/JavaScript. 
• Copie o código JS abaixo e cole-o dentro da caixa de conteúdo.
• Salvar o gadget. Arraste o gadget e reposicione-o onde você quer mostrá-lo. 
• Clique no botão Salve (canto superior direito).

OBS: Você pode usa-lo em um post também.

Configuração

Onde esta escrito Mult-focos mais a seta, é só substituir pela palavra que desejar.

Você pode também mudar a cor de fundo, é só substituir (#1F3A93) e a cor que cobre a cor de fundo, substitua (#1E90FF).

Isto é tudo.

<button class='btn btn--left'>
  <span>Mult-focos→</span>
</button>

<button class='btn btn--right'>
  <span>Mult-focos←</span>
</button>

<button class='btn btn--up'>
  <span>Mult-focos↑</span>
</button>

<button class='btn btn--down'>
  <span>Mult-focos↓</span>
</button>

See the Pen Botões com efeitos de foco sutis para Blogger by Mairink (@Oemes) on CodePen.

---

---