Usaremos como exemplo nosso próprio blog, mas o código que vamos mostrar para organizar todos esses acessórios no final das postagens serve para qualquer outro tipo de acessório para blogs que você ache mais útil ou que traga mais vantagens para o blog.
Nós usamos divs para criar duas colunas no final das postagens do blog e dentro de cada coluna colocamos acessórios que achamos uteis, veja abaixo os links dos tutoriais com os códigos que usamos:
Enviar Atualizações por Email
Caixinha com o link da postagem
Botões das Redes Sociais para Compartilhar Posts
Opções para Criar e Colocar Anúncios Google Adsense Blogger
Vamos precisa editar o HTML do blog, portanto é recomendável fazer um backup do template antes de começar. Entre na pagina modelo > editar HTML e marque a opção expandir modelo de widgets.
Agora procure por <data:post.body/> e depois dele coloque o código:
<div style="float:left; width:270px">coluna da esquerda</div>
<div style="float:right; width:300px">coluna da direita</div>
<div style="clear:both"></div>
Os valores 270 e 300 são as larguras das colunas então você deve alterar como achar melhor. Caso as colunas não fiquem lado a lado é porque não há espaço suficiente para elas então diminua a largura das colunas.
Você também pode usar esse código abaixo do código do LinkWithin para assuntos relacionados assim esses novos gadgets ficarão abaixo dos assuntos relacionados do seu blog.
Usamos no exemplo do código o texto coluna da direita e coluna da esquerda como exemplo e para ficar fácil entender o posicionamento de cada uma delas. Nós sugerimos que insira esse código deste jeito no seu blog apenas para testar e depois comece a colocar em cada coluna os acessórios que desejar.
Em alguns casos na hora de salvar o Blogger pode dar erro então será necessário codificar o HTML para XML então veja aqui como resolver problemas com codificação de HTML. Justamente por isso recomendamos que coloque um código por vez e salve assim em caso de erros ficará mais simples descobrir e corrigir o problema no HTML do blog.
Veja também:
Barra com Botões Curtir, Google +, Retweet e Hack Leia mais
Personalizar o Link ou usar Imagens no Hack Resumo da Postagem (Leia mais)
Fazer Pagina com Atualizações mais Recentes do Blog
Queremos agradecer o comentário feito por Joao Carlos perguntando sobre como organizamos esses botões, caixinha com link e outras coisas no final da postagem. Não mostramos o código completo porque entre outras coisas faz parte dele o anuncio do adsense e, além disso, cada blogueiro deve ter opiniões diferentes sobre quais os melhores gadgets para usar no blog.
Você pode me ajudar? Eu tenho um blog e sempre que tento colocar um papel de parede nele, fica dando erro interno. Outra coisa é que sempre que eu acesso o menu layout, o layout fica pela metade tipo, só mostra a navbar o cabeçalho e outro gadget. Ai, o resto fica branco e assim não é possivel organizar os gadgets tipo, mover, adcionar e etc... Por favor, me ajude! Grato!
ResponderExcluirFabiano,
ResponderExcluirObrigado por atende meu pedido.
Abraços,
Mensagem:
ResponderExcluirDecida permanecer feliz e vc e sua alegria formarão um exército invencível contra as dificuldades.
Bom feriado.
Bju
Toninha
normalmente o erro das imagens de fundo acontecem por causa do endereço errado da imagem
ResponderExcluirsobre arrumar o template isso varia muito conforme o modelo por isso é dificil dizer onde é o problema.
Fabiano, é possível colocar um papel de parede no blog pelo editor html.
ResponderExcluiro papel de parede é uma imagem qualquer.... programas que editam html não funcionam bem no blogger porque os códigos tem muitas tags proprias.
ResponderExcluirnormalmente o código da imagem de fundo é assim:
background-image: url(endereço da imagem)
fabiano, vc sabe porque aparece anuncios do adsense no blogspot sem eu solicitar ???
ResponderExcluirobrigado!!!
Bertê se você baixou um template pronto talvez o criador do template colocou o adsense no template para que ele ganhe dinheiro.
ResponderExcluirse for esse o caso quem vai ganhar com o adsense é o criador do template e não você.
essa mesma idéia vale para qualquer outro código que pegou pronto em outros sites....
Olá Fabiano,
ResponderExcluirQueria pedir para você, se você deixa, eu fazer um tutorial para Youtube, de como "Criar e colocar um banner", mas a única coisa que eu vou usar é o seu gerenciador de banner. Posso?
Obrigado,
João Carlos o que não pode é copiar textos ou imagens, isso é plagio, mas falar sobre o mesmo assunto não tem problema.
ResponderExcluirOnde fica data post body
ResponderExcluirWilliam Power entre na pagina modelo e clique no botão editar html, então marque a opção expandir modelos de widgets para achar o post.body no html do seu blog.
ResponderExcluirOi Fabiano, eu queria saber se quando eu colocar o url da imagem pra colocar um background no meu blog eu preciso também colocar o url da imagem nos códigos presentes em todo o editor HTML.
ResponderExcluirAnonimo isso depende de como está seu html.
ResponderExcluirse for um template padrão do blogger pelo trocar a imagem de fundo pela pagina design do modelo sem mexer com os códigos senão precisará editar o html.
mas precisa procurar onde está o estilo certo para mudar a imagem de fundo, infelimente em templates prontos que você acha para download eles podem usar nomes diferentes para os estilos o que dificulta um pouco.
mas procure por background-image..... e faça testes
coloco a imagem no gadgets e quando fecho a pagina ja salva ele nao fica no lugar que arratei.
ResponderExcluiré estranho isso... se clicou para salvar depois que arrastar o gadget deveria funcionar...
ResponderExcluirtente excluir seu histórico de internet... pode ser erro no carregamento da pagina.
Oi Fabiano, no meu blog quando as minhas amigas e os outros leitores dele clicam em seguir o blog pelo twitter sempre dá este aviso:
ResponderExcluirDesculpe...
Não foi possível processar a sua solicitação. Tente novamente ou retorne mais tarde.
Pode me ajudar?? Pq que da isso?
Obrigada, aguardo resposta!
verifique os códigos que colocou no seu blog... tente substituir por outros
ResponderExcluir