Olá amores, tudo bem com vocês? Bom, não tenho nada para contar, só tenho um aviso: amanhã eu irei para o shopping, lá vou comprar uns livros, brincar com as minhas amigas, comer etc. Elas vão dormir aqui, então se o blog ficar sem postagens, desculpe :/ Como vai a sua sexta feira 13? Eu realmente não vejo nada de diferente, é só mais um dia, qual é a coisa ruim ou estranha nesse dia? Eu sempre quis saber o porque de a sexta feira 13 ser chamada de sexta do terror, sabe? Acho que teve ser marketing, ou coisa da igreja católica, ou talvez lendas do povo antigo. Acho que é alguma lenda grega.
Enfim, hoje eu trouxe uma caixa de pesquisa bem simples para vocês. Eu aprendi ela lá no Firefiles (Esse nome me lembra firework, não sei o porque, eu sempre assimilo firefiles com firework), tá? Ela é simples, não tem nem botão, é só a caixa mesmo. Mas ela é bonitinha e arrumadinha, fica fofa com a cor certa. Enfim, vejam ela aqui (onde tem menu para tags - I, abaixo do menu). Gostaram? Para saber como usá-la, continue lendo.
Vá para o painel do seu blog, modelo, editar HTML e pesquise por "]]></b:skin", ACIMA dessa tag, cole o seguinte código:
/*------ Caixa de pesquisa (Etc For Me) ------*/
.search{
float: center;
font-family: PF Arma Five; sans serif;
}
.searchbar{
margin-left: -5px;
margin-top: 3px;
height: 20px;
width: 210px;
-webkit-transition-duration: .50s;
text-align: center;
color: #fff;
background: #cordofundodacaixadepesquisa;
font: 8px PF Arma Five;
border: 1px solid #cordabordadacaixadepesquisa;
outline: none;
-moz-box-shadow:inset 0 0 5px #cordasombradacaixadepesquisa;
-webkit-box-shadow:inset 0 0 5px #cordasombradacaixadepesquisa;
box-shadow:inset 0 0 5px #cordasombradacaixadepesquisa;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-box-shadow:0 0 1em #fff;
}
.searchbar:hover{
color:#fff;
height: 15px;
-webkit-transition-duration: .50s;
background: #fundodacaixadepesqusisaemhover;
border: 1px dashed #cordabordadacaixadepesquisaemhover;
outline: none;
-moz-box-shadow:inset 0 0 5px #cordasombradacaixadepesquisaemhover;
-webkit-box-shadow:inset 0 0 5px #cordasombradacaixadepesquisaemhover;
box-shadow:inset 0 0 5px #cordasombradacaixadepesquisaemhover;
-webkit-box-shadow:0 0 1em #fff;
}
.searchbut{
background:;
width:0px;
height:0px;
border: 0;
padding:0px;
}
/*------ Caixa de pesquisa (Etc For Me) ------*/
Depois de arrumar o código como pede (mudando onde diz no próprio código), salve o modelo. Quando salvar, vá em layout, adicionar novo gadget e coloque o seguinte código:
<center> <form action="/search" class="search" method="get"> <input class="searchbar" id="s" name="q" placeholder='' type="text" value="pesquise aqui" /> <input class="searchbut" type="submit" value="" /> </form> </center>
E pronto! A sua caixa de pesquisa personalizada já está em seu blog. Para mudar o texto que fica na caixa de pesquisa, mude o "pesquise aqui" que tem no código em cima. Enfim, espero que tenham gostado do tutorial, como sempre, lógico que pode reblogar, mas com os créditos. Se vocês verem alguém reblogando algo daqui sem os créditos, por favor, me avisem. Ah, uma coisa: Talvez ela fique meio torta no seu blog, é por causa do height. Arrume o height se ela ficar meio torta, o arrume até que fique legal :3
Legal a caixinha.
ResponderExcluirAbraços!
Obrigada :3
ExcluirFicou mega show! Vou usar no meu próximo layout. Posso mudar a cor? Seu blog é lindo :)
ResponderExcluirSegue? http://golden--resources.blogspot.com.br/
Muito obrigada :3 Claro que pode, é para mudar. Haha, e ainda mais, não tem nem cor no código.
ExcluirHehe, não entendo de sexta feira 13 lol. Vou bem tbm >\\< Aproveita o shopping haha ~~
ResponderExcluirÓtimo tutu o/
Xoxo ~
mutant-paradise.blogspot.com
Awn, muito obrigada mesmo <3 Claro que vou aproveitar, é shopping! Hahaahhaha
ExcluirAwwn que linda, gostei mesmo, acho que vou usar ein *u* ASUASUH
ResponderExcluirhtmlandresources.blogspot.com.br
Sério? Muito obrigada :)
ExcluirFica bem fofinho adorei, minha sexta-feira 13 ta mais ou menos shuhus !
ResponderExcluirVanessa Tutoriais~
Valeu :) Que seja para mais do que para menos, ahahhaha.
ExcluirLegal a caixa de pesquisa, gostei :) Kiss, Radioactive
ResponderExcluirFofinha a caixa de pesquisa *-*
ResponderExcluirO shopping da minha cidade é tão sem graça e.e
Obrigada :3 Sério? Ele tem Saraiva ou Escariz? O meu também é, mas as livrarias o salvam.
ExcluirSaraiva? Escariz? kkkkkkkk parece até piada, não tem nada disso aqui, nem livraria, nem loja de roupas com preços que dá pra pagar. É muito sem graça
ExcluirMeu Deus, que chato :( Sinto muito, teve ser triste. Acho que nem MC Donald´s teve ter.
ExcluirAdorei a caixa de pesquisa! Estão construindo um shopping aqui na minha cidade, tá ficado gigantesco, ano que vem já tá pronto *3* Acho que amanhã também vou passear e.e
ResponderExcluirwww.whatnae.com
COMO ASSIM SUA CIDADE NÃO TEM SHOPPING? Nossa, se eu estiver enganada, mil desculpas, mas a sua cidade não tem shopping? Nossa. Como você vai ao cinema? Enfim, obrigada :3 Todos passeiam, haha.
ExcluirAdorei a caixa de pesquisa, muito legal >3<
ResponderExcluirBjs, Jubs ~ l-iterando
Valeu :)
ExcluirAdorei a caixinha de pesquisa, bem lindinha <3
ResponderExcluirShopping? Divirta-se <3
Kiss
With You
Obrigada <3
ExcluirOwwn que fofa <3 e bem kawaii
ResponderExcluircandytendy.blogspot.com
Não gosto de "kawaii", mas enfim, obrigada :)
ExcluirEstá muito fofinha, bem diwa.
ResponderExcluirGostei muito, acho que vou usar no proximo lay.
Beijos
Muito obrigada <3
Excluir
ResponderExcluirOlá!!!, Deus seja contigo, tenha um final de semana abençoado,
amiga que linda amei SUCESSO AMIGA.
Blog: http://arrasandonobatomvermelho.blogspot.com.br/
Canal de youtube: http://www.youtube.com/NekitaReis
Muito obrigada.
ExcluirNossa! Amei a caixa de pesquisa, muito linda e o tutorial está bem explicado, acho que todos conseguirão usar sim :)
ResponderExcluirFiz a postagem que você me pediu no formulário, depois dá uma olhadinha. Seu blog a cada dia fica mais divo o/
Bjoon
Adolescente Nerd
Awnt, muito obrigada <3
Excluir