A Dona do Pedaço

Feeds RSS
Feeds RSS

sexta-feira, 26 de fevereiro de 2016

Passo à Passo - Ferramentas

Oi pessoal! Hoje eu quero mostrar para vocês umas ferramentas para facilitar a divulgação do seu site, blog e qualquer página em geral. Após muito caçar dicas por aí, eu consegui criar a minha própria logo de divulgação do blog e também achei uma barra de compartilhamento para redes sociais. Eu vou ensinar como acrescentar isso usando como exemplo o Blogger. Depois das mudanças que o Blogger passou, muitas pessoas com templates personalizados devem estar achando dificuldade em acrescentar os códigos em HTML/JavaScript, por isso eu quero ajuda-los.
Primeiramente, para quem não sabe ou sentir interesse em saber mais, eu vou deixar aqui o link de um site, chamado DevMedia, que fornece um guia de explicação sobre o hipertexto (HTML) e o JavaScript. Agora, como usar aqui? É bem simples; vejam:

1º passo -> Entre com seu e-mail e senha no site Blogger.com.
2º passo -> Se você já tiver um blog, encontrará no seu painel três botões ao lado do nome dele. Clique em cima da seta do botão do meio e escolha a opção Layout.


3º passo -> Clique em Adicionar um Gadget e na janela pop-up que abrir adicione o gadget HTML/JavaScript.



4º passo -> Na nova janela, escreva o título que quiser e acrescente o código logo abaixo.


Agora vamos aos códigos. A primeira ferramenta é a Barra de Compartilhamento, que dá aos seus visitantes a opção de compartilhar o blog em várias redes sociais e outras páginas. O código é este:


<a class="a2a_dd" href="http://www.addtoany.com/share_save"><img alt="Share" border="0" height="16" src="http://static.addtoany.com/buttons/share_save_171_16.png" width="171" / /></a> <br /><script src="http://static.addtoany.com/menu/page.js" type="text/javascript"></script> <br /><!-- Lockerz Share END -->

A logo para seu blog já é um pouquinho mais difícil de fazer. Siga os passos:

1º passo -> Crie a imagem da sua logo para o blog. Eu vou indicar as páginas CoolText ou Textanim.
Na primeira você escolhe sua logo, então escreva o texto que quiser, altere cor, tamanho e demais características. Clique no botão Create Logo e entre com seu e-mail e senha para gerar o código no link Get HTML Code. Aceite os termos exigidos para pegar o link, mas o endereço que você deve pegar está abaixo de Permanent Image Address. Logo mais eu explico a razão.
Na segunda página você pode fazer as alterações que quiser também, mas as opções de animação são apenas no fundo colorido dentro do texto. Ao finalizar as modificações, aperte no botão Generate e em seguida em Get the embed code. Abrirá uma janela pop-up que te levará a salvar sua imagem e publicá-la em quatro opções de sites, onde você pode acessar com uma conta do Facebook ou do Google se quiser. Isso é necessário para pegar o endereço da imagem.
2º passo -> Você vai copiar o código abaixo, colar na janela HTML/JavaScript que abriu e substituir algumas partes:
<div align="center"><a href="http://ficsdosanimes.blogspot.com.br/"><img alt="§ Fãnime § - O Blog das Fanfics" border="0" height="100" src="http://images.cooltext.com/4604680.gif" title="§ Fãnime § - O Blog das Fanfics" width="200" / /><br /></a></div>

Parte 1 – No trecho “http://ficsdosanimes.blogspot.com.br/”, substitua pelo endereço do seu blog dentro das aspas.
Parte 2 – Nos trechos “§ Fãnime § - O Blog das Fanfics”, substitua pelo nome do seu blog dentro das aspas.
Parte 3 – No trecho http://images.cooltext.com/4604680.gif”, substitua pelo endereço da imagem que você criou dentro das aspas.
Parte 4 – As numerações (height="100", width="200") são para alterar largura e altura da imagem. Pode modificar como quiserem dentro das aspas.

3º passo -> Enquanto as alterações forem sendo feitas, pode visualizar os resultados apertando em Formato Rich Text ou Editar html na janela com o código. Depois de terminar as alterações, salve e veja como ficou. A logo que você criou deve aparecer, e ao passar o mouse por cima dela poderá ver o nome do seu blog; ao clicar nela, deve direcioná-lo para o endereço do seu blog.


Então, é isso pessoal. Espero que tenham gostado desta dica. Se tiverem dúvidas, perguntem nos comentários, e se quiserem outra matéria de Passo a Passo é só pedirem, ok?! Beijos.

0 comentários:

Postar um comentário