Assine nosso Feed


Melhores Dicas para Blogueiros

Passe o mouse e veja qual o assunto do tutorial de cada imagem

Personalizar gadgets do Blog

Esse tutorial vai mostrar como é simples formatar o texto dos links dos marcadores do blog e isso pode ser utilizado para formatar qualquer gadget do seu blogger, pois o modo de fazer é o mesmo e funcionará bem em qualquer texto que esteja dentro de um gadget.

Primeiro vamos entrar na pagina editar HTML e procurar pelos marcadores do blog, aperte ctrl+F no seu teclado que aparecerá uma caixa para procurar texto na pagina, então digite o título dos seus marcadores em nosso caso utilizamos o título guia rápido.

html do blogger
Então encontramos a linha:

<b:widget id='Label1' locked='false' title='Guia Rápido' type='Label'/>

O que procuramos aqui é a id do gadget, no caso é label1 que está logo no começo widget id='Label1', então deve ver e usar como está nos marcadores do seu blog.

Depois volte ao começo do código html e procure por body{....}, se precisar ajuda para achar o lugar certo no html do blogger veja aqui:Onde colocar os códigos no blog, então coloque esse código antes dele(body):

#Label1 a{text-indent:15px;letter-spacing: 1px;background-image: url(endereço da imagem);background-repeat: no-repeat;background-position: left;padding-left:15px}
#Label1 a:hover{letter-spacing: normal; font-weight: bold;background-image: url(endereço da imagem);background-repeat: no-repeat;background-position: left}

Aqui você poderá escolher qualquer formatação de texto, imagem de fundo(veja que no código tem endereço da imagem, então coloque uma ou apague aquele trecho), além disso podemos colocar bordas, ou seja, poderá deixar com a aparência que desejar (veja nossa postagem sobre fazer botões). Novamente vamos repetir que neste estilo que acabamos de criar usamos label1 no inicio dele porque é a id dos marcadores de nosso blog, então você usará igual está no seu blog senão não funcionará.

Esse mesmo procedimento serve para formatar o texto de qualquer gadget, basta entrar a id e criar um estilo utilizando o mesmo nome. Mantenha as letras maiúsculas e minúsculas como estão no código do gadget para evitar erros.

Esse tutorial foi feito atendendo alguns pedidos e duvidas sobre como fizemos o nosso menu guia rápido mudando o estilo dos links dos marcadores do blog. Related Posts with Thumbnails
Link desta página
Comentários
153 Comentários

153 Comentários:

Anônimo disse...

um dos pedidos foi meu (sic), mas não imaginei que era tão simples rsrs

Natália disse...

Acho que o outro pedido foi meu... rsrs.
Mas, Fabiano me ajude a identificar no código, a parte que leva os links (marcadores) para a posição left (aqui no blog... estão centralizados).
Valeu!

Fabiano Roberto disse...

se usar esse código que mostramos poderá escolher o posicionamento do link

Anônimo disse...

sou iniciante no blogger e adorei essa dica. amigo teria como dar uma forçinha? queria mudar as postagens do blog para link tipo, meu blog e de imagens e para nao pesa a pagina inical queri mudar para link a pessoa clika e vera a imagem e dexaria seu cometario.

Fabiano Roberto disse...

Anônimo, o que você está procurando na verdade é Mostrar resumo da postagem

' disse...

Eu estou tentando fazer tipo umas JANELAS DE OUTROS Blog para por no meu BLOG tipo uma coluna com icones de blogs alternativos se poder me ajuda serei grato. MSN bruniho.show@hotmail.com

Fabiano Roberto disse...

Bruninho, é melhor você visitar os sites que deseja incluir no seu blog e procurar quase todos tem alguma forma de fazer isso, veja por exemplo em nosso menu no inicio da pagina o item dicas no seu site

lá tem varias maneira de colocar nossas dicas no seu blog

Anônimo disse...

tou tentando perceber onde colocar esse tal código mas não entendo. pode dizer onde?

laura

ઇઉ Mel ☆ mendes♫ ♪ ♫ disse...

Fabiano,quero aderir a esta sua dica,mas me esclalece uma dúvida: os marcadores tem que estar como lista ou cloud? Uso como cloud,funciona se estiver configurado assim? Beijos ;)

Fabiano Roberto disse...

ઇઉ Mel ☆ mendes♫ ♪ ♫
os marcadores deve estar na forma de lista

ઇઉ Mel ☆ mendes♫ ♪ ♫ disse...

Amei,Fabiano. Estava afim de fazer essa personalização nos marcadores a um tempão,ficou tão lindo...Coloquei duas imagens png em forma de tag.Queria colocar essa mesma imagem na palavra marcadores que fica no roda pé das postagens...quando puder,me ensina como fazer? Muito obrigado por mais lição! beijos!

Fabiano Roberto disse...

ઇઉ Mel ☆ mendes♫ ♪ ♫
vou olhar os códigos do blogger e preparar isso

Pâmi Garcia disse...

Olá!

Nossa, muito bom o seu post! Eu estava procurando isso há semanas, achei!! que bom, já fiz as mudanças em meu blog, deu certo!
Obrigada!

Estou escrevendo esse comentário para agradecer e dizer que divulguei no http://kimbah.com , se quiser divulgue seus posts lá tb, e se puder avise aos seus leitores sobre esse novo agragador.

Sei que não gosta de links no comentário, e não espero q vc o aprove, apenas fiz assim por preguiça de enviar email, rs aff q absurdo...rsrs

Abraços! Muito obrigada!!

C.P. ADM disse...

ñ consegui esse html ñ tem no meu blog.



eu sei que ñ é guia´rápido, eu coloquei o marcadores eu eu tenho + não funcionou, o marcado é anime. ajuda ai.

Fabiano Roberto disse...

C.P. ADM

veja aqui: Personalizar gadgets do Blog

Aliine... disse...

Não intendii esta parte (Depois role o código html até o começo de antes de body{....})
é que não entendo muito dessas coisas e não sei oq é esse body e nem oq é rolar o código html.. Me ajudem pliss..

Fabiano Roberto disse...

o trecho body{.. é uma referencia para saber onde estão os códigos da formatação do blog(estilos CSS), é um lugar para colocar códigos que definem tipos de letras, cores de fonte e fundo, bordas e outras coisas

mensagenspublicas disse...

Mais uma boa dica com o certificado de qualidade do dicas para blogs..

=)

Já sigo o seu blog a bastante tempo e tem-me ajudado muito no meu blog...

Continue assim!!

União Galley Fashion disse...

Olá Fabiano, tudo bem ?
Eu tenho meu blog (galleyfashion.blogspot.com.br(,mais a parte do templante no faz conjunto com as da postagens, e só consigo fazer 1 templante na parte de cima.
Gpstaria de saber como colocar as partes do templante assim, e que um parte do templante pareça que está no plano de fundo do blog.
COMO DESEJO: (trashfame.blogspot.com.br)
Achei super lindo o blg deles acima!

Fabiano Roberto disse...

União Galley Fashion
o link que enviou não abriu, use nossa pesquisa no inicio da pagina e certamente achará o que procura

JOAO VICTOR disse...

Eu nao entendi a parte "Depois role o código html até o começo de antes de body{....}"

eu nao achei esse "body{....}"

!!TaahHinara!! disse...

eu queria pf q vc podesse fazer uma postagem de como cria templantes personalizados!! sempre quiz fazer, procurei, procurei a unica coisa q achei foi como fazer sites em hospedagem gratuita!! pf ... acho q fazer templantes poderia aumentar as visitas de meu blog e promover melhor, deixandu meu link no templantes!! li uma postagem sua de como promover o blog ou ter um site de sucesso é alguma coisa assim!! pf msm

Fabiano Roberto disse...

JOAO VICTOR
o trecho body{.. é um estilo CSS, você pode usar como referencia para colocar outros estilos de códigos parecidos com ele que fazem a formatação do blog

!!TaahHinara!!

realmente fazer um blog é bem diferente de um site, não tem como fazer os códigos já prontos para o blogger, você precisa criar as imagens do template e saber um pouco sobre CSS para colocar as imagens no seu template atual.

Anônimo disse...

n consegui fazer o codigo


em q parte eu coloco?


Valeu!

Fabiano Roberto disse...

tem que procurar no seu html por b:widget id='Label1' locked=...

claro que do gadget que deseja personalizar, mas não será exatamente igual a esse devido ao nome e tipo de gadget

Marcos Paulo disse...

Fabiano, eu queria saber como colocar imagem de fundo no Gadget !
essa daí é a explicação ?

Fabiano Roberto disse...

no exemplo que citamos usando o estilo #Label1

se criar um estilo assim:
background-repeat: no-repeat;
background-position: right top;
background-image: url(fundofixo.jpg);}

essa imagem ficaria como fundo do gadget (fundofixo.jpg), veja mais aqui: Posicionar imagem de fundo

ADMIN --- Rui Carlos disse...

(blog de teste)
http://gameskratos.blogspot.com/2009/05/metal-slug.html

Olá...
Bom, estou com o seguinte problema...
no meu template eu não consegui usar esse codigo então consegui com o codigo abaixo
-----------------------------------------------
#HTML1 {
background: url(http://img521.imageshack.us/img521/6554/publicidadew.jpg) no-repeat;
height:90px;
max-height:90px;
max-width:510px;
text-align:center;
padding-top:12px;
margin-bottom:0px;
-----------------------------------------------
Minha intenção era remover a imagem que tinha anteriomente com o codigo background-image:none(pois como eh possivel ver, o template pega a imagem das laterais e coloca ao meio).

como não consegui remover coloquei entaum outra imagem no lugar, só que a imagem ki era pra ser susbtituida fica por cima da outra...

Fabiano Roberto disse...

como essa imagem é um anuncio deveria colocar como um gadget e não como imagem de fundo.

se usar como fundo não é possivel clicar nela

ADMIN --- Rui Carlos disse...

mais essa imagem de anuncio eh pra ser fundo msm...
pq quando eu colocar outra imagem clicavavel ae soh vai soh vai ficar aparecendo o nome publicidade da imagem de fundo....
porem o problema eh que a imagem que deveria ficar apenas na lateral fica da imagem ki eu coloquei para ser o fundo.

Fabiano Roberto disse...

tente criar um estilo assim:

#main .widget-content{background-image:none}

mas não tenho certeza que funcionará bem, pois você está usando duas imagens de fundo no mesmo gadget.

a imagem que aparece e vc quer retirar é a parte de baixo de todos os gadgets do seu blog

http://img522.imageshack.us/img522/4465/barrinha.gif

ADMIN --- Rui Carlos disse...

eu kero retirar apenas "barrinha.gif" do gadget que fica no centro.
só isso...
como eh ki pra usar #main .widget-content{background-image:none}

Fabiano Roberto disse...

sim, faça o teste deste jeito para ver se funciona...

Valenttina disse...

Bom, eu entendi tudo, só que eu ainda não descobri aonde eu tenho que colocar o código.

Aí fala no body do começo. Mas eu realmente não descobri aonde.

Fabiano Roberto disse...

o trecho body é apenas uma referencia de onde estão os estilos CSS do seu blog, mas pode ser em qualquer lugar antes de ]]></b:skin>

Valenttina disse...

Nossa, Fabiano, muito obrigada. Você é realmente muito bom. Finalmente deu certo, e eu consegui colocar o código.

Muito obrigada mesmo, principalmente pela rapidez da sua resposta.

Valenttina disse...

Eu de novo, rs.

Eu tava colocando a minha imagem, mas eu queria que ela ficasse apenas na palavra "marcadores", por exemplo.

Tem jeito?

Fabiano Roberto disse...

entao tem que apagar o código da imagem de fundo e deixar somente o titulo do gadget

Carla Herculana disse...

nao consegui fazer alguem poderia me ajudar.

alex_maycon disse...

Olá Fabiano, tenho uma duvida:

Exemplo: Numa coluna os meus widgets ficam muito afastados um para ao outro, tem um espaço entre cada widget (no final deles para ser exato)... e eu gostaria de diminuir esse espaço, como posso fazer isso??

Fabiano Roberto disse...

qual o endereço do blog? que esta´com esse problema de espaço no final de cada gadget?

A garota do blog disse...

SUPER URGENTE!
estou com uma duvida muito chata, como coloco uma imagem no fundo da minha barra lateral?

Fabiano Roberto disse...

pode usar o código de imagem de fundo no estilo #sidebar na pagina editar html, use nossa pesquisa para achar mais detalhes sobre imagens de fundo

Izabella C disse...

Eu n intendo o q q é HTML e pra q serve!!!Será q voces poderiam me explicar??

Fabiano Roberto disse...

Izabella C
o html é o código que faz a pagina, sei que aprender mexer com esses códigos é complicado mas algumas alterações do blog tem que ser feitas desta maneira

bloco Os Inúteis disse...

cara queria saber se tem como eu colocar tipo um cadastro de cliente no meu blog .
+ ou - assim .
quero vender umas camisas de um ralir dai queria que o interessado entrasse no meu blog realizasse tipo um cadastro e que seu dados fossem enviado por email .
tem como faser isso ?

Fabiano Roberto disse...

você pode usar uma Formulário de Contato para receber as encomendas

Anônimo disse...

Fabiano eu sou nova no blog, o meu é o novo modelo, eu queria que você mostrase como faz para personalizar gadget no novo modelo de blog.

Fabiano Roberto disse...

para personalizar os gadgets como mostramos neste tutorial tanto faz o seu template ser do modelo novo ou antigo, o procedimento é o mesmo, achar a id e criar um estilo com ela

Anônimo disse...

Eu nao intendi oq é rolar HTML?
eu ja editei o codigo do jeito que eu quero pro meu blog mas nao sei onde colocar esse codigo.

Fabiano Roberto disse...

rolar, foi uma maneira de dizer para descer a pagina até achar o código

a. disse...

boas!
entento nada de HTML... pelo que percebi do que li, isto é para mudar todas os fundos do blog.
estou a tentar colocar um fundo colorido apenas em 2 widgets laterais no meu blog. Não consigo escrever nem perceber que código tenho de inserir no html do widget.
pode me ajudar?

Fabiano Roberto disse...

se o gadget esta´com erro tente excluir e adicionar novamente, se não der certo na pagina designer, veja aqui: Apagar Gadget

a. disse...

o gadget não está com erro. a opção geral é as caixas de gadget terem fundo transparente, mas quero configurar uma caixa de texto com uma cor de fundo. e não sei que codigo colocar apenas nessa caixa. obrigada

Fabiano Roberto disse...

é só usar o código como mostramos... e colocar o endereço de uma imagem

beezelmon disse...

olá eu descobri uma maneira de personaliza o gadgets de uma maneira mais facil é assim primeiro procure por .footer-outer .widget h2 {
color: $(footer.widget.title.text.color);
}

de espaço a baixo dessa tag e coloque esta

.sidebar h2 {
text-align:center;
margin:0;
height:30px;
padding:3px 0 .2em 0px;
line-height:1.5em;
font:normal bold 100% 'Trebuchet MS',Verdana,Arial,Sans-serif;
background: url(url da imagem bem aqui) no-repeat left top;
color: #bd470c;
}
.sidebar ul {
list-style:none;
margin:0 0 1.25em;
padding:0;
}
.sidebar ul li {
margin:0;
padding-top:0;
padding-right:0;
padding-bottom:3px;
padding-left:16px;
margin-bottom:3px;
border-bottom:1px dotted #7b3211;
line-height: 1.2em;
}
.sidebar p {
margin:0 0 .6em;
}
.sidebar .clear, .main .widget .clear {
clear: both;
}

caso alguem erre abaixe o modelo do blog no meu de certo mais não sei nos do outros eu descobri personaliza o gadgets na sorte.

beezelmon disse...

ah tbm os marcadores fica personalizados

Ruama Carneiro disse...

O que vc quer dizer com isso: "Depois role o código html até o começo de antes de body{....} coloque esse código"

???

Fabiano Roberto disse...

para colocar o outro código antes do trecho body{....}

vou alterar a postagem e tentar explicar melhor

Ruama Carneiro disse...

Obrigada por explicar melhor. Agora assim encontrei, mas ainda não tá dando certo. Insiro código, mas é como se eu não fizesse qualquer alteração, porque nada aparece, mesmo se eu salvar a alteração. =/

Elias disse...

como eu retiro o background do blog? ou deixo do tamanho da pagina? qual é a linha que devo mudar?

Fabiano Roberto disse...

o background pode estar em varias partes... se for uma imagem é mais facil ver o endereço da imagem e procurar por ele na pagina editar html..

senão normalmente a imagem de fundo fica no trecho body{....

Elias disse...

como faz pra afastar eles pra esquerda? estao muito ddistantes do canto da pagina

Fabiano Roberto disse...

a distancia dos gadgets tem a ver com a largura total do blog ou pode usar padding-left:10px no código do gadget

Tancoso por Robson ferraz disse...

ola fabiano olha gostaria muito voce desse uma olhada no meu blog e me diz o que ta faltando... pois ja li quase todos os seus artigos para melhoralos mas precisa de uma espiadinha de um proficional desde ja agradeço um forte abraço grupodeevangelismodespertaieide.blogspot.com

Tancoso por Robson ferraz disse...

me desculpe por postar o nome do meu blog

Fabiano Roberto disse...

Tancoso por Robson ferraz
tem que procurar descobrir o que seus visitantes gostam... isso é o mais importante.

faça testes, coloque algum gadget e veja se alguém comenta algo, crie enquetes... olhe as estatisticas e veja quais assuntos tem mais comentários ou visitas..

. disse...

Minha dúvida é a seguinte:

Eu queria saber como deixar o título do gadget, quer dizer, a moldura perto dele como um parêntes grande deitado, mais ou menos isso que quero dizer. Espero sua resposta.

Grato.

Fabiano Roberto disse...

você pode criar uma formatação no estilo h2 e usar uma imagem de fundo para fazer essa imagem nos titulos dos gadgets, se não der certo teste também no estilo h3 pois isso varia conforme o template

Los Hermanos Video disse...

Parabéns pelos tópicos, vc ajuda muito que esta começando nesse mundo dos blogs.

Felipe Rocha disse...

Boa noite. Após acompanhar esse tópico ainda continuei com dúvida qto a mudar a cor do fundo de apenas um gadget q eu gostaria.

Matt disse...

olá fabiano sou dono do site www.sosimuladores.com.br, a pouco tempo coloquei um novo template,so que os anuncios do adsense ficam invisiveis tem algum jeito de fazer eles aparecerem com algum codigo? aguardo respostas... abraços

Fabiano Roberto disse...

Matt, tente adicionar os anuncios novamente... talvez o gadget com o anuncio tenha sido excluido na troca de template

Matt disse...

incrivel eles so nao aparecem na pagina inicial em outras paginas aparecem :(

Clovis Sousa disse...

amigos não consegui fazer e colocar o banner para parcerias no meu blog me ajuda por favor!!!

Fabiano Roberto disse...

Clovis Sousa
mas qual o seu problema? criar a imagem do banner, gerar o código... hospedar a imagem...

Heitor disse...

Fabiano, + como faço pra diminuir? não achei no codigo =\!!

Fabiano Roberto disse...

coloque margin-left:20px;margin-right:20px;

e claro ajuste os valores, isso cria uma margem de cada lado do gadget

Heitor disse...

Opa, agora deu =)!!!
Vé so fabiano axo que foje um poco do assunto + e o seguinte, como faço pra modificar a caixa e os comentarios ( tipow deixa transparente ou mudar a cor ) porque o que venho o template e feioso =\! ou então deixa feito o seu.

Vé como é a caixa de comentario que feioso =x!!

> http://i51.tinypic.com/24uzqqf.png


Vlws cara!! abaração!!

Fabiano Roberto disse...

Heitor
procure por estilos CSS tipo: .comment ou #comment... vai achar varios se algum deles tiver background.... apague e veja se resolveu

vai precisar fazer testes até achar onde é o local exato, por isso copie o trecho antes de apagar assim se não der certo poderá colocar de volta

Heitor disse...

Fabiano vé so. Eu fiz oq vc mandou que foi tirar os que tiver background, tirei so que n saio tudo. ficou uma parte ainda.

Acabei gerando + 1 duvida, como faço pra mudar o link.

Vé ae > http://i53.tinypic.com/vfio03.png

O link ta circulado de azul. e a parte cinza ta citado na foto.

Vlws ae cara :)!!

Fabiano Roberto disse...

tem que procurar entre os varios estilos comment... até achar o trecho certo... isso varia conforme o template

Heitor disse...

Putz fabiano Vlwzão cara!! Consegui =D! tirei todos os background agora ele ficou normal =).
Agora vé so cara, quando eu tava testando reparei que tem 1 bug na hora de postar, o código fica pela metade não tem como o visitando colocar o código para pode postar o seu comentário.
Como faço pra ajeitar isso?!

Vé ae >> http://i56.tinypic.com/in5tzd.png


Vlws ae cara, pela sua ajuda :)!!

Fabiano Roberto disse...

Heitor
neste link Retirar espaço em Branco após Comentários do Blogger tem como ajustar essa falta de espaço

Julia-* disse...

Era isso que eu estava procurando,mais eu sou meio novata,e assim,na hora de procurar ''body'' eu botei na barra de pesquisa que abriu quando eu apertei ctrl + f body,e apareceu muitos body,e agora eu não sei em qual eu tenho que botar o link antes.

Heitor disse...

Pow fabiano vlws ae cara!!! deu certo, so que la na tua postagem falava pra diminuir no meu caso foi pra aumentar, não sei o pq + deu certo =D!!!

Agora tem como mudar a cor do fundo onde você coloca o código?pq o fundo ficou branco e meu backgound e preto ai fica tosco =x!!!


Vlws ae mesmo cara!! seu site ajuda muito!!

Fabiano Roberto disse...

Julia-*
o body que falei são os estilos css é depois que fechar as chaves de algo assim body { ..... }

Fabiano Roberto disse...

Heitor
isso já é mais complicado pois os comentarios são um iframe, ou seja ele não faz parte da pagina do seu blog no momento naõ achei como alterar

jonathan disse...

fabiano roberto eu era o beelzemon mais eu testei em um template daqueles que vem única coisa que eu fiz foi colocar antes de ]]> e funcionou antes eu não entedia nada sobre css mais agora entendo melhor

si quiser ver meus dois blogs

http://todostipodownloads.blogspot.com/

http://blogmasterune.blogspot.com/

Heitor disse...

Fabiano, me tira essa duvida.
Quero fazer um menu para meu blogger com imagens, só que eu queria saber se tem algum código que, quando eu botar o mause por cima da imagens ele mude de cor, vamos supor:
Uma imagem escrito "Contato"(com o fundo preto).
Quando alguem passar o mause por cima dessa imagem ela fique( com o fundo vermelho ).
Tem como você me dizer se tem como fazer isso?


Vlws ae :)

Mania de Mulher disse...

Não tem lugar para pesquisar o marcadores de blog então nao achei.

Fabiano Roberto disse...

Mania de Mulher
não entendi... pesquisar o marcadores de blog?

o que está querendo fazer?

Fabiano Roberto disse...

heitor
sobre menu veja aqui Links lado a lado (menu horizontal)

Heitor disse...

Fabiano esse seu código pegou,+ só nos Gadgets laterais ( tanto nas laterais direitas como nas esquerdas ),+ nos gadgets encima do posts ele não pegou =\, eu conseguir achar o código para mudar o background dos Gadgets, + mesmo assim ainda não eliminou o desing que eu fiz para os gadgets das laterais.Queria saber como faço para tirar só esse design do gadget encima do post,já que esse seu código, comigo não funcionou =\.

Vé ae ( esse e o meu blog test ^^ )
> http://i56.tinypic.com/1t7ur8.png

Vlws ae fabiano :)!!

Fabiano Roberto disse...

esse código tem que alterar um gadget por vez

Heitor disse...

Mais fabiano eu fiz isso, mais só funcionou nos gadget das laterais.
No gadget que coloque encima do post, o código não funcionou, por isso queria saber se tem como tirar esse designe, mais só do gadget encima do post.

Fabiano Roberto disse...

mas usou o nome correto do gadget... com letra maiuscula? era para funcionar em qualquer gadget.. só precisa colocar o nome exato no estilo

Heitor disse...

Coloquei tudo certo, até porque meus Gadget são tipo HTML, como tem na sua foto aqui no post "id=HTML1", mesmo colocando certinho ainda não dá ;\.

Fabiano Roberto disse...

não sei qual o problema deste gadget....

mas veja o link que está acima da caixa de comentario: seu perfil no blogger está bloqueado?

não consigo acessar o seu perfil... ou seja não posso saber qual o seu blog

Heitor disse...

Fabiano me tira essas 2 duvidas porfavor.

1- você sabe me dizer qual o Código para eu mudar o Background do blog? queria por uma foto.

Da olhada ai( no meu blog de test).
> http://i54.tinypic.com/16jki6r.png

2 - Tava vendo um site, que ele usa a mesma caixa de mensagem que eu uso, só que no site dele eu vi que ele colocou a caixa dentro de um botão, que quando você clica ele aparece, e quando reclica ele desaparece, achei muito interessante pois diminui mais o espaço dos gadgets. Você sabe como faço isso?

Obrigado fabiano.

Fabiano Roberto disse...

veja aqui Personalizar pesquisa (cores e imagens da caixa de busca)

Adm Kaizu disse...

Olá você sabe me dizer o porque a caixa de postagem minha está dessa maneira? por antigamente ela era mais atualizada.obg

> http://imageshack.us/f/818/imagemxdb.png/

Fabiano Roberto disse...

Adm Kaizu
entre em configurações e vá até o final da pagina, vai encontrar Selecionar editor de postagem

lá poderá alterar o editor, mas isso vale para todos os seus blogs (caso tenha mais de um nesta conta)

ミ★ℓσя∂~yυкι-кυη★彡 disse...

esse body{....}, não sei bem o que ele significa... por exemplo, aonde eu tenho que procurar ele? porque no código do meu blog, ter até que tem vários "bodys", mais não achei nenhum perto dos gadgets...
me ajudem plz!!

Fabiano Roberto disse...

ミ★ℓσя∂~yυкι-кυη★彡
o código body é apenas uma referencia para achar os estilos CSS do seu blog

veja aqui Onde colocar os códigos no blog

Heitor disse...

Fabiano, me diz uma coisa.
Você sabe me dizer como faço para abri uma pagina ou algo parecido no meu blogger + que faça esse função.
- quando aguem acessar meu blogger aparecer essa paginas ( contendo nela um botão "entrar" que redirecione para meu blogger), como se fosse uma apresentação. porque quero por publicidade nela, + para isso queria saber como faço esse método.

Como sempre, muito obrigado cara, você e o único que me socorre ^^.

Fabiano Roberto disse...

Heitor
o blogger não tem pagina de entrada...

Heitor disse...

Ae fabiano blz?
Me tira essas 2 duvidas por favor.

1- Como faço para instalar um gadget em outro ponto do blogger? tipo cabeçalho , rodapé.Da um olhada ai : http://i55.tinypic.com/5cnk9z.png

2- Como faço para que um gadget só apareça na pagina inicial?.

Vlws cara :)!!

Marcela Felippe disse...

Ola Fabiano,é possivel gerar um codigo para fixar no nome do blog e fazer com que este ao ser clicado direcione a pessoa para a pagina desejada?
porque tenho 2 blogs um para divulgar meus produtos e outros posts, e esse outro pra usar como loja entao gostaria de ter como se fosse um botao (shop) que direcionasse quem clicar para este segundo blog.Desculpe a confusao espero que tenha entendidoe que possa me ajudar.

Obrigada

Marcela

Marcela Felippe disse...

Olá Fabiano
Veja se pode me ajudar!gotaria de fazer com que o nome do meu sugundo blog tivesse um codigo e gerasse um botão que eu pudesse colocar no primeiro blog, e que este botão direcionasse quem clicar nele.Desculpe a confusão espero que tenha entendido minha duvida e possa me ajudar.
Obrigada

Marcela

Fabiano Roberto disse...

Marcela Felippe
você pode colocar um link de texto ou imagem de um blog para o outro

isso é igual a qualquer banner

Fabiano Roberto disse...

Heitor
veja aqui Problemas para mover ou adicionar gadgets do blog

e sobre aparecer somente na pagina inicial: Conteúdo diferente nas paginas do blog

Blog da Naty disse...

OLHA SO GOSTARIA DE UMA AJUDA NO MEU BLOG NAO CONSIGO FAZER MAIS DE UMA POSTANGEM EM UMA PAGINA FICA TUDO NA MESMA COMO FAÇO PARA RESOLVER ESTE PROBLEMA

Fabiano Roberto disse...

na pagina inicial ficam varias postagens, as elas são separadas.

Miguxi disse...

Fabiano como faço para adicionar esses Gadgets em locais diferente no meu blogger, feito esse template que achei na net, pois achei muito interessante. Olha ae as imagens deixei em azul pra destacar. Vlws ae =)

Imagem do corpo do template :

http://i56.tinypic.com/21d38tc.png

Imagem dele visualizado :

http://i52.tinypic.com/wkqlau.png

obg.

Fabiano Roberto disse...

deve ter algum erro de margin ou padding com valor maior que os demais... mas não tenho como dizer onde é.

já tentou excluir esse gadget que está fora da posição

Miguxi disse...

+ Fabiano eu n quero excluir n. Eu queria fazer o msm que tem nesse template só que sendo no meu template, porque achei muito legal, pois alivia as laterais do blogger ^^.Você sabe me dizer como faço? pq até agora não achei neguem que consiga me dizer.

Fabiano Roberto disse...

adaptar um template em outro é dificil... precisa aprender um pouco de html e CSS para fazer isso. não tenho como explicar como fazer

Ronaldo Borges - Blog NV disse...

Caro Fabiano, Parabéns pelo seu trabalho e pela ajuda que vc nos da....

meu Blog: http://norteverdadeiro.blogspot.com

ele é dividido em 2 colunas, preciso ACABAR com o espaço vertical entre todos os gadgats da coluna direita..... ja tentei de tudo, não consigo.... se puder me ajudar.... muito obrigado

Fabiano Roberto disse...

esses novos templates são dificeis de alterar... veja se tem padding ou margin no html das colunas.. mas precisa fazer testes para achar

Anônimo disse...

Oi, já fiz as alterações no meu código mas não sei onde colocar. Quando digito "body {" na caixa de pesquisa, aparece vários "body {" em qual eu coloco?

Fabiano Roberto disse...

tente no primeiro... mas verá que eles tem alguma diferente... não devem ser todos iguais

Erico Graeff Fotografia disse...

olá, tem como colocar os marcadores dentro do cabeçalho, como se fosse no lugar do título do blog?

Fabiano Roberto disse...

Erico Graeff Fotografia
você poderia arrastar o gadget dos marcadores para o topo da pagina, mas se fizer isso use a opção Cloud e não lista nos marcadores

*Le kako* disse...

Fabiano, nao consegui achar body{...} oque eu faço ?

Fabiano Roberto disse...

use o ctrl F para achar o body, mas cuidado esse código aparece varias vezes no html, eles são parecidos mas não iguais:
< body >
body {.....
< / body >

*Le kako* disse...

testei no meu blog de teste e nao funciono :/

Fabiano Roberto disse...

*Le kako*
o nome do estilo que vai criar tem tem ser igual ao id... até as letras maiusculas...

por exemplo se o id estiver Label1 e você criar o estilo #label1 não vai funcionar por causa da diferença da letra "l" e "L"

SG-Rafael disse...

ola queria saber como eu coloco um nome na frente dos links de dentro do gaget ex: temos o menu ai em baxo tem equipe como por [new] na frente de equipe deu pra entender obrigado ótimo post

Fabiano Roberto disse...

SG-Rafael
isso pode ser feito com uma imagem pequena ou escrevendo o texto...

claro que tem alguns codigos prontos que fazem isso automaticamente

Turma1307 disse...

ola, minha template é baixada do btemplate, e nao consigo mais adicionar gadgats e nem mudalas de posição, gostaria de saber se tem alguma maneira de " desbloquear isso" Obrigado

Fabiano Roberto disse...

@Turma1307 veja aqui Problemas para mover ou adicionar gadgets do blog

Bela441 disse...

Oiie,aqui é a Bela,vc pode me ajudar,pf responda,eu adorei a dica,mais não achei essa linha no html,eu uso o modelo do bloger simples,será que isso tem a ver?mais oq eu queria mesmo era deixar o titulo do gadgets com uma imagem de plano de fundo,eu tentei mais como disse nao acho aquela linha,já apertei f3 e pesquisei mais não adiantou,pf responda!!

Fabiano Roberto disse...

@Bela441 o procedimento é parecido com esse: Imagem no título da postagem

mas tem que usar no estilo h2 ou h3, precisa testar pois varia conforme o template

Miguxi disse...

Ola, não sei se posso posta isso aqui + estou com essa duvida a tempo...

Eu estava fazendo um Script de um gerador de links premium para colocar em meu blogger. so que ele está acusando esse erro :


Deve haver uma, e somente uma skin no modelo. No entanto, o número de skins encontrado foi: 0

Error 500



Você pode me dizer como faço para ajeitar isso?

Obrigado =).

Fabiano Roberto disse...

@Miguxi não tenho com responder sem saber direito que código era esse

mas normalmente é erro momentaneo se tentar depois deve funcionar

Miguxi disse...

@Fabiano Roberto

Fabiano se você me permitir mandar o Código pelo seu email para você dar uma olhada qual Código se trata. Obrigado pela atenção.

Fabiano Roberto disse...

ok, envie o codigo e vou olhar

Miguxi disse...

@Fabiano Roberto

Olá Fabiano. Já enviei o código :). Obg pela atenção.

Fabiano Roberto disse...

ok, vou responder o email

Nine disse...

Muito bom só ñ to achando body{....}

Eugenio Serlam disse...

meu grande não consegui executar este comando! por favor me ajude de uma forma mais minuciosa. agradeço a colaboração

Fabiano Roberto disse...

Eugenio Serlam
basicamente esse tutorial diz para criar um estilo com o nome do gadget.

Fernando Chagas. disse...

Passei horas tentando fazer isso, não consegui foi nada.
Agradeço ao dono do site, mas, esse tutorial tá muito ruim, não entendo nada. Olha os trechos abaixo:
"então deve ver e usar como está nos marcadores do seu blog" pode explicar isso como mais clareza?

Depois volte ao começo do código html e procure por body{....}, QUAL BODY? TEM MAIS DE 34 BODYS. Não repita as mesmas respostas por favor.

Não quero ser grosso, e nem fui, apenas preciso realmente disso.

Fabiano Roberto disse...

é o trecho body { ... } que tem as chaves

disse...

Olá
gostaria de uma ajuda, instalei o template chamado Oulipo,http://btemplates.com/2010/blogger-template-oulipo/demo/ e eu queria acrescentar lá embaixo uma espécie de rodapé para colocar mais gadgets, como é possível nos designers de modelo do blogguer (tipo 2 colunas ou 3 colunas) para colocar estatísticas, seguidores, etc.. vc saberia como que faz isso, um código? obrigada

Fabiano Roberto disse...

na pagina design do modelo tem como separar o rodapé em colunas

Natália disse...

Ae Fabiano... foi dessa forma que fiz e ficou muito bom, mas como coloco a imagem atras (fundo) do marcador?

Fabiano Roberto disse...

esse código já é uma imagem por tras dos marcadores.

só precisa fazer uma imagem no tamanho certo e depois se precisar corrigir o posicionamento da imagem neste trecho

background-position: left;

Anônimo disse...

Fabiano Roberto eu quero mudar as cores dos gadget do meu blog e deixar assim como o seu dividido em dois lados postagens e gadgets(cores diferentes)tem como?tem como fazer isso com esse código.

Fabiano Roberto disse...

primeiro precisa dividir as colunas depois personalizar as cores, veja aqui: Designer de modelo - Layout e Configurações Avançadas

Código para Blog disse...

Fabiana roberto nesse link que vc me passou não é pra formatar as posições dos GADGETs do blog ???
Eu quero e formatar o plano de fundo dos gadget, pq eu quero dividir as cores(poetagem e gadget)assim como o seu que.Ajudará a visualizar melhor a divisão entre gadget e postagens,assim como o seu,com uma cor unica para p plano de fundo dos gadgets os gadgets.

Fabiano Roberto disse...

Codigo para blog a imagem de fundo do meu blog é no estilo
.main-inner .columns{.... }

mas isso varia conforme o templte.

e o acesso ao seu perfil está bloqueado, ou seja ninguém consegue ver seu perfil ou acessar seu blog clicando no seu nome aqui no comentario.
Permitir acesso ao Perfil Blogger
.

Postar um comentário