Caixa de Pesquisa Personalizada 18/02/2014
Olá meus lindos!
Hoje vou fazer um tutorial a vocês como personalizar uma caixinha de pesquisa ,é muito simples.
Então,agora como vocês estão vendo,o blog esta com uma pequena reforma e tals.
Então,a caixinha de pesquisa,eu acho que deixa um ar mais Fofinho no Blog , sei lá, eu acho isso c:
Mais tudo bem,u-u todo mundo tem um opinião!
Mas,gente eu esqueci oque estava falando '-'
Tudo bem lembrei TUTS TUTS.-parey
Nossa,agora eu não tenho tempo para nada,porque agora estou fazendo caminhada no parque u-u não pensem que eu sou gorda,sou muito magrinha ',huehueehue!
Vamos começar a fazer o tutorial??
Ok,vamos lá!
Vá no editor de HTML do seu blog, clique nos três pontinhos do seguinte código:
Agora, aperte Ctrl+F e pesquise por ]]></b:skin>]] , acima disso cole;
.SEARCH{ FLOAT: LEFT; FONT-FAMILY: ARIAL !IMPORTANT;} .SEARCHBAR{ HEIGHT: 20PX; /*ALTURA DA CAIXA*/ WIDTH: 120PX; /*LARGURA DA CAIXA*/ TEXT-ALIGN:CENTER; COLOR:#CORFONTE; BACKGROUND: #BACKGROUND!IMPORTANT; BOX-SHADOW: INSET 1PX 1PX 6PX #DCDCDC; FONT: 11PX ARIAL !IMPORTANT; BORDER: 2PX SOLID #000000; -WEBKIT-BORDER-RADIUS: 10PX; -MOZ-BORDER-RADIUS: 10PX; BORDER-RADIUS: 10PX; } .SEARCHBUT{ BACKGROUND: URL('URL DO BOTÃO'); WIDTH:27PX; /*LARGURA DO BOTÃO*/ HEIGHT:20PX; /*ALTURA DO BOTÃO*/ BORDER: 0; PADDING:2PX; } .SEARCHBUT:HOVER{ BACKGROUND: URL('URL DO BOTÃO HOVER'); WIDTH:27PX; /*LARGURA DO BOTÃO*/ HEIGHT:20PX; /*ALTURA DO BOTÃO*/ BORDER: 0; PADDING:2PX;
As partes em negrito são as que você pode personalizar. Url do botão e url do botão hover é onde você coloca o link da imagem dos botões de pesquisa, respectivamente. Agora, vá no layout do seu blog, adicione um novo gadget de HTML/JS e cole esse código:
<form action=''/search'' class=''search'' method='get><input class=''searchbar'' id=''s'' name=''q'' placeholder='Digite oque Procura'type=''text'' value=''/><input class=''searchbut'' type=''submit'' value=""/></form>Bom,gente,passei meia hora escrevendo esses códigos,espero q se pegarem,comentem,porque porfavor né!!!
É só isso mesmo gente linda,do meu coração,haha amo muito vocês!
Até a próxima.
Marcadores: Tutoriais
0 Comment(s)