Colocar twitter no blog

24 setembro 2010

Hoje vou passar um widget para quem gosta do twitter.

  • Widget últimas Twittadas:
1º - Faça login no Twitter;
2º - Clique aqui e entre na página de widgets (www.twitter.com/widgets)
3º - Escolha a aba do Blogger:

Como colocar post por nome do autor

22 setembro 2010

Hoje recebi um e-mail da Belle Barros  e no e-mail ele estava pedindo para colocar nome do autor nas postagens.Então eu decidir fazer esse post.

Vamos lá! primeiro de tudo faça o login no blogger,depois vai em ---> design---> elementos de pagina

design-elementos-de-pagina

em elementos de pagina você encontrara com “postagens no blog”;

Balão com números de comentários do lado do post

21 setembro 2010

comentarios

Vomos aprender a como colocar um balão de comentários do lado do post (igual no Help Blogs), então vamos lá.

Antes de tudo baixe o modelo completo do seu template por se acontece algo de errada.

Para colocar o balão de comentários é  só um código muito simples mais primeiro você deve encontrar em trecho  lá no seu template coloca “Expandir modelos de widgetss” e procura por;

<b:includable id='post' var='post'>

Alterar cores dos links do blogger

resized_palheta_de_cores_blog_1_1_2_1
Alterar as cores ou formatar do blogger é bem fácil mais nem tudo mundo sabe. Por isso estou fazendo este tutorial, para muda as cores basta edita o estilo CSS do blogger e pronto todos só links já estarão mudados,mas uma coisa que atrapalha muita gente é o estilo a:visited, isso é o estilo(formatação de texto) dos links já visitados, mas podemos alterar ou mesmo remover isso do blog e assim deixando todos os links iguais.
A formatação dos links funciona da seguinte maneira:

Como ocultar a NavBar do blogger

Para esconder a barra de navegação do blogger também conhecida como NavBar é muito simples vai ate --->editar HTML  e busca por <head> e cole o código embaixo da tag   <head>  para encontra pressiona Ctrl + F  e vai aparecer um caixa de busca e você só deve colocar oque você quer encontrar nela (<head>)

navbar-blogger-blogspot-barra

<!-- Hide Navbar -->
<style type='text/css'>
#navbar-iframe {
height: 0px;
visibility: hidden;
display: none;
}
</style>
<!-- Hide Navbar -->
Leia mais: http://www.compulsivo.com.br/2007/01/esconder-barra-de-navegao-do-blogger.html#ixzz0zsr5ztmz
Under Creative Commons License: Attribution Non-Commercial No Derivatives

Código retira do Compulsivo

Enviar post do blogger para twitter (Feed)

20 setembro 2010

Mais como mandar meus post para twitter se lá você só pode escrever 140 letras cantando com espaço! Ai que entra o site mais amigo de um blogueiro que quer manda seus post para o twitter o twitterfeed.

Se seu blog não tiver feed. neste tutorial ensinar a criar um.

Nesse site você envia as atualizações com se feed para o twitter já com as URL encurtadas.Para utilizá-lo você terá que fazer uma conta mais não é nada difícil (e-mail e uma senha).

Depois de criar sua conta vai em Creat new feed 

twitter-feed-00

Como colocar postagem numeradas no blogger?

19 setembro 2010

Hoje vou mostrar como fazer postagem numeradas no blog (blogger).

Então para começar baixe o modelo completo do seu template por se acontece algo de errado.

baixar-completo

Depois de já baixado o template vamos começar.

Para fazer as postagens numeradas temos dois códigos esse é o primeiro;

.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd;
}

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}

Você deve cocar ele encima dessa “TAG” ]]></b:skin>

aperte Ctrl + F e cole ]]></b:skin> 

você deve colocar o código encima dele.

Agora vem o segundo código.

<!-- Inicio do código de navegação -->
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<script type='text/javascript'>
var pageCount=5;
var displayPageNum=5;
var upPageWord =&#39;Anterior&#39;;
var downPageWord =&#39;Próximo&#39;;
</script>
<script src='
http://blogergadgets.googlecode.com/files/blogger-page-navi.v1.js' type='text/javascript'/>
</b:if>
<!-- Final do código de navegação –>

Você deve colocar ele encima da “TAG” </body>

Buscar por </body> (Ctrl + F)  e cole o segundo código encima dele.

OBS:Não modifique nada no Codio, se não, não vai focinhar.

numeradas_thumb[5]

Como trocar de template no blogger modo fácil

18 setembro 2010
Muitos outros blogs que ensinam o mesmo que o help blog já fizeram esse tutorial mais eu estou fazendo ele mesmo assim, para que fique um pouco mais completo o blog ;) Então vamos lá.
Como mudar o template de um blog no blogger? Uma pergunta de todos os iniciantes bloqueios. Fás um mês atrás não tinha essa ferramenta no blogger que facilita muito a vida de nos.
Você vai em Design---> Designer do modelo---> La você pode mudar praticamente tudo do seu template
! Ate de criar mais colunas ha mudar a cor dos links. Mais em breve estarei passando mais tutorias dessa ferramenta em VIDEO AULA.
 ferramenta-nova-do-blogger
Para não percebeu o Help Blogs esta de cara nova!!! (novo template)!!!
Marcas: blogger inciante, trocar de template, ferramentas, novidade

Quem copia seu blog? Você sabe?

16 setembro 2010
Você sabe quem copie seu blog? Não. Então agora vou mostrar um jeito fácil e rápido de como saber e pegar esses espertinhos que ficam falando que foi eles que escreveram o texto.
evitar-plagios
O site  de ajuda Copyscape a buscar quem copio do seu blog.Além de ajudar a buscar que de copio seu conteúdo ele tem algumas ferramentas para de ajudar a proteger seu texto sua imagem  e outras goisa mais que você tiver na postagem.
Mais nem sempre tem como proteger seu blog de plagio.Espero que tenho de ajudado e não esqueça de comentar!

Help Blog : Copyscape, plagio, copia de conteudo

Otimizando os títulos das postagens [SEO]

15 setembro 2010
Por padrão o blogger já coloca a tag <h3> para os títulos das postagens, mas o ideal é seria a tag <h1> pois cosentran o principal conteúdo da pagina.
Para fazer essa coresão entra no painel do blogger Design--->Editar HTML---> e e marque a caixa expandir modelos de widgets.
Antes de fazer qualquer alteração fassa o backup do template.
Etao procure por a tag .post h3 (como na imagem)
Será o primeiro que você em contra.
.post h3

Como mudar de template [vídeo aula]

14 setembro 2010

Veja como mudar de template no blogger em vídeo aula modo fácil espero que gostem.

Aqui vou deixar o site para baixar o teplate http://btemplates.com/.

Como colocar favicon no seu blog

Muita gente sabe colocar no seu blog e também muita gente não sabe como colocar no seu blog.Então hoje vou mostrar um gente muito fácil de como colocar um favicon no seu blog.Veja o código;)
<link rel="icon" href="/favicon.gif" type="image/gif" />
Vou esplicar o códigos. Onde ta /favicon.gif   você pode colocar sua imagem lembrando que a imagem de um favicon é de 16x16 px.
Vai ate Design--->editar html---> CTRL + F---> busca por:::  ]]></b:skin> ---> em baixo voce coloca o codigo.
Favicon de outros sites.

Clik na imagen para aumentar!










Não esqueça de comentar!

Mostrar links de todas as postagens no blogger



Veja como mostrar o titulo e link de todas as pastagens do seu blog  é muito fácil.Mais porque eu vou fazer isso? Para que seu visitante possa ver mais pastagens sua e se ele gostar de alguns post ele pode ate voltar no seu blog!
Veja como fazer ;)

Como fazer um feed e editar


Hoje vou fazer esse post para algumas pessoas que não sabem fazer um feed e depois vou
mostrar como editar ele, tipo colocar uma imagem trocar as frases e colocar aquele contador de assinantes.
Vou mostrar por passo a passo como fazer então vamos la!


  1. Eu não aconselho usar o Mozilla porque ta alguns erros usa a explore ou o Google Chrome.
  2. Faça uma busca no Google por: Feed Burne ou clik aqui para ir tireto no site!
  3. Entrando la você deve fazer uma conta (nada difícil, se você não conseguir fazer sua conta para de fazer seu blog!) Depois de fazer sua conta vai aparecer algo mais ou menos assim ;  para ver melhor clik na imagem.

Como arredondar bordas via CSS

13 setembro 2010
A melhor forma de arredondar as bordas de qualquer parte do template é fazendo imagens com cantos arredondados, pois fazer isso via código CSS pode dar incompatibilidade em navegadores antigos que não dão suporte a versão 3.0 do CSS.
"Cascading Style Sheets (ou simplesmente CSS) é uma linguagem de estilo utilizada para definir a apresentação de documentos escritos em uma linguagem de marcação, como HTML ou XML. Seu principal benefício é prover a separação entre o formato e o conteúdo de um documento [...]"
Texto: Wikipédia
Continue lendo...

Widgets Postagens Populares no seu blog

Recentemente o Blogger liberou um novo widget, onde são mostradas as postagens mais populares do seu blog de acordo com o número de acessos, disponível no painel em “Elementos da Página”.



Esse widget pode ser configurado para mostrar as postagens mais visualizadas no total, nos últimos 30 dias ou da última semana. Além de ser possível colocar miniaturas de imagem ou snippet (fragmentos da postagem).

Colocar botão retweet no blog modo facil

12 setembro 2010
Para colocar um botão de retweet no blog é mais fácil que você pensa!
Primeiro de tudo você tem que ter um twitter claro.
Antes de começar salva o seu template no seu computador. Para se acontece algo de errado você posa ta voltando com ele ao normal.

Chega de conversa e vamos começa!
Vai ate;
Design---> Editar HTML--->Expandir modelos de widgets---> Busca por esse trecho:  <data:post.body/>

E coloca esse códigos depois:)

<div style='float:right;margin-right:10px'>
<script type='text/javascript'>
tweetmeme_url = '<data:post.url/>';
</script>
<script type='text/javascript' src='http://tweetmeme.com/i/scripts/button.js'> </script>
</div>


A linha <div style=”float:right;margin-right:10px”> faz que o botão fique no canto direito se quiser do lado esquerdo é só trocar duas palavras right por left.

Personalizar gadgets do Blog

01 setembro 2010
Esse tutorial vai mostrar como é simples formatar o texto dos links dos marcadores do blog e isso pode ser utilizado para formatar qualquer gadget do seu blogger, pois o modo de fazer é o mesmo e funcionará bem em qualquer texto que esteja dentro de um gadget.

Primeiro vamos entrar na pagina editar HTML e procurar pelos marcadores do blog, aperte ctrl+F no seu teclado que aparecerá uma caixa para procurar texto na pagina, então digite o título dos seus marcadores em nosso caso utilizamos o título guia rápido.


Então encontramos a linha:

<b:widget id='Label1' locked='false' title='Guia Rápido' type='Label'/>

O que procuramos aqui é a id do gadget, no caso é label1 que está logo no começo widget id='Label1', então deve ver e usar como está nos marcadores do seu blog.

Depois role o código html até o começo de antes de body{....} coloque esse código:

#Label1 a{text-indent:15px;letter-spacing: 1px;background-image: url(endereço da imagem);background-repeat: no-repeat;background-position: left;padding-left:15px}
#Label1 a:hover{letter-spacing: normal; font-weight: bold;background-image: url(endereço da imagem);background-repeat: no-repeat;background-position: left}

Aqui você poderá escolher qualquer formatação de texto, imagem de fundo(veja que no código tem endereço da imagem, então coloque uma ou apague aquele trecho), além disso podemos colocar bordas, ou seja, poderá deixar com a aparência que desejar (veja nossa postagem sobre fazer botões). Novamente vamos repetir que neste estilo que acabamos de criar usamos label1 no inicio dele porque é a id dos marcadores de nosso blog, então você usará igual está no seu blog senão não funcionará.

Esse mesmo procedimento serve para formatar o texto de qualquer gadget, basta entrar a id e criar um estilo utilizando o mesmo nome. Mantenha as letras maiúsculas e minúsculas como estão no código do gadget para evitar erros.

Esse tutorial foi feito atendendo alguns pedidos e duvidas sobre como fizemos o nosso menu guia rápido mudando o estilo dos links dos marcadores do blog.

Moderar Comentários do Blogger

O Blogger tem uma pagina de comentários que agora facilita localizar e se necessário excluir comentário já publicado. Isso também deixou mais organizado a moderação de comentários, mas claro isso somente para aqueles que já fizeram a configuração do blogger para moderar os comentários e receber um email de aviso para cada novo comentário feito.

O Primeiro passo é entrar no painel do Blogger e clicar em comentários esse link aparece junto com o nome do seu blog.

Moderar comentarios do blogger
Na pagina que aparece vemos todos os comentários publicados, então caso queira apagar algum é bem simples de localizar e deletar qualquer comentário indesejado. Aqui também temos a pagina de moderação de comentários para você decidir se aprova ou deleta os comentários recebidos.

Claro que isso só aparece se você deixar a moderação de comentários ativada, isso é feito na guia configurações >> comentários, lá você encontrará o Moderação de comentários, então sugerimos marcar a opção sempre e logo abaixo colocar o seu endereço de email, assim a cada novo comentário no seu blog você receberá um email perguntando o que fazer, ou seja, para decidir se aprova (publica) ou exclui o comentário.


Isso é muito útil, pois infelizmente muitas pessoas pensam que comentário do blog é para só deixar o link pedindo visitas ou então para ofender os outros, então para evitar mostrar coisas desagradáveis no seu blog recomendamos que usem a moderação de comentários.

Mostrar resumo da postagem

O Blogger colocou a opção leia mais na sua pagina de postagem, entre nas configurações do seu blog e veja no final da pagina selecionar editor de postagem, selecione a primeira opção (Editor atualizado) e clique para salvar.


Agora vamos fazer uma nova postagem, na pagina onde escreve seu texto clique na guia escrever e note essa ferramenta que destacamos na imagem

Clique na parte do seu texto que deseja colocar o leia mais e depois clique na ferramenta destacada acima. Depois pode publicar o seu texto, mas ainda não está pronto, ainda não será possivel ver funcionando.
Vamos até a pagina editar html, clique para expandir o modelo e procure por:
<div style='clear: both;'/>
</div>

e coloque isso logo depois:

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'>Veja o texto Completo</a>
</div>
</b:if>Se quiser colocar uma imagem em vez de um texto como link para ver a postagem completa, use o seguinte código:

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;'><img src="endereço da imagem" border="0" /></a>
</div>
</b:if>

Agora é só clicar para salvar as alterações e visualizar o blog que aparecerá a frase veja o texto completo no final da postagem que acabamos de fazer. Lembramos que esse procedimento feito na pagina editar html só é necessário na primeira vez, nos próximos textos que publicar basta clicar na ferramenta na pagina de postagens e escolher o lugar onde aparecerá essa frase. E naturalmente você pode escrever o que quiser no lugar onde colocamos veja o texto completo.

Tamanho do XAT

Tutorial : Tutorial ensinando como diminuir ou aumentar o tamanho do seu xat.
1°Pegue o Código do Seu Xat e Procure Por Width e Height.
2°Após Ter Encotrado esses nome voce verá que na Frente Terá Um Numero
de Cada Um.



3°Após Ter Visto os numeros Assinalados Acima você poderá mudar o Valor de Cada um Para deminuir ou aumentar seu xat.

4° Significados : Height: Altura Width: Largura
5° Pronto Diminua ou Aumente o seu Xat.

Registrando em XAT

Aew galera mais um tutorial exclusivo, registrando-se em xat, muito simples e facil
1º entre nesse site: http://xat.com/web_gear/chat/register.php
2º coloque as informações pedidas pelo xat.com
3º será enviado uma confirmação para o e-mail cadastrado
4º confirme o cadastro, e desfrute do seu registro

Mudar o Fundo do XAT

Aew galera, está aqui um tutorial muito simples, e que muitos nao sabem ^^
1º entre nesse site: http://www.tinypic.com/ e hospede sua imagem de fundo
2º vá em Edit Your Chat ou Editar Seu Chat
3º vá em Change Background, e adicione o link da imagem hospedada na frente de "Background"
4º clique em Get Images e espere carregar a imagem, clique sobre ela e em seguida em OK
Pronto seu fundo está trocado, qualquer dúvida, deixe um comentário.

Mais Avatares para XAT


http://i37.tinypic.com/2z6cdjq.png

http://i38.tinypic.com/ve25au.png

http://i36.tinypic.com/289gbqt.png

http://i38.tinypic.com/2i9sdh2.png

http://i35.tinypic.com/2q8bn1t.png

http://i33.tinypic.com/111o12s.png

http://i38.tinypic.com/eqdzq0.png

http://i37.tinypic.com/icnzlz.png

http://i33.tinypic.com/iq98gx.png

http://i34.tinypic.com/16k3mgx.jpg

http://i34.tinypic.com/16lwswh.jpg

http://i33.tinypic.com/mszt68.jpg

http://i37.tinypic.com/2a681e1.png

http://i34.tinypic.com/2s7tag1.png

http://i37.tinypic.com/315h5vq.png

http://i38.tinypic.com/33cal8y.png

http://i34.tinypic.com/34rdifa.png

http://i34.tinypic.com/f081hi.png

http://i34.tinypic.com/34e6g3t.png

http://i33.tinypic.com/2uq282v.png

http://i37.tinypic.com/33nwbpj.png

http://i37.tinypic.com/wk075c.png

http://i37.tinypic.com/10cixap.png

http://i37.tinypic.com/wv4e93.png

http://i34.tinypic.com/opvebb.png

http://i34.tinypic.com/v2wpi1.png

http://i37.tinypic.com/2a0gl14.png

http://i36.tinypic.com/ru79kw.jpg

http://i34.tinypic.com/rkc8zq.png

http://i34.tinypic.com/51v9uc.png

http://i37.tinypic.com/29yr43c.gif

http://i34.tinypic.com/16k3mgx.jpg

http://i33.tinypic.com/dd0ykj.png

http://i35.tinypic.com/2dtsz7l.png

http://i34.tinypic.com/a42237.png

http://i38.tinypic.com/fmmfdk.png

http://i35.tinypic.com/w8u72g.png

http://i33.tinypic.com/2wo8ub9.png

http://i37.tinypic.com/5e7rf7.png

http://i33.tinypic.com/11m9lps.png

http://i36.tinypic.com/121ai5i.png

http://i37.tinypic.com/scrfde.png

http://i36.tinypic.com/2qao5cg.png

http://i36.tinypic.com/i6l1e1.png

http://i35.tinypic.com/264ruqd.png

http://i35.tinypic.com/eqngh0.png
 
© Help Blog - Tutoriais e Dicas | Designed by Thailand Hotels, in collaboration with Tech Updates, Webdesign Erstellen and Premium Wordpress Themes