Como colocar cursor do mouse no blog personalizado
Amores eu trago mais um tutorial, vou explicar como personalizar ou mudar o curso do mouse do seu blog, vocês vão ver como é super fácil e rápido. Antes de mais nada esse tutorial foi testado, eu usava o cursor personalizado no meu antigo blog. Eu trouxe o tutorial em duas formas a primeira "Adicionando um Widget" e a segunda adicionando diretamente no HTML do designe do seu blog. Vamos aprender?!
1° Modo: Vá para o seu Blogger e clique em Layout > Adicionar um Widget > HTML/JavaScript.
No espaço em branco cole o seguinte código:
<style>HTML,BODY{cursor: url("URL DA IMAGEM"), auto;}</style>
Onde esta escrito "url da imagem" cole o link da imagem do cursor que você deseja. 2° Modo: Acrescentando diretamente no html do designe do seu blog.
Agora vá no painel do seu Blogger > Designer > Editar HTMl e aperte Ctrl+F e pesquise <head>, cole o código abaixo depois da tag encontrada.
<style type="text/css">body, a:hover {cursor: url(http://ani.cursors-4u.net/cursors/cur-11/cur1089.cur), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2012/06/24/s-pink-premium-pointer.html" target="_blank" title="S Pink Premium Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="S Pink Premium Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>
Depois exclua do código acima, toda a parte que fica depois de </style>
<a href="http://www.cursors-4u.com/cursor/2012/06/24/s-pink-premium-pointer.html" target="_blank" title="S Pink Premium Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="S Pink Premium Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>
Agora, aperte Ctrl+F e pesquise </head>, cole o código do cursor antes da tag encontrada e da mesma exclua toda a parte que fica depois de </style>
No site http://www.cursors-4u.com/ tem vários modelos de cursores de mouse clique em cima do seu preferido e cole o código que será gerado.
Uma dica: Se você quiser usar um cursor personalizado do site que eu citei acima, mas não quer acrescenta-lo diretamente no HTML do seu template então é, só você copiar o url da imagem do cursor do código gerado.
<style type="text/css">body, a:hover {cursor: url(http://ani.cursors-4u.net/cursors/cur-11/cur1089.cur), progress !important;}</style><a href="http://www.cursors-4u.com/cursor/2012/06/24/s-pink-premium-pointer.html" target="_blank" title="S Pink Premium Pointer"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="S Pink Premium Pointer" style="position:absolute; top: 0px; right: 0px;" /></a>
A Url da imagem é toda essa parte que está entre cursor: url( e ), progress !important;
http://ani.cursors-4u.net/cursors/cur-11/cur1089.cur
Você copia e acrescenta no código do html do 1° modo. Se tiverem dúvidas é, só perguntar que eu respondo, beijos de luz a todos!
8 Comentários
Vou usar no meu blog, super amei! ^^
ResponderExcluirotima dica pra quem tem blog
ResponderExcluirVou por no meu blog são lindos amei valeu ! :)
ResponderExcluiramei, tão fofos
ResponderExcluirQue fofis
ResponderExcluirInteressante e que bom que vc resolveu compartilhar isso com agente, eu sempre quando entro nos blogs tem os cursores de mouses personalizados .. !
ResponderExcluirlegal e vi q vc usa no blog aqui
ResponderExcluirEu estou pensando em fazer um, amei essa dica :D
ResponderExcluir