Hoje vamos fazer um menu expansível ou então colocar algum conteúdo que só é mostrado ao clicar no título, ele funciona da seguinte maneira aparece somente o título do menu e quando clicamos ele desliza mostrando seu conteúdo e se clicar novamente ele volta a desaparecer. Você pode usar para colocar o que você quiser: texto, uma lista de links, imagens... Para colocar esse menu expansível no blog dá um pouco de trabalho, mas vale à pena, pois o efeito visual dele é muito bom.
Entre na pagina editar html e ache </head> então coloque isso antes dela:
<script src="https://sites.google.com/site/tutoriaisblogger/menu-expan.js" type="text/javascript"></script>
Após isso vá um pouco mais acima e junto com os outros estilos CSS cole esse trecho:
.CollapsiblePanel {
padding: 3px;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
.CollapsiblePanelTab {
margin: 0px;
padding: 2px;
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-style: italic;
}
.CollapsiblePanelContent {
padding: 5px;
background-color: #FFFFCC;
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
font-weight: normal;
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-top-style: none;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;
}
.CollapsiblePanelTab a {
color: black;
text-decoration: none;
}
.CollapsiblePanelOpen .CollapsiblePanelTab {
background-color: #FFCC99;
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: none;
border-left-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;}
.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover {
text-decoration: underline;
color: #0000FF;}
Para modificar as cores que usamos veja como formatar texto, modificar bordas e fazer botões e modifique os estilos CollapsiblePanelContent(conteúdo), CollapsiblePanelOpen .CollapsiblePanelTab(título quando o conteúdo é mostrado) e CollapsiblePanelTab (link para mostrar o conteúdo), reparem que usamos o código as bordas separadamente para cada lado(left, right, top, bottom) isso para fazer parecer uma caixa quando expandimos o menu, então modifique como desejar. Então clique para salvar, por enquanto ainda não aparecerá nada no seu blog.
Entre na pagina designer, adicionar gadget, html/javascript e cole esse código:
<div id="CollapsiblePanel1" class="CollapsiblePanel">
<div tabindex="0" class="CollapsiblePanelTab">título do menu</div>
<div class="CollapsiblePanelContent">Conteúdo Oculto</div>
</div>
<script type="text/javascript">
<!--
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
//-->
</script>
Onde está escrito título do menu é o texto que aparecerá no seu blog, quando alguém clicar nele vai abrir o resto do menu e mostrar tudo que tem dentro daquele menu. Portanto onde escrevemos conteúdo oculto você deve colocar o que desejar links, imagens, enfim qualquer coisa, apenas no caso de imagens cuidado com a largura da coluna do blog onde estará o menu, pois se a imagem for mais larga que o blog provavelmente terá problemas.
Então se for usar mais de desses menus com conteúdo oculto não precisa apenas repetir a ultima parte do código que é para ser colocada pela pagina layout, o restante que fizemos na pagina editar html não precisa de alterações. Mas necessário fazer alguns ajustes, repare que no inicio aparece:
<div id="CollapsiblePanel1" class="CollapsiblePanel1">
e no final:
var CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel1", {contentIsOpen:false});
Onde tem CollapsiblePanel1 continue a contagem modificando no inicio e no final para CollapsiblePanel2 e assim por diante, tome cuidado para não se esquecer de alterar nenhum deles(um no começo e duas vezes no final), outro detalhe é cuidado para não confundir a letra l com o numero 1 quando for modificar a contagem, aconteceu comigo quando estava escrevendo essa explicação. E assim poderá usar quantas vezes quiser o menu expansível no seu blog. Você poderá ver isso em funcionamento em nossa página de duvidas frequentes.
Fizemos uma atualização neste tutorial: 24/04/2010
Veja também:
Como colocar menu com sub menu no blog
Barra de rolagem na lista de blogs
Usar palavras chave e descrição no blog para ganhar mais visitas
Ótima Dica Fabiano, acredito que vou usar esse recurso no meu próximo projeto que iniciarei dia 01/06/2009.
ResponderExcluirAbraços!
Ola Fabiano, vim retribuir a visita, e conhecer teu blog.
ResponderExcluirOtimas dicas.
OBS: Respondi o teu comentario no Pensieri e Parole,
Meire
há algum demo para ver o resultado ?
ResponderExcluiro que sao estilos css?
ResponderExcluirDav7
ResponderExcluirno final da postagem tem nosso link para as duvidas frequentes naquela pagina usamos esse código
Anônimo
estilo CSS são código que usamos para formatar o texto, é toda aquela segunda parte do código .CollapsiblePanel {
padding: 3px;.....
eu quero saber como mudar o modelo do titulo dos menus, tipo o daki o guia rapido esta dentro de uma bolinha e talz poderia fazer um tutorial de como fazer isso ou se ja tiver me manda o link ?
ResponderExcluiro titulo muda no estilo h2 na pagina layout
ResponderExcluirvou escrever sobre isso na próxima semana
Olá Fabiano achei seu blog fantástico porque é muito esclarecedor. Como estou começando agora, ainda estou tateando. Já sou sua seguidora e tiro muitas duvidas aqui. Se vc puder me ajudar gostaria de saber porque quando posto com imagem essa imagem nao aparece para meus seguidores, só aparece o titulo do meu post? É alguma configuraçao que tenho que fazer?Agradeço pela sua resposta e aguardo
ResponderExcluirbjs
não sei se consegui entender bem, mas acredito que está correto só vai aparecer o título mesmo.
ResponderExcluiracho estranho...pq em algumas vezes aparece a foto junto com o titulo e as vezes so o titulo do que foi postado...se vc for no meu blog vai ver na parte dos ~blogs que sigo~....
ResponderExcluirbjs teresa
MaTê - Pensamentos em Orientação
ResponderExcluirvocê está falando da lista de blogs?
lá tem a opção de mostrar ou nao a miniatura de imagens, mas mostrar a imagem vai depender da postagem que cada um faz no seu blog.
oi Fabiano.Quando vc entra na minha pag do blog , ao lado direito aparecem os blogs que eu sigo certo? Voce pode ver que alguns aparecem só o título mais recente de postagem e em outros aparecem além do título de postagem, uma foto junto(a foto que a pessoa postou junto com o artigo). Gostaria que sempre que eu fosse postar, a foto aparecesse junto. Preciso fazer alguma configuração?
ResponderExcluirobrigada e bjs
Teresa
acho que não é possivel, você quer que as miniaturas das imagens que você coloca no seu blog apareçam nos blogs das pessoas que colocaram você na lista de blogs?
ResponderExcluirse for isso não dá, porque essa configuração é feita no blog de quem coloca a lista, no meu caso mostro só o titulo do blog.
Ah entendi! Que pena...mas mesmo assim muito obrigada pelas dicas e paciencia....
ResponderExcluirbjs Teresa
Muito util a dica eu estava querendo aprender está função e me ajudou muito vlew!
ResponderExcluirVisitem o Mu BLog
www.slzinfo.blogspot.com
Meio trabalhoso, mas muito útil pra economizar espaço, além de muito elegante.
ResponderExcluirAdorei!
me responde uma coisa
ResponderExcluiresse menu fica igual ao do site?
(esse site mesmo)
porque quero testar mais antes me responde isto obrigado
e se nao for me fala como posso colocar um menu igual ao do site
fiz uma correção no código, um servidor que hospedava os arquivos saiu do ar, por isso não funcionava.
ResponderExcluirEu nao consegui fazer, deu errado agora além de não funcionar no topo da pagina fica : titulo do menu conteudo oculto e nao acontece nadaa vc podeia me ajudar a tirar isso? obrigado
ResponderExcluirjá testamos e o menu funciona, mas se ao tentar colocar deu problema em alguma outra parte do blog, provavelmente você apagou ou colocou algo em lugar errado.
ResponderExcluirmuita boa dica essa!! e eu tbm gostaria de saber se vocês tem algum poste ensinando colocar esse link's abaixo da postagem que vocês mesmo tem, enviar pro twitter, enviar pro linkou, agregar ao google tem algum codigo ou você pode postar?? gostaria de aprender isso.
ResponderExcluirParaibaxd
ResponderExcluiraqui tem o código para as redes sociais
http://www.dicasparablogs.com.br/2009/05/enviar-para-redes-sociais.html
Fabiano Roberto Muito obrigado pela atenção a mim e a todas as pessoas aqui do blog valeu mesmo cara por dividir a suas ideias com as pessoas!! tava precisando dessse codigo vlw!abraço
ResponderExcluirOlá amigo. Você poderia ensinar como adicionar um menu do programa "Flash Menu Labs" no blogspot?
ResponderExcluirDesde já agradeço!
True Iory
ResponderExcluirvocê deve ter um código html, então coloque pela pagina layout, adicionar gadget, html/javascript
Bom, eu tenho mesmo, mas não funciona! =/
ResponderExcluirNão irei colocar o código pois é muito grande... mas se quiser upo e te passo o link .
Coloquei em um Gadget mas não funfou... nem colocando no CSS direto blog...
Alguam solução?
PS: Se quiser uma parceria entre o GHB e seu blog tamo ae cara!
Ótimo blog!
VALEU PELAS DICAS ABRAÇOS A TODOS
ResponderExcluireu não achei o tal...CollapsiblePanel {
ResponderExcluirpadding: 3px;....., não sei onde fica, me ajuda.
está logo na primeira linha do estilo CSS
ResponderExcluirApós isso vá um pouco mais acima e junto com os outros estilos CSS cole esse trecho:
CollapsiblePanel {
padding: 3px;..
é que o meu blog...não tem um template tradicional, eu peguei um diferente, e ai não acho, rsrsrsrs, fora a minha ignorância pra essas coisas, rsrsrsrsrs, vou tentar, mas mesmo assim...obrigada por me ajudar...abraço.
ResponderExcluirOnde é esse CSS ???????????
ResponderExcluirExplica melhor!
CSS é toda parte de formatação do blog: body{..... e todos os outros parecidos com isso
ResponderExcluirserá que da para ter o hotwords e postagem expansivel?
ResponderExcluirMichel
ResponderExcluireu uso hotwords e postagem expansivel e por enquanto está funcionando
Eu não entendi muito bem.
ResponderExcluirMinhas Dúvidas:
Como Coloco as barinhas todas juntas para ser estilo menu?
Onde coloco o código?
Fala Fabiano tudo bem?
ResponderExcluirCara muito legal este menu, mas ainda tenho uma dúvida: tem como eu colocar um hiperlink, para assim eu colocar só um resumo da matéria e quando quiserem ler o restante do conteudo clicassem no link e cairia na página que está a matéwria completa?
Desde já agradeço...
veja aqui como colocar um resumo da postagem
ResponderExcluirhttp://www.dicasparablogs.com.br/2009/10/mostrar-resumo-da-postagem.html
só mais uma duvida...
ResponderExcluircomo faço para colocar mais de uma matéria no menu pois, não sei se entendi direito o post, mas não consgui colocar mais de um só alterando de CollapsiblePanel1 para CollapsiblePanel2...e estou quebrando a cabeça p/ entender isso...
OBS: adorei seu blog, já utilizei várias dicas dele e perco muitas hosras do dia lendo seus tutorais...
amigo quando VC quiz dizer->vá um pouco mais acima e junto com os outros estilos CSS cole esse trecho: onde exatamente fica essa parte é desculpa aew a ingnorancia rs aguardo resposta
ResponderExcluirna parte junto com os outros estilos CSS, body{...}
ResponderExcluirNão consegui fazer, que peninha, não achei css, o q faço? Saiu um monte de escritos acima do blog, então fiz alguma coisa errada e desfiz..pode me orientar, por favor?
ResponderExcluirFernanda
esse menu é mesmo um pouco complicado de instalar, tente fazer novamente
ResponderExcluirMuito bom! só uma dúvida:
ResponderExcluirComo faço para ajustar a largura e a altura, tô me matando por aqui XD
Abraços.
coloque width: 200px na parte .CollapsiblePanelContent, talvez seja necessário colocar em outras também
ResponderExcluirComo coloco imagens?
ResponderExcluirque imagens? se for no painel que abre é no local onde está escrito
ResponderExcluirConteúdo Oculto
se quiser formatar o botão é no estilo CollapsiblePanelTab
Nossa Fabiano que delicia de ideias aqui postada.
ResponderExcluirEu consegui aprender a fazer um menu com a Elke Barros ,igual a Apple com cores cinzas e tudo mais amigo.
Mas queria algo assim ou seja a ideia de poder mexer a vontade nos codigos da CSS,ou seja nos estilos coisa que o menu em expansão dos demais blogs...
Não da muita beira para isso!!!
Aqui no seu blog aprendi numa boa e vou testa-lo em uns blogs de amigos que estou testando.
Abraços
Oiie
ResponderExcluirAlguem pode me ajudar ?
eu Vi Um menu em uns do seus site "Cidade Web" la tem Uma menu azul..
Poxa você Pode me Mandar o Codigo dele para Eu Coloca em Meu Blog ?
Vlw & Obrigado !
Oiie
ResponderExcluirAlguem pode me ajudar ?
eu Vi Um menu em uns do seus site "Cidade Web" la tem Uma menu azul..
Poxa você Pode me Mandar o Codigo dele para Eu Coloca em Meu Blog ?
Vlw & Obrigado !
seria bom se tivesse ver como ia ficar
ResponderExcluirMEU AMIGO MUITO UTIL SEU TRABALHO
ResponderExcluirMAIS TENHO UM PROBLEMINHA
CONSEGUI FAZER SOMENTE DOIS MENUS ESPANCIVEL
DEPOIS DESSES NÃO CONSEGUI FAZER MAIS
FAÇA CERTINHO MAIS NÃO FICA OCULTO
PRECISO DE UMA AJUDINHA
colocou o código completo desde o javascript?
ResponderExcluirQuando colocar já vai aparecer o menu.
ResponderExcluirassim que colocar o ´codigo completo aparece o menu
ResponderExcluirDepois qual tag coloca o primeiro codigo?
ResponderExcluirOla, kra parabens pelo blog.
ResponderExcluirMas queria esclarecer uma coisa...
Consegui por o menu tudo direitinho mas como adiciono links, postagens?
E tem como eu deixar expansivel os meus menus ja existentes com as postagens e tudo mais?
Tenho um blog de downloads, queria adicionar as postagens com o nome de cada artista no menu expansivel assim como fazemos em qualquer outro menu, só não sei se é possivel porque ainda não consegui.
É possivel?
Desde ja, obrigado!
onde está escrito conteudo oculto, você deve colocar o código dos links,imagens e o que mais desejar, o codigo do link de texto é assim:
ResponderExcluir<a href='http://www.dicasparablogs.com.br/2009/05/criar-um-menu-expansivel-no-blog.html'>Criar um menu expansível no blog</a>
E aí cara, seu site tá excelente, vc me indicou este menu e eu estou colocando no meu site, porém apareceu uma dúvida. Eu não consigo colocar mais de um link no conteudo oculto, o primeiro link fica oculto, mas os seguintes ficam visíveis, o que acontece?
ResponderExcluirValeu,
infelizmente não sei qual o problema, se colocar varios menus era para todos ficarem ocultos até clicar neles. tente novamente e cuidado para não misturar os ´codigos
ResponderExcluirmim bateu uma duvida!!!
ResponderExcluironde eu escrevo os Links?
em que parte do HTML?
eu já tentei e nada eu num sei como é mim respondam o mais rápido possível!!!
veja que na parte do código que você deve adicionar no gadget tem escrito Conteúdo Oculto, é neste lugar que deve colocar os links ou qualquer outra coisa.
ResponderExcluira parte de formatação(estilos CSS) pode ser logo depois e body{...}
vou te mandar o codigo por e-mail pra você dar um aolhada
ResponderExcluirAeee gente eu qria falar uma coisa qeria q explicasse como q bota no nome lá embaixo do "titulo do menu" pq qd eu cliko "titulo do menu"desliza uma coisa pra baixo mas nao ta escrito nada e qria q vcs me ensinasse a como escrever alguma coisa ali
ResponderExcluirtem que colocar o titulo no local indicado no código, mas cuidado na hora de fazer alterações pq se apagar ou trocar alguma coisa que não deveria o código não funciona
ResponderExcluirtem que colocar o titulo no local indicado no código, mas cuidado na hora de fazer alterações pq se apagar ou trocar alguma coisa que não deveria o código não funciona
ResponderExcluirConteúdo Oculto Quando Clico pra Expandir O Menu,Como Faço Pro Menu Ficar Normalmente Funcionado?
ResponderExcluiro menu deste código só aparece quando clica sobre ele, mas pode usar a pesquisa no inicio de nossa pagina para achar outros menus
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirpor exemplo depois de body{....} ou #main{...} isso são estilos css
ResponderExcluiressa parte do conteudo oculto, você coloca o codigo dos links, imagens(banners) e o que mais quiser, mas é claro precisa saber mexer com html para fazer isso, por exemplo o link de texto é assim:
ResponderExcluir<p align="center"><a href="http://www.dicasparablogs.com.br" target="_blank">Dicas para blogs</a></p>
e com imagens assim:
<p align="center"><a href="http://www.dicasparablogs.com.br" target="_blank"><img src="http://img35.imageshack.us/img35/4456/dicas2.jpg" border="0" /></a></p>
Este comentário foi removido pelo autor.
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirveja Como Colocar Submenu no Blog
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluiro menu daquele site é feito com uma imagem de fundo grande e o código do menu horizontal.
ResponderExcluirse nao conseguir fazer escreva para meu email
Este comentário foi removido pelo autor.
ResponderExcluiro menu suspenso é automatico do arquivo do blog, ou então tem que fazer o código manualmente
ResponderExcluirMenu jump
Hey, você tem algum site com exemplo? sabe dizer se alguém entrou em contato alegando alguma falha? ontem eu coloquei no meu blog e estava tudo ok. hoje logo pela manhã não estava funcionando. retirei os códigos e coloquei todos de novo no lugar seguindo as dicas do seu post só pra testar se eu não tinha feito nada errado, fiz sem edição nenhuma pra ter certeza que não era nenhum erro meu, e pronto, tá desse jeitinho mesmo. o nome fica lá, o conteúdo "oculto" fica a mostra e fica tudo muito feio. enfim.. só relatando (:
ResponderExcluirse souber de alguma modificação ou algum outro menu que funcione da mesma maneira no qual eu possa utilizar imagens no título, eu agradeceria muito! no mais, permanecerei com o menu o exemplo de menu no meu blog, só pro caso de voltar ao normal. obrigada desde já!
vamos testar o código e criar uma pagina de demonstração
ResponderExcluirobrigada (:
ResponderExcluirfico esperando!
veja aqui a demonstração http://dicasparablogs.net/menu-expansivel.html
ResponderExcluiratualizamos um arquivo do código, veja que no começo mudamos o endereço <script src="https://sites.google.com/site/tutoriaisblogger/menu-expan.js.....
Eu estava justamente procurando por isso. Bacana! Mas tenho duas dúvidas. A primeira é em que posição dos Estilos CSS eu devo colocar o código de estilo, no início, no fina, depois de que? A segunda dúvida é quanto a terceira parte do código. Primeiro você apresenta a div collapsiblePanel1 e a class collapsiblePanel (sem o 1). Então depois, nas explicações sobre como colocar mais de um menu você coloca a classe com o número 1. Afinal, na div que inicia a terceira parte do código a classe tem ou não o número 1? Valeu.
ResponderExcluira parte CollapsiblePanel1 é uma identificação do menu no caso de crair mais de uma atraves deste estilo seria possivel usar formatação diferente neles
ResponderExcluirGostei da dica.
ResponderExcluiroi Fabiano, entendi isso que você falou. mas eu queria saber se a classe, do primeiro menu tem ou não o 1. É id="CollapsiblePanel1" class="CollapsiblePanel" ou id="CollapsiblePanel1" class="CollapsiblePanel1">? aguardo
ResponderExcluiré como publicamos aqui id="CollapsiblePanel1" class="CollapsiblePanel"
ResponderExcluiro id é ...panel1
Acho que o código parou de funcionar de novo :/
ResponderExcluirporém, não tenho certeza, renomeei o blog e coloquei num novo domínio, isso pode ter de alguma forma louca, interferido?
trocar o dominio não influencia no codigo
ResponderExcluireu já imaginava, mas então, porquê não está funcionando? eu não alterei nada no código e de repente parou de funcionar :/
ResponderExcluirobrigada (:
pode ser um erro momentaneo no site de hospedagem de alguns arquivos, vou verificar, mas se não fez alteração deve voltar ao normal sozinho também
ResponderExcluirentendo (:
ResponderExcluirobrigada mesmo!
Fabiano to com um pequeno Problema Com esse Codigo e teste em dois blogs meus um Com o dominio blogspot e o codigo funcionou Certinho com o mesmo template q eu uso com o Dominio com.br do meu Site queria sabe se e erro do meu dominio ou da configuracão :?
ResponderExcluiré muito estranho isso, não tem motivo para o dominio influenciar no funcionamento do código, infelizmente não sei como resolver isso, mas acho que deve ser algum outro problema
ResponderExcluirBoa noite Fábiano.
ResponderExcluirEu coloquei o slide de postagem no meu blog daí então as abas do menu expansivo não quis abrir. O que pode te dado erro?
http://www.tvsbuna.com
Espero que possa me ajudar!
Abraço!
infelizmente alguns códigos geram conflitos com outros.... seria necessário achar e trocar as variaveis utilizadas neles... mas isso é meio complicado de fazer.
ResponderExcluirnão publicamos outro tutorial com slides das postagens pois aqueles que testamos deu algum tipo de erro em algum dos navegadores ou era complicado demais para instalar
Oi, então, eu estou um pouco perdida, eu não achei onde está : " Entre na pagina editar html e ache ** então coloque isso antes dela: ". Onde fica a página editar html ? :s
ResponderExcluirobrigada !
a pagina editar html fica numa aba da pagina designer.
ResponderExcluirentre no painel do blog , clique em designer, html
Fabiano,
ResponderExcluiré necessário haver o arquivo java, em algum servidor.
Boiei nesta parte. Tambéme stou começando. no seu src= você direcionou para um arquivo java. Tem como eu produzir o mesmo arquivo e colocar no meu próprio servidor para agilizar a abertura do site?
sim é possivel hospedar os arquivos java em muitos sites de hospedagem só precisa do arquivo
ResponderExcluirmuito bom o seu site
ResponderExcluirFabiano, não sei se estou no post certo mas tb não estou sabendo onde procurar. Eu queria criar no meu blog um menu igual a este seu, não precisa das setinhas, mas quero algo com cara de menu mesmo e não aquelas coisas feias de mostrar data como o blogspot/blogger mostrar. Será q vc pode me ajudar? Eu tenho um site de fotografia e queria criar uma postagem para cada trabalho e dispor num menu mais bacana.
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirGina Lima Fotógrafa
ResponderExcluirsobre modificar os marcadores veja aqui: Personalizar gadgets do Blog, é com esse tutorial que colocamos as setinhas...
sobre não mostrar a data é só entrar na pagina design do blog, clicar para editar a postagem, lá tem a opção do que vai ou não mostrar, inclusive a data
Obrigada Fabiano... vou tentar aqui depois...
ResponderExcluirtem como tirar o link debaixo escrito: Widget Slides das Postagens Recentes ?????
ResponderExcluirSamuel
ResponderExcluirvocê não pode retirar esse link...
aff, queria tirar, o slide é otimo, só uq estrago foi o link em baixo D:
ResponderExcluirQuebra um Galho aee '
cooquei aqui ficou belezinha..
ResponderExcluirso quero saber onde coloco os links para as palavras q estao marcadas com a seta..
musicas-- titulo
rap <- link 1
reggae <- link 2 etc
axe <-
hip hop <-
dance <-
house <-
sertanejo <-
marcos
ResponderExcluirisso depende de como faz para colocar essas palavras no blog? são marcadores? se for os links são automaticos...
se for um gadget pode usar o gadget de lista de links que a janela já pede o endereço do site
são postagens..
ResponderExcluirpego o link da postagem.. ou seja, da pagina em q a postagem aparece sozinha.. e coloco onde ?
-------------
alguns outros modelos de menus tem uma opção assim :
< option value = " http: / /link1" / >Link Um
Marcos
ResponderExcluirisso é um menu jump... igual esse para selecionar o perfil que deseja usar para fazer o comentário logo abaixo da caixa... ,veja aqui o código dele: Menu de Salto
ahãm.. tenho esse menu aqui, so q não gostei dele não, o que mais gostei foi o expanssivel ..
ResponderExcluirainda tenho duvidas..mais não vou ficar tomando seu tempo n ..
uma ultima pergunta.. o link coloco onde tem ">Conteúdo Oculto</ ???
apanhei agora .. hhehe
essa parte do conteudo oculto é o que vai aparecer quando clicar na barra do menu
ResponderExcluirok.. percebi, so q a parte q aparece quando clico na barra, aparece em forma de palavra não de links,queria clicar nessa parte que aparece, em seguida abrir a pagina que está a postagem..
ResponderExcluiraxo q não to sabendo explicar direito..
da uma olhada nesse site..onde ta escrito bandas.. é mais ou menos dessa forma q to falando
http://www.baixakireggae.com/
opa..olha eu aqui dnovo..k
ResponderExcluir.... conssegui colocar o menu, perssonalizar, colocar links no menu oculto etc ..
fico 10 !
_______________________
so que quando coloquei outro menu, em outro gadget, em outra parte do blog, um dos menus travou, não expande,so funciona quando excluoo um dos dois, e agora ?
como faço p colocar mais de um menu no msm blog ?
responde so mais essa.. =) porfavor ..
Marcos
ResponderExcluirdeve ser possivel fazer... só que precisa montar o CSS com a formatçaõ dos links
ou seja você usaria todo esse código para cada uma das bandas
((((( CollapsiblePanel1 ))))" class="CollapsiblePanel"<<<--parte de cima
ResponderExcluirvar CollapsiblePanel1 = new Spry.Widget.CollapsiblePanel(((("CollapsiblePanel1)))<<<--parte de baixo
___________________________________________________________________________
conssegui faze.. em
em ((((( CollapsiblePanel1 )))) na primeira linha, so colocar2 no menu2, ou 3 no menu 3..
e em ..
(((("CollapsiblePanel1))) na parte de baixo, so so colocar2 no menu2, ou 3 no menu 3..
e assim vai..
_______________________________
pelo menos aqui ta funcionando assim..
=)
Marcos
ResponderExcluiresse menu envolve varios códigos não é recomendado usar como citou no exemplo o html ficará muito grande e as chances de erros são imensas...
seria melhor baixar um programa para editar html, criar sites e gerar o código nele
pode me tira uma duvida quando eu coloco o menu qualquer que seja quando cliko na paginas aparece essa pagina nao existe oq faço?
ResponderExcluirReinoSombrio
ResponderExcluirvocê está colocando o http:// no endereço dos links? se não colocar dá erro.
por exemplo se colocar na sua pagina um link para nosso blog usando só www.dicasparablogs.com.br vai dizer que a pagina não existe, tem que usar assim: http://www.dicasparablogs.com.br
peço desculpa, eu nao estou a conseguir fazer, apareçe lá omenu mas ele não desaperece nem aparece so fica lá estático.
ResponderExcluirO que faço?
Se poderem mandar a resposta para o mail dafilipe@hotmail.com agradecia muito.
deve ser algum detalhe do código que modificou errado ou não colocou. esse menu expansivel é cheio de detalhes para alterar
ResponderExcluirAchei muito lento este menu
ResponderExcluirOlá, preciso de uma ajuda aqui.
ResponderExcluirQuando eu coloco mais de um item em um dos menus apenas o primeiro fica "escondido". Gostaria que me dissessem aonde eu tenho que modificar (se tiver como modificar) para que todos os itens do menu fiquem "escondidos" e só apareçam quando eu clicar nele.
@Castro todos escondidos? o menu completo?
ResponderExcluirse for para isso precisaria criar um sub menu dentro do outro mas precisa entender de html para fazer isso.
pode usar um programa de editar html para criar o menu e depois usar no blog
Amigo antes de tudo obrigado pela dica. Tinha como mudar a cor quando o visitante passar o mouse em cima do título? Seria interessante para saber que existe outros ítens escondidos... Veja como ficou o seu código em: www.bibliaholistica.blogspot.com.br
ResponderExcluiras configurações estão no código ao passar o mouse é o estilo
ResponderExcluir.CollapsiblePanelTabHover, .CollapsiblePanelOpen .CollapsiblePanelTabHover
que está no final do tutorial
Fabiano, eu adicionei e funcionou perfeitamente, mas existe como eu colocar um texto e adicionar "veja mais" aí quando as pessoas clicarem mostrar o resto, deslizando?
ResponderExcluirsim, o resto só aparece quando passa o mouse
ResponderExcluirOlá Fabiano Roberto,
ResponderExcluirEu coloquei o seu menu no meu blog e estava tudo perfeito até eu comprar o domínio. Quando fiz o encaminhamento do blogspot para o (.com) não recolheu mais...
É possível concertar esse erro?
www.bibliaholistica.com
tente retirar e colocar novamente os códigos com os links do dominio no menu
ResponderExcluirJá tentei, inclusive colocando o menu exemplo que você deu no post (titulo do menu e conteúdo oculto) que não tem nenhum link. Quando eu não direciono para o meu domínio ele não funciona (expande), mas quando eu tiro do domínio ele fica normal.
ResponderExcluir....
Será que o problema não está aqui:
Usar um host de arquivos ausentes? Não
Seu host de arquivos ausentes deve ser um subdomínio no mesmo domínio do seu blog.
http://
Se você especificar um host de arquivos ausentes, o Blogger irá procurar nesse host, caso não consiga encontrar um arquivo especificado no seu domínio regular. Saiba mais.
Olá Fabiano,
ResponderExcluirPara tentar explicar melhor o meu problema resolvi fazer uma página clone. Ambas estão com o mesmo HTML (uma expande o menu e a outra que está sente redirecionada para o domínio não).
http://www.bibliaholistica2.blogspot.com.br/2012/08/visao-holistica-de-hebreus.html
http://www.bibliaholistica.com/2012/08/visao-holistica-de-hebreus.html
Duanny Jorge tem que deixar marcado com a opção não para arquivos ausentes
ResponderExcluirpara criar subdominio é de outro jeito veja aqui:
Como Criar e Configurar um Subdominio no Blog
e marque a opção de redicionamento para o WWW
Deu certo Fabiano. Obrigado por tudo amigo.
ResponderExcluirEu confundi tudo. Não tem um jeito mais fácil de fazer isso? Eu qieria colocar no meu blog, mas quero na posição horizontal. É possível?
ResponderExcluiraqui tem um tutorial mais simples sobre Links lado a lado (menu horizontal)
ResponderExcluirEstava procurando uma dica de como colocar uma caixa expansível no meu blog e não estava achando. Parabéns e obrigado. Já testei e ficou legal. A minha ideia é colocar a caixa expansível no meio do blog, criando mais detalhes de alguns assuntos apenas para os interessados. Testei e ficou legal. Apenas adicionei o código dentro do body, e declarei uma css no lay-out com as caracterísitcas da caixa. Dá um pouco de trabalha mas vai ficar legal.
ResponderExcluirTem como fazer isso nos marcadores ?
ResponderExcluiré possível fazer nos marcadores, mas usando os links em html acho que é mais fácil do que adaptar o gadget marcadores
ExcluirNo meu blog de testes não deu certo... Apareceu o menu, mas ele não estava oculto, já estava expandido e não dá pra esconder
ResponderExcluiracho que foi um problema com o JavaScript externo (https://sites.google.com/site/tutoriaisblogger/menu-expan.js), mas agora parece normal.
ResponderExcluirexclua seu histórico de internet e teste novamente