Colocando os comentários na mesma página

Para quem conhece o serviço do blogger/blogspot sabe que o modo como ele faz os post sabe que desanima qualquer um! Então vamos interferir nisso! Vamos usar como o WordPress, os comentários abaixo dos posts.

1. Vá ao site http://www.haloscan.com/ e faça seu cadastro;
2. Depois de cadastrado, clique em "Template" para escolher um modelo de pop-up para seu blog. Se quiser personalizar mais a fundo, clique em "Settings";
3. Feito os 2 passos, clique em "Install" e escolha o tipo de seu blog. Nosso caso é o blogger/blogspot, vai ser bem rápido e fácil! Clique em "Next";
4. Nessa janela, você terá de baixar seu código completo e fazer upload (mandar o arquivo do seu computador pra rede) no site do Haloscan. Complicou? Ok, vamos passo a passo:

1. No painel principal, clique em "Layout" e depois "Editar HTML",
2. Existe a opção "Baixar modelo completo". Faça isso;
3. Volte ao site do Haloscan e faça upload do código que você acabou de baixar;
4. O Haloscan vai gerar um novo código pra você. Faça download dele;
5. Ultimo passo! Volte ao seu blogger, faça upload do código gerado pelo Haloscan e salve.

UFA! Depois de tantos uploads e downloads enfim acabamos! Perceba que agora quando você clica em "comentarios", aparece um pop-up ao invés de ser redirecionado para outra página.

Pagerank - Quem aponta para você?

O Pagerank é uma ferramenta do Google que mostra quantos links apontam para seu site, por isso, se quer aumentar seu rank, divulgue-o!

Para colocar no seu site é bem simples, vamos utilizar o site www.googlando.com.br para dar um auxílio. O serviço não precisa de cadastro.

1. Acesse o site http://www.googlando.com.br/meu-pagerank/
2. Escolha como quer que seja exibido e copie o código referente;

Se estiver com preguiça, usa esse, mas no site tem mais :)

<br /><br /><a href="http://www.googlando.com.br" target="_blank"><img src="http://www.googlando.com.br/pagerank/pagerank.asp?tipo=f" alt="Meu PageRank" border="0" /></a><br />

Exemplo

3. No painel, clique em "layout";
4. Escolha "Adicionar elemento a página";
5. Selecione HTML/JavaScript;
6. Cole o código e salve.

Simples não?

Creative Commons - Atribuindo uma licença ao site

Uma Creative Commons é uma licença que você diz como seus artigos podem ser reproduzidos pelas outras pessoas. Diferentemente da GPL (GNU Public License), ela pode conservar alguns direitos que você deseje, como: documento pode ser copiado, editado, distribuído porém não pode ser usado para fins comerciais. É possível!

1. Acesse o site www.creativecommons.org/
2. Clique em "License Your Work" no canto superior direito da janela;
3. O site fará perguntas, como por exemplo: "permitir uso comercial de sua obra?" e "Permitir alterações na sua obra?". Responda as perguntas e clique em "Escolha ma licença";
4. Escolha qual ícone lhe agrada e copie o código disponível.

Caso queira uma em que a restrição é apenas ao uso comercial, ta aé:

<br /><br /><a rel="license" href="http://creativecommons.org/licenses/by/2.5/br/"><br /><img alt="Creative Commons License" style="border-width:0" src="http://i.creativecommons.org/l/by/2.5/br/80x15.png" /><br /></a><br /><br />Esta obra está licenciada sob uma<br /><a rel="license" href="http://creativecommons.org/licenses/by/2.5/br/">Licença Creative Commons</a>.<br />

exemplo:

DICA:
Para incorporá-lo no rodapé da sua página sem que seja um gadget, ao invés de "adicionar um elemento a página", vá em "Editar HTML".
Não se assustem! Esse é o esqueleto de seu blog. Lá em baixo do código, procure pela tag < /body> e cole o código da Creative Commons acima dele e salve.

Inserindo uma barra de buscas

Clique em "adicionar um elemento a página";
Escolha HTML/JavaScript;

Cole esse código;

<br /><div align="'center'"><br /><br /><form id="searchform" action="http://SEUBLOG.blogspot.com/search" name="searchform" method="get"><br /><input id="s" value="" name="q" type="text"><br /><input id="searchsubmit" value="Buscar" type="submit"><br /></form>

Leia-o, requer personalização:

Onde consta SEUBLOG, substitua pelo nome de seu blog;
Onde tem escrito Buscar, na tag value, é como estará escrito dentro do botão de busca. Edite como quiser e salve.

Prontinho, sua barra de buscas irá retornar seus resultados como se eles fossem um marcador.

Inserido um tradutor no seu blog

Colocar uma ferramenta de tradução ao seu site é uma ótima maneira de atrair visitantes e seu site ainda pode ser tornar uma referência entre seus amigos. Como fazer? Vamos lá!

1. Clique em "adicionar elemento a página";
2. Cole esse código:

<br /><br /><script src="http://gmodules.com/ig/ifr?url=http://ginorenardus.googlepages.com/babelfish.xml&synd=open&w=270&h=200&title=&lang=pt-BR&country=ALL&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script><br />
3. Salve e posicione onde quiser!

Prontinho! Mais uma super função adicionada!

Inserindo um álbum do Picasa

Primeiramente, é necessário uma conta no Picasa. Acredito que a sua conta do Google lhe ajude a resolver isso.

1. No site do Picasa, crie uma conta caso não possua;
2. Carregue as fotos no site clicando em "Fazer upload de fotos" na parte superior direita da janela;
3. Crie/selecione um álbum e carregue as fotos desejadas e inicie o upload;
4. Com as imagens carregadas, vá no álbum e no canto inferior esquerdo, clique em Criar link para esse álbum. Ele irá gerar dois códigos em HTML. Usaremos o segundo, "Incorporar em um site". Caso queira inserir dentro do texto, apenas cole no meio do texto, mas se quiser que ele fique ao lado, podemos fazer daquele jeitinho:

4.1 Adicionar elemento a página;
4.2 HTML/JavaScript;
4.3 Copie o código cedido pelo Picasa e cole nessa janela. Salve.

Só isso :D

Cavaleiros do Zodiaco

Boa sorte!

Inserindo um contador de visitas ao seu site

Esse serviço é muito variado, pois exige que você crie uma conta em um site de disponibilize esse serviço. Vamos usar nesse exemplo o Histats.com (http://www.histats.com/es/).


1. Crie uma conta no site
2. No painel de controle, clique em Agregar sitio web/blog
3. Responda as questões, são fáceis. Continue
4. Escolha o tipo de contador. Existem vários modelos diferentes, dos bais chieiros ao mais discretos, como invisíveis. Escolha e prossiga. Ele irá gerar seu contador em 20 segundos.
5. Com seu código gerado, vamos inserir-lo do mesmo modo que a barra de buscas:
Adicionar elemento a página > HTML/JavaScript;
copiar o código, cola no elemento da página e salvar.

Beleza! mais um gadget na nossa página! Agora é só colocar onde queremos "arrastando" o gadget na página "Editar Layout".

Inserindo o Google Maps

Simples demais! As ferramentas do Google são perfeitas quando o assunto é acessibilidade Queria que o ONID tivesse esse serviço, Seria PERFEITO! Vamos lá, é muito very easy:

1. Abra o site do google Maps (maps.google.com/);
2. Localize o local que deseja que seja apontado;
3. Escolha como deseja que seja visualizado:
MAPA: Apenas o nome das ruas ;
SATÉLITE: Foto de satélite e nome da rua(possui limite de altura)
TERRENO: Elevações do relevo, não recomendado.

Com seu ponto focado, clique com o botão direito do mouse e escolha a opção "Centralizar mapa aqui";

4. No lado direito sobre o mapa, clique em "Criar link para esta página" e depois, no rodapé do pop-up que abriu, clique em "personalizar e "visualizar mapa imcorporado"

O Tamanho é ajustável de acordo como queiras. Como nesse exemplo vamos inserí-lo ao lado direito do nosso blog, vamos utilizar mais altura do que largura.
Defina largura 250 e Altura 600, e copie esse código.

Volte ao seu blog, clique em "adicionar um elemento a sua página" e escolha HTML/JavaScript e cole dentro do campo. Salve.


Se quiser editar diretamente a largura e altura no código-fonte, procure pelos termos:
width="largura desejada"
height=altura desejada"

No final deste código, existe também um link para exibir o mapa ampliado. Lá no finalzin, procure pelo texto "Exibir mapa ampliado", e mude para o que você quiser! Eu utilizo "Ampliar?", hehe, economia de caracteres :D.

A depender do seu layout e a resolução do seu monitor (sim, isso também é problema nosso!) a largura do mapa pode sair cortada.caso fique faltando aparecer algo, clique em um icone "Editar" é um ícone com duas ferramentas (chave de fenda e uma outra q esqueci o nome hehe)

Procure no código fonte pelas aquelas palavras que vimos acima, width para editar a largura e height para editar a altura. A unidade de medida que é utilizada é o pixel (menor elemento em um dispositivo de exibição[no caso, seu monitor]) reduza/aumente a qtde de pixels para que fique alinhado corretamente.

Criando um blog

Criando um blog:

Acesse www.blogger.com/

Defina o nome do blog e defina a URL dele, como será o endereço do blog

escolha um layout.

====

Com o blog criado, vamos ao tune-up!



Mudando pra Blogger 2.0:

Alguns blogs ainda estão no padrão clássico do blogger, o que limita em funcionalidade.

Na página principal, clique na aba "modelo" "personalizar design". Ele perguntará se você quer mudar para o novo layout. Clique em "Atualize o modelo do seu blog";

Feito isso, novos layouts estarão disponíveis. Escolha o seu e salve o seu modelo.

Ok, esta página que abriu é onde editamos o layout, a identidade visual da página. É onde a magia acontece :)


Antes de inserir novas funcionalidades, temos de aprender alguns termos que serão bastante utilizados.


* Layout

identidade visual/aparência de seu blog.


* Gadget:
A palavra é uma gíria tecnológica. São ferramentas auxiliares utilizadas para adicionar novas funcionalidades ao nosso blog.
[...]
"Na Internet ou mesmo dentro de algum sistema computacional (sistema operacional, navegador web ou desktop), chama-se também de gadget algum pequeno software, pequeno módulo, ferramenta ou serviço que pode ser agregado a um ambiente maior. No site iGoogle, por exemplo, é possível que seja adicionado alguns dos muitos gadgets disponíveis."[...]
Fonte Wikipedia (http://pt.wikipedia.org/wiki/Gadget)

* Feed:
vem do verbo em inglês "alimentar". Na prática, Feeds são usados para que um usuário de internet possa acompanhar os novos artigos e demais conteúdo de um site ou blog sem que precise visitar o site em si. Sempre que um novo conteúdo for publicado em determinado site, o "assinante" do feed poderá ler imediatamente.
fonte: Wikipedia (http://pt.wikipedia.org/wiki/Feed)

* HTML
(acrônimo para a expressão inglesa HyperText Markup Language, que significa Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir páginas na Web. Documentos HTML podem ser interpretados por navegadores.
Fonte: Wikipedia (http://pt.wikipedia.org/wiki/Html)

No decorrer do tuto vamos abordar novas palavras.

vamos começar?