Caso alguma imagem do blog não esteja aparecendo, por favor, avise nos comentários da postagem em questão!

07/02/2013

Tutorial - Banner que muda a cada acesso:

Antes de começar o tuto, quero falar com todas vocês. Estou vendo um monte de gente desistindo de seus blogs, sinceramente espero que vocês não estejam fazendo isso por causa da queda nos acessos. Como já disse em outro post, os acessos de TODO MUNDO estão caindo. Você pode até pensar "que bom, isso significa menos concorrência!", mas eu não acho bom. O que tenho visto é gente que desiste dos próprios sonhos, para mim isso é lamentável.

Hoje trago a todos o tutorial de como colocar esse banner que uso acima das postagens, que a cada refresh da página aparece um diferente. É bem simples, mas você precisa prestar muita atenção com o código.
O tutorial original é do Dicas para Blogs, mas vou explicar tudo para vocês daquele jeito detalhado que eu sei fazer, espero que seja útil!!!

Antes de começar o tutorial, faça as imagens dos banners e hospede-as no lugar de sua preferência. Neste post tenho algumas dicas de sites que podem servir.

Banner que muda a cada acesso:

Para começar, entre em "Layout" e clique em "Adicionar um Gadget" no lugar onde você quer que o banner fique. Na janelinha que abriu, escolha a opção "HTML/JavaScript". Na caixa chamada "Conteúdo", adicione o código abaixo (deixe o título vazio):

<script language="JavaScript">
hoje = new Date()
numero_de_imagens = 4
segundos = hoje.getMilliseconds()
numero = segundos % numero_de_imagens
if (numero == 0){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 1){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 2){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 3){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
document.write('<p align="center"><a href="' + site +'"target="_blank" rel="nofollow"><img src="' +imagem + '"border="0"><a></p>')</script>

No lugar de URL_DA_IMAGEM, coloque os endereços das imagens que você acabou de hospedar. Em LINK_DO_BANNER coloque os links que você quer para cada banner.
Se quiser mais banners, troque o número que está em vermelho para o número de banners que você deseja e depois acrescente o seguinte código depois do último colchete:

if (numero == N){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER" }

Sendo que no lugar de N você deve colocar o número do banner. Lembre-se que o o código começa com o banner "0", então o último banner deve ser "x-1", sendo que x é o número de banners.
Não entendeu, não é? Eu explico com um exemplo. Digamos que  você queira sete banners. Seu código ficará assim:

<script language="JavaScript">
hoje = new Date()
numero_de_imagens = 7
segundos = hoje.getMilliseconds()
numero = segundos % numero_de_imagens
if (numero == 0){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 1){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 2){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 3){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 4){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 5){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"
}
if (numero == 6){
imagem= "URL_DA_IMAGEM"
site="LINK_DO_BANNER"

document.write('<p align="center"><a href="' + site +'"target="_blank" rel="nofollow"><img src="' +imagem + '"border="0"><a></p>')</script>

Agora entendeu? Não posso explicar mais do que isso sem parecer redundante...
Por último, clique em " Salvar ". Se tudo der certo, seu banner já estará no seu blog, recarregue a página algumas vezes para testar!

Num código similar que eu usei antes, só deu para colocar 20 banners no total, mas não sei se foi por causa do código ou se foi porque eu errei em alguma coisa... Enfim, se descobrir o limite real de banners, acrescentarei a esse tutorial.

Amanhã tem mais Capas para Twitter, não perca!!!

Mil Sweetkisses,
8 Comentários
Comentários

8 comentários:

  1. Adorei!Vou tentar!

    Obrigada pela dica!

    Ah procurei por aqui mas não achei, se não tiver fica uma sugestão de tutorial que gostaria muito, que é personalizar a barra de menu, a barra onde fica marcada as páginas do blog.
    bj

    ResponderExcluir
  2. Realmente, os acessos do meu blog também cairam bastante, mas não vejo por que desistir. É uma coisa que eu gosto, e, mesmo que não sejam tantos acessos ou tantos comentários por dia, não vou parar de fazer. Acho que o pessoal acaba dando muita atenção para um único blog, o que está fazendo mais sucesso, e se esquece que existem outros. É só o que eu acho... Não precisa levar a sério! Heheh!

    Até que o tutorial não é tão difícil quanto eu imaginava... (=

    Beijos, Carol!
    Controvérsias.

    ResponderExcluir
  3. Tutorial muito útil para quem tem parceria com alguma empresa e pretende divulgar o trabalho sem ficar enchendo o blog de propagandas

    ResponderExcluir
  4. Oi, te indiquei pra responder a tag da claigrafia no meu blog: http://it-girlmoderna.blogspot.com.br/
    Vai responder? Beijo!!!

    ResponderExcluir
  5. Adorei a dica do Banner. E não dou muita importância para as quedas de acessos, senão já teria desistido. Bjus!!!

    galerafashion.blogspot.com.br

    ResponderExcluir
  6. Tenho percebido o mesmo, muita gente desistindo do blog, amigos de anos sabe? E não é por causa de acesso, gente muito querida que conheci aqui na net e escreve muito bem. Sei lá... Parece que vão surgindo outras prioridades, não é?
    Confesso que fiquei triste com isso. Mas paciência.

    Adore esse tutorial, pensando aqui se ponho no Reticências... rs Sempre quis algo assim.

    Milhões de beijos

    ResponderExcluir

Related Posts Plugin for WordPress, Blogger...
Posts relacionados