Curso de HTML - Aula 1


Curso de HTML, aula 1

Olá pessoal, hoje teremos aqui no nosso blog a primeira postagem do curso de html, como eu disse antes eu irei escrever no blog, mas sempre que possível eu estarei colocando dentro da postagem uma videoaula, respectiva a aula que explique o que eu passei em escrito.
Você deve aprender html se pretende ser um webdesigner ou se simplesmente quer ter o seu blog de sucesso, como eu disse em uma postagem anterior, você deve aprender um pouco de tudo para que tudo saia bem, não se contente com pouco, aprenda cada vez mais!
Nessa aula eu irei passar umas coisinhas bem fáceis e que se você não sabe de nada de HTML, já vai ser de muito bom proveito, se você já sabe o básico não terá muita serventia, nesse blog as coisas irão por partes, ou seja, a coisa só vai ficar mais avançada num futuro próximo.

O que vamos aprender?


Hoje nós iremos aprender o que é uma tag, para que ela serve e como utilizá-la, e também vamos saber de algumas muito importantes e que não podem faltar em um documento de html.

O que eu preciso para fazer um documento HTML?

Um documento básico de HTML precisa apenas de um bloco de notas, então nada a mais que isso e você já pode fazer a sua página básica para a internet, mas daqui algumas aulas eu irei passar uns programas extremamente bons e que são excelente para facilitar o trabalho de um webdesigner!

Mão na massa!

A primeira coisa da qual você precisa saber é a seguinte:
Tag são os códigos que você vai utilizar para definir o que quer, toda tag tem uma entrada e uma saída, tente ver da seguinte forma, você esta vendo uma casa, essa casa é extremamente bonita, mas ela só é dessa forma, pois as portas de entrada e de saída da casa são mágicas! Então a porta de entrada e de saída juntas fazem uma bela casa, mas se não tiver umas das portas com certeza essa casa nunca seria tão bela.
Não dê risada do meu modo de ensino, é importante pensar em coisas estranhas para se lembrar delas ok?
Toda tag está entre o sinal de "<" e o sinal de ">", então todas as vezes que abrir um documento de html e ver alguma palavra em inglês entre isso <> saiba que é uma tag. Lembrando, tag são as portas mágicas da casa!

Então vamos escrever o nosso primeiro documento em HTML? Assim, mesmo que você não tenha entendido o que leu, a prática ira refrescar as suas idéias...

Tag <html> e <head>:
Todo documento em html começa com a tag <html>, já que todo documento em html tem uma entrada e uma saida vamos escrever assim:

<html>

</html>

Então a entrada é <html> e a saída é </html>.Tudo que estiver entre <html>(entrada) e </html>(saída) será a sua página completa da internet.
Dentro de tag html temos outras, essas outras são as pequenas coisas que vão fazer a diferença de uma página em branco e uma verdadeira página de html, ou seja, as outras tags são os móveis da casa, as paredes e por ai vai! Vamos utilizar agora duas novas tags, a <head> e a <body>.

A tag <head> é todo o seu cabeçalho da página, coisas como META TAGs e Titulo da página vão vir dentro de head, então temos aqui a nossa tag <head>:

<html>
<head>
</head>
<html>

Lembra da nossa casinha la no começo da aula? Já temos uma casinha e estamos levantando as paredes, daqui a pouco teremos um bairro de casinhas que tem porta de entrada e de saída, não são todos que tem esse luxo...
Digo isso, pois nem todas as tags tem entrada e saída, mais para frente veremos quais não tem.

Tag <title>:
Então agora temos o nosso documento de html, com a tag <html> e a tag <head>, dentro dessa tag head teremos que colocar alguma coisa da aula de hoje, não podemos simplismente deixar uma aula em branco, daqui a pouco vamos escrever uma frase.

Dentro da casinha, quer dizer, tag <head> podemos colocar todo o cabeçalho da nossa página não é mesmo? Já que estamos no básico, vamos fazer isso, o primeiro móvel dessa casa será a tag <title>, nessa tag nós podemos escrever o que aparecerá lá em cima da nossa página, como a imagem abaixo sugere:


Então vamos continuar com o nosso documento?

Continue:

<html>
<head>
           <title> </title>
</head>
</html>

Perfeito, mas o que vamos escrever no nosso titulo de página? Já que é a nossa primeira aula, vamos escrever o que é apropriado, vamos escrever: Aula 1 HTML, Superpoint!

Então escreva:

<html>
<head>
          <title>Aula 1 HTML, Superpoint!</title>
</head>
</html>

Agora, só para você ter uma noção do que está fazendo, salve o seu documento.
Para salvar, não é simplesmente ir salvando não! Calma e vamos por etapa, na hora de salvar o seu documento escreva o que quiser, mas para ficar organizado, vamos escrever, "aula1.html" e salvar.
Nunca coloque letras maiúsculas e muito menos espaços na hora de salvar seu documento de html, faça tudo o mais simples possível para não ter problemas futuros ok?
Vá para onde você salvou, veja que ficou como um arquivo de internet, clique nele e veja como está ficando...

Curso de HTML, Title



Não tem nada além do nosso titulo, representado pela tag <title>.

Tag <body>:
Tudo bem escrevemos o nosso titulo de página, mas cadê a página pelo amor de Deus!?
Vamos ter que escrever alguma coisa na página para que tudo dê certo não é mesmo, caso contrário que vai querer nos achar na internet? Então vamos fazer o nosso corpo do site, ou seja, o site MESMO:

Para fazer o corpo do site, nós temos que usar uma tag como qualquer outra coisa em html, então nada melhor do que a tag <body>, body significa corpo, ela é simplesmente todo o corpo da nossa página, se você souber inglês as coisas ficaram muita mais fáceis em html, pois tudo aqui é representado por palavras em Inglês ou simplesmente por diminuição delas.

Então se o corpo da página é body, vamos escrever esse, body será as paredes da nossa casa e dentro dele poderemos colocar a nossa decoração também, mas a decoração da nossa casa, ou melhor, da nossa página, será feita depois...

Então vamos colocar um corpo na nossa página? Vamos continuar escrevendo a nossa página:

<html>
<head>
<title>Aula 1 HTML, Superpoint!</title>
</head>
<body>


</body>
</html>

Tag <p>:
Agora temos um corpo, porém não temos nada nele, para colocar alguma coisa na nossa página vamos escrever alguma coisa, assim você ficara mais aconchegado e terá mais coragem de prosseguir, então tá, vamos escrever um texto.
Para se escrever um texto, devemos usar uma tag também, a palavra tag tem que invadir a sua mente durante uma semana, você tem que comer tags para poder aprender html, então para tudo precisa de tags, certo? Para um texto também! Vamos escrever um, então vamos lá!

Para se escrever texto a tag usada é <p> de Paragraph, como quase todas as tags, ela tem abertura e fechamento, então o texto vai estar entre <p> e </p>

Vamos escrever:

<html>
<head>
<title>Aula 1 HTML, Superpoint</title>
</head>
<body>
<p>


</p>
</body>
</html>

Ótimo, agora escreva um texto grande, ou melhor pegue esse texto que eu criei e que está no blog, já que as aulas vão ser de etapas em etapas e nós iremos fazer tudo baseado em apenas uma página é importante que seja um texto grande, afinal de contas depois você vai aprender a formatar um texto e para isso é melhor que seja um texto grande.

Coloque o texto dessa página.

Agora cole este texto dentro da tag <p>, vai faicar resumidamente assim:


<html>
<head>
<title>Aula 1 HTML, Superpoint</title>
</head>
<body>
<p>

Você ja deve ter reparado que aqui, eu falo mais de como se ter sucesso com um blog, mas essa é a verdade, esse ganhar dinheiro na internet nós iremos fazendo por partes, ou seja, a primeira parte é a criação e boa administração de um blog, caso contrário, como você vai ganhar?
Hoje vamos abordar uma coisa muito importante na internet e para se ter sucesso com ela. Qual o tamanho da importância que você deve dar aos seus leitores?
Muitas pessoas fazem blogs, alguns blogs tem um conteúdo maravilhoso, mas simplismente se esquecem o porque de que eles escrevem na internet. A resposta para a pergunta acima é a seguinte: TODA E COMPLETA ATENÇÃO! O seu blog precisa de pessoas que comentem que participem diariamente do seu blog, seu blog precisa de um espaço grande para os seus leitores.
Para dar a devida atenção a eles existem pequenas coisas que você deve fazer e que dão toda a diferença na hora de blogar..."
</p>
</body>
</html>

Agora salve o seu documento e veja como está ficando...

curso de html, aula1 body


Só mais uma coisinha, quando você for fazer os seus documentos, não é necessário dar espaço ou alt para que os códigos funcionem, apenas faça da maneira que achar melhor...


Caso você não tenha entendido muito bem, veja esse vídeo do site Guanabara.info, nesse caso publicado no youtube:



Se você fez exatamente da maneira que eu passei com certeza deverá estar uma grande MERDA!
É isso mesmo, deve estar uma merda, mas sabe porque está assim? Está assim, pois nós não utilizamos nenhuma tag para formatar o texto e deixá-lo bonito, isso nós vamos aprender na próxima aula, espero você na próxima e até!

Espero ter ajudado, o que você achou da primeira aula de html do superpoint? Se achou horrível, pode falar, pois eu vou fazer de tudo para melhorar, até mais!

UFA! Acabaram as reformas!


Sim pessoal, agora acabaram-se as reformas no SuperPoint, agora tudo voltara ao normal e eu vou voltar a trazer novas postagens diárias, para sempre manter você e o seu blog novinhos!
Como eu havia falado o Superpoint depois de alguns 5 templates diferentes, finalmente se firmou com um tom de verde e branco, mudei o logo do blog e agora teremos muito mais assuntos a abordar, com o curso de HTML, algumas dicas de Photoshop que eu vou trazer de vez em quando e muita novidade.


Espero que tenham gostado das mudanças! Até amanhã!

Boa sorte para nós no mundo dos negócios online! Voltamos com a primeira postagem amanhã!

Blog em manutenção...

O Aprenda Blog quer como você, crescer cada vez mais! O Aprenda Blog está em manutenção, mas será rápido e eu vou voltar com algumas novidades no visual e também algumas postagens bem legais para todo mundo!

Fique ligado!

Otimização de Sites nos Mecanismos de Busca



Agora eu vou estar colocando no blog os e-books que eu li e recomendo!
Um deles é o Otimização de Sites nos Mecanismos de Busca, feito por Celso Lemes, aborda o que é SEO e explica as melhores técnicas utilizadas.
Um dos melhores e-books que eu já li sobre SEO.

Porque baixar?

Você deve baixar simplesmente pelo fato de que ele, pelo menos por enquanto, é o melhor! O e-book não vai ficar abordando coisas como, onde colocar o código, ele vai logo ao assunto, dez o que deve ser feito, a importância sempre com uma ótima explicação e é realmente muito bom.

O e-book tem tudo isso:

Conteúdo de Qualidade...................................................................................4
Entenda o que é conteúdo de qualidade e porque ele é importante na otimização.
Conquistando a confiança do Google..........................................................6
Você irá aprender como conquistar a confiança do Google.
Crie um site amigável ao
Google….................................................................. 8
Você irá aprender alguns recursos utilizados nos sites que os impedem
que sejam indexados corretamente.
Crie títulos otimizados ..........................................................10
Dicas para criar títulos otimizados nas páginas.
Trabalhe os links internos...........................................12
Dicas para criar links internos e melhorar a indexação das páginas mais antigas do site.
Links externos…........................................14
Dicas para conseguir links externos.
Descobrindo palavras-chaves............................................….15
Dicas para descobrir palavras-chaves competitivas.
Mapa do Site HTML.............................................17
Dicas para criar um Mapa do site e melhorar a indexação de páginas antigas.
Criando um Site Map XML...................................17
Dicas para criar um SiteMap e ajudar o Google a encontrar suas páginas
e entender a estrutura de seu site.
ALT Tag em imagens...........................................18
Dicas para utilizar a Alt Tag e melhorar a indexação da página.
Meta Description Tags............................................18
Dicas para utilizar as Meta Tags.
Posicione e destaque as palavras-chaves no conteúdo.................................. 19
Dicas para montar a estrutura dos textos nas páginas.
Quando e como utilizar o atributo nofollow................................................... 20
Dicas sobre a utilização do atributo nofollow.
Não exagere na otimização...................................21
Dicas para evitar super otimizar o site e acabar sendo punido por isso.


Para ler o seu e-book você precisará de um arquivo que leia PDF e um descompactador de arquivos.

O que você está esperando, leia logo, é rápido, não tem muitas páginas e agrega muito conhecimento para você que quer fazer do seu blog um sucesso!!!

O que é SEO?


SEO, google, bing, yahoo


SEO, essa postagem é bom você ler!


Me responde uma coisa? Quando você vai fazer uma pesquisa na internet, qual é o site que você mais entra, ou melhor qual é o site que todo mundo conhece e que todo mundo pesquisa?

GOOGLE

Sim, é o google mesmo e se você tem um site ou um blog você realmente precisa se empenhar para que o google veja o mesmo, SEO é básicamente isso, uma otimização para os sites de buscas, se os sites de buscas não te verem, ninguém vai te ver! Isso acontece, pois o google não é uma pessoa é um robô programado, o que você deve fazer é "puxar o saco" desse robô para que ele te coloque no topo.
Muita gente não sabe o que é SEO, quando eu comecei eu também não sabia o que era, o que é realmente uma pena, afinal de contas, se você quiser que o seu blog seja um sucesso no mundo internet você precisa aprender certas coisas, uma delas é o SEO.
Veja como o google já influência no meu pequeno blog!:

SEO, google e sua importância

SEO: Search Engine optimization; é basicamente dizendo é a otimização para sites de buscas.
Sites de buscas são aqueles que nós já falamos, o Bing, Google, Yahoo, MSN entre outros.
Se você não fazer uma otimização de SEO no seu site ou blog você pode se considerar um nada na internet, antes do SEO você já era um grãozinho de areia, agora você é uma bactéria impossivel de se ver até mesmo com telescópios...
É sério isso gente, SEO é coisa séria, se o google não te vê, básicamente ninguém te vê.
O google não irá ler as suas postagens de "altíssima" qualidade, quem vai ler as suas postagens são os seus leitores, porém os seus leitores só irão ler as suas postagens se eles a encontrarem, da mesma forma que o leitor corre atrás de informação, você corre atrás de conceder a mesma ao leitor, sim é uma correria, mas é uma correria necessária.
Mas para que então fazer ótimas postagens sendo que o google não as lê?

Basicamente o google é para a divulgação da sua página, mas não adianta nada você estar em primeiro lugar no google para "x" palavra chave sendo que na sua página não haverá o conteudo de qualidade que o usuário procura.
Você deve sim fazer SEO no seu site ou blog, mas você deve também fazer com que o leitor se apaixone pelo seu blog e não queira voltar para o google onde ele poderá encontrar os seus "concorrentes", talvez o que você tem outra pessoa também tenha, porém melhor, como diria Katiero Porto, não perca tempo refazendo a roda, se for fazer igual, faça diferente, não estou dizendo para não fazer conteúdo próprio, estou dizendo para fazer melhor!
SEO não é difícil, mas assim como muitas coisas da internet é bom que você saiba o básico de HTML para saber usá-lo.
SEO quer que você otimize, para fazer isso você terá de utilizar desde palavras chaves até mesmo o título do seu blog. Quer um exemplo? Então pegue esse:

Você entra no google e digita: Como colocar um vídeo na barra lateral do blog.
Agora vão aparecer as páginas que tem a palavra chave "como colocar um vídeo na barra lateral do blog" em primeiro lugar, vamos ver quem é a primeira?
O meu blog está em 1° lugar... Melhor impossível certo?

SEO, como colocar um vídeo na barra lateral do blog, superpoint em primeiro lugar!!!

Por que isso ocorreu?


Isso ocorreu por algumas coisas super importantes feitas no SEO e outras não como:


  •  Não existe nenhum post com essas palavras chaves que realmente colocam um vídeo apenas na barra lareal, as outras postagens que não são do super point são apenas para colocar a barra de vídeo do youtube.
  • Eu usei atributo alt em todas as minhas imagens dessa postagem, estarei explicando como usar depois.
  • Todas as palavras chaves que "você" digitou estão na postagem.

Entre outras coisas mais, porém essas são as mais importantes no meu caso.

Entendeu a importância, se alguém copiar a minha postagem, colocar as mesmas palavras chaves e colocar as mesmas técnicas de SEO ou até melhores, com certeza o meu blog vai para segundo lugar e o camarada que usou melhor o SEO vai para primeiro lugar.
Um pouco maldoso já que foi eu quem criou a postagem, mas isso está acabando, pois o google está desenvolvendo uma técnica que vai acabar com os conteúdos duplicados na internet e também não há mal algum em copiar uma postagem de outro blog, desde que você coloque o nome do blog de preferência com o link.

Entendeu? Use sim SEO no seu blog e eu aposto que as suas visitas vão aumentar!

Nas próximas postagens eu estarei colocando com exatidão o que é SEO e ainda colocarei um tutorial com muitas técnicas de SEO e alguns vídeos, para que você faça o SEO acontecer no seu blog, só assim ele terá sucesso.
Um forte abraço para todo mundo e até a próxima!

Você sabe qual o valor do seu blog ou site?


Bom gente, como eu já expliquei aqui no blog, os negócios estão em "expanção" então está um pouco difícil encontrar tempo para postar aqui algo legal. Mas de vez em quando eu vou dar as caras aqui, mas tudo voltara ao normal quando os novos blogs estiverem prontos!
Hoje pesquisando na internet achei uma coisa bem legal, principalmente para os curiosos!

Como saber o valor do seu site?


Até pouco tempo eu não sabia, mas descobri em algum site pelo google que existe um site que mede o valor de cada site. Um pouco confuso de se explicar, mas é assim que funciona e hoje eu trouxe para vocês darem uma olhada e matarem a curiosidade.
Você pode colocar qualquer endereço da web que exista e esperar o resultado, em poucos segundos sai o resultado do valor, hoje eu coloquei o endereço do google e sabe o que apareceu?

Olha só o valor disso!:

Biz informação, saber o valor do seu site


Muita coisa não é mesmo? Você não tem curiosidade para saber o valor do seu blog ou de um blog que você goste? Entre no Biz Informação e descubra.
Quanto vale o seu blog?

Os 10 melhores Widgets e como colocá-los.


10 melhores gadgets, widgets para blog

Existem muitos widgets disponíveis na internet, porém widgets que realmente fazem a difernça em seu blog não são muitos, mas são bons. Nessa postagem você encontrará os melhores widgets e também um tutorial de como colocar cada um deles, assim você irá implementar o seu blog e deixá-lo cheio de coisa boa para você e para os seu leitores! Nessa postagem eu colocarei os widgets mais difíceis de instalar no final, vou deixar os mais fáceis no começo.
Vamos lá!


Marcadores: 
Os 10 melhores gadgets, widgets blogger
Sim, esse mesmo, é ótimo está presente em quase todos os blogs e ajuda muito na organização do seu blog, sem ele o visitante teria que encontrar outra maneira de encontrar as suas postagens, mas o que você deve saber é que os seus visitantes não são o Indiana Jones, eles são pessoas normais na frente do computador procurando maneiras fáceis de encontrar a informação que precisam. Nada  como organizar as suas postagens por categorias, assim tudo fica mais fácil e organizado.


Como Colocar:
Para colocar os marcadores, entre no Design=>Elementos de página=>Adicionar Gadget=>Procure por Marcadores e clique no + que haverá na frente, aparecerá algumas opções, se quiser deixe como está e siga em frente clicando em salvar, no canto superior direito da tela. Agora veja o resultado no seu blog, se não gostar do lugar você pode mudar no mesmo caminho: painel do seu blog=>Design=:>Elementos de página.


  Botão Seguidores: 
Os 10 melhores widgets para blogger
Apesar de ele ser do próprio blogger e algumas pessoas acharem que não tem serventia, é de muito erro não ter um botão seguir no seu blog, afinal de contas os seguidores do seu blog podem ter muitos beneficios e isso é muito bom. Além de permitir que os seus leitores conversem via e-mal, eles poderão comentar em seu blog, caso essa seja a sua configuração e por ai vai! Fácil de colocar e ótimo para o blogger, também está presente em muitos blogs da internet!


Como colocar:
Para colocar Botão Seguidores, entre no Design=>Elementos de Págian=>Adicionar Gadget=>Procure por Seguidores e clique no + que haverá na frente, aparecerá algumas opções, se quiser deixe como está e siga em frente clicando em salvar, no canto superior direito da tela. Agora veja o resultado no seu blog, se não gostar do lugar você pode mudar no mesmo caminho: painel do seu blog=> Design=:>Elementos de página.


Postagens populares:
Os melhores widgets/gadgets para blogger/blog
Eu coloquei esse widget a pouco tempo, mas existem muitos blogs de sucesso que tem, se você já tiver uma grande quantidade de postagens é bem legal que você coloque, afinal de contas, pode haver uma postagem muito interessante para o seu leitor que ele nem saiba que exista. Mais ou menos com a mesma função do "saiba mais" os usuários verão as suas melhores postagens bem na Home do blog, o que é ótimo, pois é mais um motivo para que eles cliquem e vejam, então como eu disse, se já tiver uma grande quantidade de postagens, você deve colocar esse widget, caso contrário não aconselho, afinal de contas o visitante com dois ou três cliques poderia encontrar as suas postagens.

Como colocar:
Para colocar Postagens populares, entre no Design=>Elementos de página=>Adicionar Gadget=>Procure por Postagens populares e clique no + que haverá na frente, aparecerá algumas opções, se quiser deixe como está, mas eu aconselho que não coloque dez postagens para serem mostradas, coloque apenas cinco, caso contrário você vai ganhar um prédio gigantesco no seu blog! Siga em frente clicando em salvar, no canto superior direito da tela. Agora veja o resultado no seu blog, se não gostar do lugar você pode mudar no mesmo caminho: painel do seu blog=> Design=:>Elementos de página.



Feedburner:
Os melhores widgets/gadgets para blogger/blog! 10
Quando você faz conta no feedburner, você ganha a possibilidade de fazer com que seus leitores sempre fiquem por dentro de suas postagens, mas para isso eles precisam de um caminho fácil para assinar a sua newsletter, o seu feedburner, então esse widget o próprio feedburner, ele vai te proporcionar automaticamente é só fazer a conta e seguir as instruções que já estão explicandas em: Tutorial - Newsletter, o que é isso? e como colocar?


Caixa de pesquisa: 
Esse widget já está presente em alguns templates, mas se no seu template não tiver a caixa de pesquisa, será uma ótima pedida de você colocar no blog. Como eu disse acima, nem todos usuários tem paciência para ficar procurando o que querem, se ele já o seu seguidor, não deixe que ele vá embora procurar no google o que já tem no seu blog. Para isso coloque em seu blog a caixa de pesquisa, assim eles escrevem as palavras chaves e logo abaixo aparecerá o que ele está procurando em seu blog, claro se você não tiver não aparecerá nada, afinal de contas a caixa de pesquisa é feita em relação ao seu blog.

Como colocar:
Para colocar a caixa de pesquisa, entre no Design=>Elementos de página=>Adicionar Gadget=>Procure por Caixa de pesquisa e clique no + que haverá na frente, aparecerá algumas opções, se quiser deixe como está e siga em frente clicando em salvar, no canto superior direito da tela. Agora veja o resultado no seu blog, se não gostar do lugar você pode mudar no mesmo caminho: painel do seu blog=> Design=:>Elementos de página.


Top Comentários:
Ele faz com que os seguidores que mais comentam fiquem no topo da lista, estando no topo da lista é um meio de divulgação para os seus próprios blogs, afinal de contas o nome do usuário aparecerá e caso alguém clicar é direcionado para o blog do seguidor. Legal não é? Isso faz com que as pessoas queiram comentar para divulgar o seu blog, então é lucro para todo mundo!

Como colocar:
Entre no Painel do blogger=>Design=>Elementos da página=>Adicionar Gadget. Procure pelo Gadget HTML/JavaScript, clique no + que haverá na frente, aparecerá uma caixa de diálogos onde você deve colar o código HTML abaixo:

<script type="text/javascript">

function pipeCallback(obj) {

document.write('<ul style="text-transform: capitalize;">');

var i;

for (i = 0; i < obj.count ; i++)

{

var href = "'" + obj.value.items[i].link + "'";

var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";

document.write(item);

}

document.write('</ul>');

}

</script>

<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id= e2ec31beeb7d775c39267948fd2afc9f&URL=http://superpointlahsat.blogspot.com&Numero=10&Excluir=NOMEPARAOCULTAR1&Excluir2=NOMEPARAOCULTAR2" type="text/javascript"></script>

<span style="font-size: 80%;display:block;text-align:right;">widget <a href="http://www.compulsivo.com.br/2008/07/widget-compulsivo-top-comentaristas.html">Usu&aacute;rioCompulsivo</a></span>

No link http://superpointlahsat.blogspot.com, coloque o link do seu blog.
Em NOMEPARAOCULTAR1 e NOMEPARAOCULTAR2 coloque o seu nome de usuário do blog, afinal de contas quem mais comenta no seu blog é você, respondendo os comentários! Retire dois nomes que não poderão aparecer no topo.
Siga em frente clicando em salvar e depois em visualizar página para ver como ficou!


Skribit: 
Com ele, os visitantes do blog podem deixar sugestões de assuntos que gostariam de ver no seu blog, já que eu não utilizo, mas sei que é um ótima ferramenta, vou deixar aqui um link explicativo da ferramenta:



Artigos relacionados com imagem: 
Ele faz com que apareça no final de cada postagem uma barra com várias postagens suas, são artigos relacionados. Para que ele saiba o que é relcaionado ou não, ele pega altomáticamente as postagens dos mesmos marcadores, sendo mesmo marcador é relacionado, assim ele coloca no final de cada postagem. Então talvez o seu leitor clique para conferir. Muitas vezes as pessoas não tem paciência de procurar o conteúdo do seu blog, e acabam perdendo muita coisa, mas com esse widget os seus leitores vão poder ver mais postagens de uma só vez. Muito bom esse widget e se você prestar atenção verá que ele esta presente em diverssos blogs, geralmente está escrito como "artigos relacionados".

Como colocar:
Para colocar os artigos relacionados com imagem, entre em Design=>Editar HTML, clique em "expandir modelos de widgets" aperte CTRL F e escreva na caixa que aparecer isso: </head> logo ANTES de </head> escreva isso sem modificar absolutamente nada do código:



<!--Artigos Relacionados Estilo e Script Inicio --> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<style type="text/css"> 
#related-posts { 
float:center; 
text-transform:none; 
height:100%; 
min-height:100%; 
padding-top:5px; 
padding-left:5px; 
}
#related-posts h2{ 
font-size: 1.6em; 
font-weight: bold; 
color: black; 
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif; 
margin-bottom: 0.75em; 
margin-top: 0em; 
padding-top: 0em; 

#related-posts a{ 
color:black; 

#related-posts a:hover{ 
color:black; 
}
#related-posts  a:hover { 
background-color:#d4eaf2; 

</style> 
<script src='http://blogergadgets.googlecode.com/files/relatedthumbs21.js' type='text/javascript'/> 
</b:if> 
<!--Artigos Relacionados Estilo e Script Final-->

Agora, com o CRLT F ainda funcionando escreva isso: <div class='post-footer-line post-footer-line-1'> ou isso: <p class='post-footer-line post-footer-line-1'>.

Se você encontrar alguma delas, coloque o código a seguir antes da linha, se colocar depois ou modificar alguma coisa errada, tudo vai dar errado, HTML é chato, pois não suporta erros!

<!--Codigo Artigos Relacionados Inicio--> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div id='related-posts'> 
<b:loop values='data:post.labels' var='label'> 
<b:if cond='data:label.isLast != &quot;true&quot;'> 
</b:if> 
<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop><a href='http://www.bloggerplugins.org/2009/08/related-posts-thumbnails-blogger-widget.html' style='display:none;'>Related Posts with thumbnails for blogger</a><a href='http://www.bloggerplugins.org/' style='display:none;'>blogger widgets</a> 
<script type='text/javascript'> 
var currentposturl=&quot;<data:post.url/>&quot;; 
var maxresults=5
var relatedpoststitle="Artigos Relacionados"; 
removeRelatedDuplicates_thumbs(); 
printRelatedLabels_thumbs(); 
</script> 
</div><div style='clear:both'/> 
</b:if> 
<!--Codigo Artigos Relacionados Final-->

Onde está escrito o 5 em vermelho, você poderá escolher o número de postagens que gostaria de ter no seu blog na parte do widget, depende do template, você pode escolher o que quiser, mas pense no tamanho, pense em deixar sempre o seu blog organizado ok? 
Só funcionará se tiver os marcadores, então não se esqueça de colocar os marcadores como eu já expliquei acima!

                                      
Botão curtir do twitter/facebook:
Quais são os melhores gadgets, widgets do blogger?Esse é para os seus leitores clicarem caso gostarem das suas postagens, então eles divulgam a mesma para quem eles tiverem no próprio twitter ou facebook. O legal é que você acaba tendo um maior número de divulgação das suas postagens e até mesmo se você quizer twittar que você tem uma atualização no blogger, por isso eu gosto muito desse widget.

Como colocar:
Para colocar o botão curtir do twitter/facebook entre em Design=>Editar HTML, clique em "expandir modelos de widgets" aperte CTRL F na caixinha de pesquisa que aparecer escreva: 
<div class='post-body entry-content'>
Acima disso, ou seja ACIMA dessa linha de código, cole esse código HTML:


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style='display: inline; float: right; margin-left: 5px'>
      <a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
      <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
<br/>
      <iframe expr:src='"http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url+ &quot;&amp;layout=button_count&amp;show_faces=false&amp;width=80&amp;action=like&amp;colorscheme=light"' scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:80px; height:20px"></iframe>
</p>
</b:if>
Agora salve as modificações e olhe em alguma postagem sua, vai ficar lá no canto superior direito da página dois botões para curtir, assim divulga o seu blog.



Google tradutor com bandeiras:
Já pensou se um extrangeiro entrar no seu blog e não poder mexer em nada, pois não consegue traduzir a página. Que frustração seria, afinal de contas você perderia a chance de aumentar a popularidade do seu blog para outros países. Não pense que as pessoas que moram em outros países não entram em seu blog, pois elas entram sim. Tenho visitantes dos EUA, Italia e muitos outros, então não perca a oportunidade de fazer do seu blog mundial. Claro que você deve estar pensando que o google disponibiliza no navegador a tradução, mas é muito mais fácil para o seu leitor se tudo estiver perto e a um clique de distância, você deve fazer do seu blog a sua cara, mas tente fazer da sua cara agradável a todos e nada melhor do que a facilidade não é mesmo?

Como colocar:
Para colocar o google Tradutor com bandeiras entre em Design=>Elementos da página=>Adicione um gadget=>Escolha o Html Java Script. Agora cole o código abaixo nesse gadget, não modifique nada, a não ser que você saiba HTML.



<style> 
.google_translate img { 
filter:alpha(opacity=100); 
-moz-opacity: 1.0; 
opacity: 1.0; 
border:0; 

.google_translate:hover img { 
filter:alpha(opacity=30); 
-moz-opacity: 0.30; 
opacity: 0.30; 
border:0; 

.google_translatextra:hover img { 
filter:alpha(opacity=0.30); 
-moz-opacity: 0.30; 
opacity: 0.30; 
border:0; 

</style> 
<div> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="32" src=http://lh6.ggpht.com/_pt7i0nbiocy/swwjycgenli/aaaaaaaaa1o/7p6s3-tipsa/english_thumb%5b3%5d.png?imgmax=800 style="cursor: pointer;margin-left:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="32" src="http://lh3.ggpht.com/_pt7i0nbIOCY/SWwj1AdOWZI/AAAAAAAAA1w/lWUkGNrOFYo/French_thumb%5B5%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="32" src="http://lh5.ggpht.com/_pt7i0nbIOCY/SWwj4Ab0NaI/AAAAAAAAA14/3H56LPKtijA/German_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="32" src="http://lh3.ggpht.com/_pt7i0nbIOCY/SWwj8KhadjI/AAAAAAAAA2A/GNyl8VBie3o/Spain_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="32" src="http://lh3.ggpht.com/_pt7i0nbIOCY/SWwj-14HeyI/AAAAAAAAA2I/TN52dIqkO9Q/Italian_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="32" src="http://lh5.ggpht.com/_pt7i0nbIOCY/SWwkBmKewNI/AAAAAAAAA2Q/43NEAnyNo1I/Dutch_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<br/> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="32" src="http://lh4.ggpht.com/_pt7i0nbIOCY/SWwkESa-0pI/AAAAAAAAA2Y/i0X4cKgxq3g/Russian_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Portuguese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cpt&hl=en'); return false;"><img alt="Portuguese" border="0" align="absbottom" title="Portuguese" height="32" src="http://lh4.ggpht.com/_pt7i0nbIOCY/SWwkG0osjzI/AAAAAAAAA2g/_kM2A16R_Ho/Portuguese_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="32" src="http://lh5.ggpht.com/_pt7i0nbIOCY/SWwkJ6RBJAI/AAAAAAAAA2o/lpsTh893J3k/Japanese_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="32" src="http://lh4.ggpht.com/_pt7i0nbIOCY/SWwkMouNMKI/AAAAAAAAA2w/L5l6J-Hh8XA/Korean_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="32" src="http://lh5.ggpht.com/_pt7i0nbIOCY/SWwkPdkvXBI/AAAAAAAAA24/A1LSG1lcuac/Arabic_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
<a class="google_translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=pt%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="32" src="http://lh6.ggpht.com/_pt7i0nbIOCY/SWwkSgrv4ZI/AAAAAAAAA3A/jQqZ1l6avts/Chinese-Simplified_thumb%5B1%5D.png?imgmax=800" style="cursor: pointer;margin-right:13px" width="24"/></a> 
</div> 
<font face="Microsoft Sans Serif" color="#c0c0c0" size="1"><em>By <a href="http://superpointlahsat.blogspot.com/">LP SuperPoint</a></em></font>




Mais duas dicas:
Se você quiser mais duas dicas, ai vai!
Tenha um perfil, é importante que as pessoas saibam que você não é um robô! Então use o gadget "Perfil".
Se estiver em dúvida sobre alguma coisa para fazer no blog, deixe que os próprios usuários decidam com uma votação, então utilize a "enquete", a maneira como se coloca é a mesma das listadas acima, é bem fácil, pois esses widget são do próprio blogger. Veja a imagem das duas:

Os melhores widgets/gadgets para blogger/blog

Os melhores 10 gadgets/widgets para blogger/blog

Bom pessoal, por hoje é só isso mesmo, espero que tenha ajudado a todos com essas dúvidas, afinal de contas é uma das dúvidas maiores que se existem quando se faz um blog, quais são os melhores e realmente uteis widgets! Hoje eu listei 10 e coloquei tutoriais de como se colocar e mais duas dicas, valeu e um abraço a todos!  E você, sabe de algum widget legal para colocar em um blog, seja wordpress ou não? Compartilhe com agente!









Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Sweet Tomatoes Printable Coupons