Primeiro passo precisamos ocultar o título do blog. Então procure na página editar HTML por algo parecido com o trecho abaixo, não será igual porque cada blog tem a próprio estilo do titulo, mas o importante é #header h1:
#header h1 {
text-align: left;
font-size: 200%;
color: $pageHeaderColor;
margin: 0;
padding: 15px 20px 0 20px;
}
E coloque isso display: none; (inclusive o ponto e vírgula) entre as chaves { }, não importa em qual linha, mas tem que ser dentro das chaves. E clique para salvar.
Isso faz ocultar o título do blog, você não precisa mudar mais nada, ele só vai ocultar, caso resolva mostrar novamente o título basta retirar essa linha que colocamos agora.
Agora veja na pagina layout se aparece o quadro adicionar gadget entre o cabeçalho e as postagens, pois será lá que iremos colocar o código do banner rotativo caso não esteja visível, veja nossa explicação de como fazer isso aparecer essa postagem fala em adicionar elemento de página, pois quando fui publicada era assim que os gadgets eram chamados no blogspot, mas a explicação funciona normalmente. Outra coisa se usar uma imagem no titulo precisa tirar clicando para editar o cabeçalho. Depois disso clique para adicionar um gadget embaixo do cabeçalho, na página que aparece escolha a opção HTML/javascritp e cole o código para criar banner aleatório abaixo:
<script language="JavaScript">
hoje = new Date()
numero_de_imagens = 5
segundos = hoje.getSeconds()
numero = segundos % numero_de_imagens
if (numero == 0){
banner = "URL DA IMAGEM"
}
if (numero == 1){
banner = "URL DA IMAGEM"
}
if (numero == 2){
banner = "URL DA IMAGEM"
}
if (numero == 3){
banner = "URL DA IMAGEM"
}
if (numero == 4){
banner = "URL DA IMAGEM"
}
document.write('<div align="center"><img src="' + banner + '" border=0></div>')
</script>
E já está pronto, mas não se esqueça de colocar os endereços corretos das imagens no código, para alterar esse código aqui tem explicado como alterar o código e adicionar imagens, nessa explicação está dizendo sobre colocar frases, mas o código é idêntico a este que usamos aqui para imagens.
Veja também:
Banners Aleatórios com links
Fabiano,
ResponderExcluirobrigado pela visita...
seu blog agora tá na minha lista de links.
Venho ao seu blog algumas vezes e sempre encontro coisas relevantes.
Conto com sua ajuda tb!
Marcos Lemos - http://ferramentasblog.blogspot.com/
Olá adm, gostaria que desse um exemplo de blog que usa essa esqueminha ai...só pra eu dar uma olhada...OK..
ResponderExcluirneste blog usamos esse código de banner rotativo, só que usamos para mostrar banners de nossos sites.
ResponderExcluirveja no menu ao lado, logo no começo tem um link para receber as novidades por email, depois tem um banner e embaixo o link para comunidade no orkut, esse banner que está no meio muda cada vez que você entra no blog, veja qual é o banner agora e clique f5 ou abra nosso blog em outra janela, provavelmente será outro banner naquele lugar.
vlw mesmo por ter me ajudado....
ResponderExcluirum abraço e sucessos....(mais do q ja tem)...
ah tem um esquema q eu qria saber...
tipo se eu for postar um codigo html, css, java etc....num da pra posrat pq ele some...
como eu faço para postar ele????
tipo nessa postagem....tem os codigos para copiar...
eu qria fazer uns post...mas num da...
O meu não aparece o #header h1
ResponderExcluirO q faço?
I૭ℓąทđą
ResponderExcluiressa explicação funciona para layout do blogspot, você usa um outro template no seu blog.
tente colocar
#header h1 {
display: none;
}
no código html do seu blog
Fabiano como colocar link no banner, esse script mostra a imagem, eu queria colocar um link para abrir o site desse banner que é mostrado vc sabe como inserir o link.
ResponderExcluirFabiano como colocar link no banner, esse script mostra a imagem, eu queria colocar um link para abrir o site desse banner que é mostrado vc sabe como inserir o link.
ResponderExcluirEU QUERIA SABE COMO COLOCAR LINK NAS IMAGENS!
ResponderExcluiraqui tem o código para banners com links
ResponderExcluirhttp://dicasparablogs.blogspot.com/2009/03/imagens-aleatorias-com-link.html
coloquei também no final da postagem caso mais alguém procure por isso
Pow aki no meu nao funcionou nao!!!tem como me ajudar???Aguardando respotas!!!vlw...
ResponderExcluirAi ADM nao concegui faser essa parada ae não estou querendo faser pq eu tenho muitos banners no meu blog!!!tem como me ajudar???Aguardando respotas!!!vlw
ResponderExcluirLord Jack
ResponderExcluirvou tentar achar um jeito mais facil de colocar 3 colunas no blog, mas esse parece ser o unico possível atualmente, mas assim que encontrar publicarei aqui no Dicas para Blogs.
Muito bom seu blog e seu post por ter gostado peguei seu banner. VALEW
ResponderExcluiraprenda-pc-ltda.blogspot.com
eii naum dáh pa mudar a cor do fundo dele naum??
ResponderExcluirentra em contato s puder:
www.vinik9.blogspot.com
a cor de fundo não tem a ver com essa postagem, mas o código é background-color: #FFCC99;
ResponderExcluirentão coloque isso na parte que deseja mudar a cor de fundo, no caso do cabeçalho do blog é #header-wrapper{....
Gostaria de saber se tem um código para fazer o mesmo com swf.
ResponderExcluirprecisaria adaptar esse código, colocando o endereço do swf como variavel e ajustar o html dele na parte final, não tentei fazer, mas deve dar certo
ResponderExcluirEu não achei o #header h1, poderia me ajudar?
ResponderExcluirprocure somente por h1 ou #header-wrapper, mas precisará fazer testes para ver em qual deles é o certo. seu template é diferente então não tem como dizer o lugar exato
ResponderExcluirOlá gostaria de colocar esse sitema um meu blog também, fiz como vc disse ali tudo certinho e não funcionou ;/.
ResponderExcluirse puder me mandar por email uma outra explicaçãozinha agradeçeria.
admin@detudodowns.com.br
http://www.detudodowns.com.br
Grato.
escreva para nós e mande o código do jeito que tentou colocar no seu blog e não deu certo
ResponderExcluirOlá Fabiano eu aqui denovo obrigado pelo codigo ele funciona e muito bem!
ResponderExcluirmas para mim não deu
ele ficou certa de 10px a + para a direita não ficou no tipo ficou torto fora que eu uso uma lista de links como menu emcima do meu banner!
Uma lista de links emcima de um java scrips não rolaria!
Mas o Codigo funciona e atualiza os banners sim!
Obrigado!
Não conseguir Fazer algem pode me ajudar?
ResponderExcluire manda o seu msn no caso que vcs quizerem mexer no meu codigo ai eu ADD vcs sei que essa dica tem mto tempo mais eu queria aprender =/
Kakashi
ResponderExcluirqual foi se problema? precisa hospedar as imagens e substituir no código, se quiser envie o código para meu email como tentou usar no seu blog e deu erro e vou procurar o problema
eu não conseguir fazer eu não achei essa parte : #header h1 {
ResponderExcluirKakashi
ResponderExcluirisso varia um pouco conforme o template procure somente por #header e faça alguns testes para saber qual é o correto
ok vlw vou ver aqui
ResponderExcluireu achei uma assim #header1, .widget, #main1, #sidebar {
ResponderExcluiré que no seu blog tem varios estilos juntos, mas é isso mesmo o trecho que falei #header1 se quiser você pode criar um estilo separado somente com ele
ResponderExcluirOlá Fabiano, mandei um e-mail para você e por favor, leia e responda o meu e-mail. Obrigado! Gustavo Reis
ResponderExcluirOlá Fabiano,
ResponderExcluirAdorei seu blog e suas dicas.
Coloquei, deu certo, apesar de não conseguir excluir o titulo de jeito algum.... bom
Mais o que ue procuro é diferente, queria um banner, que ficasse passando, como aqueles sites que tem a opção 1, 2, 3 e 4 de notícias, saca?
Dai a pessoa pode clicar se quiser que volte a primeira.
Pode me ajudar?
O que será que eu fiz de errado para não conseguir retirar o titulo?
Meu blog: negradoleite.blogspot.com
Valeu
Mia Lopes
ResponderExcluirentendi o que está querendo vou fazer uns testes sobre esse tipo de banner e publicar um tutorial
ok mais ate agora ñ conseguir fazerrr :@
ResponderExcluirColoco o código no gadget com as imagens e tudo mais, e confirmo. Quando vou para o blog, não aparece banner nenhum! Sò um espaço vazio... www.hayleywonline.blogspot.com
ResponderExcluirHayley Williams Online
ResponderExcluirprovavelmente está usando o endereço errado da imagem, envie para meu email o código como está usando e vou procurar o erro
consegui adicionar esse cabeçalho mas assim que entro no blog ele ó mostra as imagens do banner do cabaçalho e nada mais como ajeito isso?
ResponderExcluirveja se alterou o código corretamente... os endereços das imagens estão certos?..
ResponderExcluiré possivel mapear os banners assim??
ResponderExcluirAnônimo
ResponderExcluiré possivel mapear imagens... mas é bom ter um programa que faça isso, pesquise por programa para criar site, editor de html...
Fabiano Roberto,gostaria tentei de varias formas e nao consegui, veja no meu blog como ficou , se tu poder mim ajudar?
ResponderExcluirmeu email é
Rodrigo.universitario@gmail.com
mim diz se tem como tu mim ajudar e eu te mando o meu q eu fiz e tu faz as correções .abraço
Rodrigo-noticias
ResponderExcluira maior parte das vezes o problema é o endereço errado da imagem
envie o ´codigo como usou para meu email e vou olhar
Olá Fabiano,
ResponderExcluirExcelente suas dicas, e que bom que temos pessoas que compartilham de forma voluntária seus conhecimentos.
Gostaria de saber se existe algum código ou maneira de colocar frases aleatórias dentro do cabeçalho do blog, ou seja, junto com a imagem escolhida.
No meu blog há uma frase estática junto ao cabeçalho, gostaria que fossem frases aleatórias. É possível?
Abraços.
é possivel colocar uma frase.
ResponderExcluirvocê poderia colocar na própria imagem do banner ou colocar outro gadget com um código logo abaixo, veja aqui:
Imagens ou frases Aleatórias
se quiser temos um código com frases de nosso outro site: Frases curtas
Obrigado pelo retorno e códigos, Fabiano!
ResponderExcluirColocar acima ou abaixo do banner eu já descobri como se faz, a minha dúvida é como pôr junto ao lado da imagem.
O procedimento seria - Layout - Configurar cabeçalho - e na descrição do blog colar o código com as frases?
Abraços.
Não, o cabeçalho não permite esse tipo de edição.
ResponderExcluirse for colocar as frases em forma de código tem que adiconar um gadget de html/javascript e posicionar esse gadget embaixo do cabeçalho.
Obrigado!
ResponderExcluircomo que ficaria o mesmo código para as imagem alternarem com tempo em segundos ao invés de apenas quando atualizar o site? obg.
ResponderExcluiresse código não tem como trocar a imagem de forma automatica...
ResponderExcluirtente procurar algum código para slides.
veja também esse link: Colocar Slides ( Power Point) no blog
Olá.
ResponderExcluirGosto muito do blog e sempre uso suas dicas. Eu já tinha seguido a explicação uma vez e ficou ótima. Mas hoje, como estava irritada com a quantidade de imagens, resolvi apagar todo o código e refazer a seleção das imagens que ficariam e agora elas não ficam mais centralizadas como antes. Pelo contrário, um pedaço delas fica para fora do espaço. Você poderia me ajudar a consertar isso?
Obrigada desde já.
Shelhass
talvez o problema seja o tamanho das novas imagens que usou em relação a largura total do gadget porque as vezes as margens do gadget ou coluna do blog geram esses problemas de alinhamento por falta de espaço
ResponderExcluir