» Códigos, Dicas, Templates, Tutoriais para deixar o seu blog do seu jeito!

TEMPLATE SimpleAdSense

ESTE TEMPLATE TEM:

►NA LATERAL DIREITA 2 MENUS COM ABAS SOBREPOSTAS CUJOS CONTEÚDOS PODEM SER EDITADOS ATRAVÉS DO PAINEL "ELEMENTOS DA PÁGINA" OU PELO CÓDIGO HTML ACRESCENTANDO + ABAS OU NÃO;

►É UM TEMPLATE TOTALMENTE CUSTOMIZÁVEL → VOCÊ PODE MUDAR TODAS AS CORES;

►POSSUI 1 SIDEBAR E 1 WIDGET DEDICADOS A ANÚNCIOS DO ADSENSE ATRAVÉS DO PAINEL "ELEMENTOS DA PÁGINA";

►POSSUI 3 COLUNAS NO RODAPÉ;

►RECURSO PARA COLOCAR ANÚNCIOS ADSENSE ENTRE OS POSTS.

(VEJA AS EXPLICAÇÕES SOBRE O MENU EM ABAS EM CONTINUE LENDO)



Clique na imagem para ampliar.

DEMO | DOWNLOAD

Para Configurar as Abas Sobrepostas.
Clique em Layout
►Em Elementos de Página altere o que preferir;
►Em Editar HTML, na caixinha com o código do seu blog faça as alterações necessárias.
▼Clique em Continue Lendo▼

1º►COMO ACRESCENTAR AS WIDGETS NAS ABAS
1º- Clique sobre o número da Aba que você deseja colocar a widget;
2º- Clique em: Editar para alterar o conteúdo da widget que já está naquele número (pode ser apagando a widget e colocando outra ou editando a já existente), ou em Adicionar elemento de página caso este apareça;
►Os TÍTULOS das abas serão sempre o título da widget que você escolher para colocar mesmo que apareça números na página de Elementos de Página.
ATENÇÃO
»O menu em abas funciona com um JavaScript que deve ser hospedado por você;
»BAIXE E SALVE o arquivo java que está em azul:
<script src="'http://www.barelyfitz.com/projects/tabber/tabber.js' type='text/javascript'">;
»Hospede no local de sua preferência substituindo o LINK: http://www.barelyfitz.com/projects/tabber/tabber.js no código do seu template pelo LINK fornecido por sua hospedagem;
»Desta forma não haverá o risco de suas abas não funcionarem, a não ser que você hospede muitos arquivos e sua taxa de transmissão de banda ultrapassar o limite do site de hospedagem.
2º►CONFIGURANDO AS WIDGETS DE POSTS E COMENTÁRIOS RECENTES

Em Layout→Elementos de página:
» A widget de Posts Recentes já estará aparecendo, ou não, por ser a tab ativa em "1", então clique em editar e acrescente o código como está explicado neste link: Widget de Posts Recentes .
»Se a widget de posts recentes não estiver aparecendo clique em Adicionar um elemento de página e coloque a widget que quiser.

» A widget de Comentários Recentes está na tab "2", então clique em 2 e em editar e acrescente o código como está explicado neste link: Widget de Comentários Recentes.

3º►COLOCANDO MAIS ABAS OU MAIS MENUS EM ABAS:
Em Editar HTML, na caixinha com o código do seu blog encontre:
<div id='tabsidebar-wrapper'>

<div class='tabber' id='tab1'>
<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg1' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML1' locked='false' title='Posts Recentes' type='HTML'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg2' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML2' locked='false' title='Comentários Recentes' type='HTML'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg3' maxwidgets='1' showaddelement='yes'>
<b:widget id='Label1' locked='false' title='Marcadores' type='Label'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg4' maxwidgets='1' showaddelement='yes'>
<b:widget id='BlogArchive1' locked='false' title='Arquivo' type='BlogArchive'/>
</b:section>
</div>

</div><!-- End tab1-->

<div class='tabber' id='tab2'>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg5' maxwidgets='1' showaddelement='yes'>
<b:widget id='LinkList2' locked='false' title='Sobre o Blogger' type='LinkList'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg6' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML3' locked='false' title='Como Instalar o Template' type='HTML'/>
</b:section>
</div>

<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg7' maxwidgets='1' showaddelement='yes'>
<b:widget id='HTML4' locked='false' title='Política de Privacidade' type='HTML'/>
</b:section>
<</div>

</div><!-- End tab2-->

</div><!-- End Tabsidebar-->

Obs: tab1 e tab2 representam os menus com abas.

►PARA ACRESCENTAR ABAS:
É simples:
Veja que cada código class='tabbertab' representa uma aba.
☺→Então para acrescentar ABAS você deverá copiar este código base:
<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg1' maxwidgets='1' showaddelement='yes'/>
</div>

e colocar no menu que desejar, lembrando sempre de alterar uma coisa:
Está vendo o código em vermelho:tabberwidg1
► SEMPRE QUE VOCÊ CRIAR UMA NOVA ABA DEVERÁ ALTERAR O NÚMERO 1 PARA OUTRO DESDE QUE NUNCA SE REPITAM.
→No código original eu uso de 1 a 7, então para você acrescentar outra aba deverá começar com o nº8.

Feito isso SALVE o seu código e vá em Elementos de página, lá estará o nº da aba que você criou, Adicione o elemento de página que preferir e pronto, sua aba nova já foi acrescentada.

►PARA ACRESCENTAR OUTRO MENU:
Você deve acrescentar entre os códigos:

<
/div><!-- End tab2-->
►ACRESCENTE AQUI O CÓDIGO BASE ABAIXO◄
</div><!-- End Tabsidebar-->

Este código base:

<div class='tabber' id='tab3'>
<div class='tabbertab'>
<b:section class='tabberwidg' id='tabberwidg#' maxwidgets='1' showaddelement='yes'/>
</div>
</div><!-- End tab3-->

→O terceiro menu será representado por tab3.

→Irá funcionar da mesma forma para acrescentar mais abas tendo que alterar o nº(#) da tabberwidg# por um diferente. (O simbolo # representa o nº)

→ Você também terá que acrescentar um código CSS para o menu novo:

Abaixo deste código:
.tabberlive#tab2 { float:right;
}
.tabberlive#tab2 .tabbertab {
height:200px;
overflow:auto;
}

Acrescente este:
.tabberlive#tab3 { float:right;
}
.tabberlive#tab3 .tabbertab {
height:200px;
overflow:auto;
}

Pronto!
Se quiser, faça estas alterações e APROVEITEM O TEMPLATE!
TEMPLATE SimpleAdSense TEMPLATE SimpleAdSense Reviewed by Áurea on 8/05/2008 Rating: 5

18 comentários:

  1. cara ta dando erro quando tento adicionar qualquer template

    ResponderExcluir
  2. rpz a aba de marcadores n ta aparecendo o nome n, ela so aparece a numero. ja tentei botar ela em outro numero mas o nome continua sem aparecer. pq isso?

    ResponderExcluir
  3. to so esperando sua resposta pra mudar meu template. eu so achei esse e outro com tabs interessantes pra mim. nos dois tem esse problema de alguns widget n aparecer o nome

    ResponderExcluir
  4. os posts sao perdidos na troca de template?

    ResponderExcluir
  5. aconteceram coisas mais estranhas ainda q eh o template tabs 01 n aparecer mais nenhum menu com abas qd eu faco upload =/

    ResponderExcluir
  6. Lucas,
    -A widget de marcadores é colocada a partir do blogger.
    -Os posts não são perdidos, mas as widgets sim, então você tem que salvá-las antes, siga este Tutorial.
    -Sugiro que você crie um blog de testes antes de mudar seu template e estude bem todas as alterações que pretende fazer em seu blog. Aqui e nos blogs que estão em Vale um Clique aqui na sidebar têm muitas dicas para você trocar seu template e ser bem sucedido. Infelizmente não estou tendo muito tempo para ajudá-lo como gostaria.

    ResponderExcluir
  7. eu troquei meu template hj por um q eu achei bonito e espacoso. eu queria mt um desses dois do seu blog com abas mas so se o problema do titulo fosse resolvido. vou ver se encontro outros templates q n tenham esse bug.
    gostou do meu blog?
    vlw pela ajuda

    ResponderExcluir
  8. porra, so faltava essa! fui testar os dois templates q tavam com o problema so pra olhar a pre-visualizacao, por curiosidade, e acabei percebendo q os topicos de todas as abas apareceram com o nome e n com numeros ¬¬
    dps de eu passar a tarde inteira ajeitando o template verde, vou tem q mudar td de nv. ate q enfim vou usar o template simpleadsense! :)
    eu suspeito q esse problema ocorra qd vc bota um certo widget q n tenha conteudo nenhum, como no caso dos marcadores do meu blog q eu n usava e comecei a usar hj
    so vou trocar o template amanha pq sei q vou ter mt trabalho. so q menos trabalho q hj pq ja to pegando a manha

    ResponderExcluir
  9. sim mas eu descobri isso tirando todo os anuncios do adsense e fazendo o teste. mesmo sem outros anuncios, ele n aparece. aquele dois q ta na aba menu eu botei ali pq n consegui botar entre os posts. pra falar a verdade, eu n sei um lugar decente pra botar isso n pq o povo ganha tanto com adsense e eu n consigo :(

    ResponderExcluir
  10. Realmente Lucas,

    Eu ainda não tinha percebido isso. Mas já fiz as alterações para que os próximos downloads tenham este recurso.
    Para você e as outras pessoas que já baixaram este template siga este tutorial que funciona perfeitamente: Hack para exibir os anúncios google entre os posts
    Um abraço

    ResponderExcluir
  11. Aurea. Adorei os seus templates. Só que você devia fazer uns novos! Mais coloridos.

    ResponderExcluir
  12. Ok Jonatan,
    Pode deixar! Farei!
    Um Abraço,
    Áurea

    ResponderExcluir
  13. Estou com o mesmo problema da Angelica ai em cima
    "Estou usando este template em meu blog e ele vêm apresentando um erro qdo faço qq alteração no modo html:
    "Não foi possível salvar o modelo
    Corrija o erro abaixo e envie o seu modelo novamente.
    Mais de um item encontrado com o id: AdSense1. Os IDs de itens devem ser únicos e exclusivos."
    E aí a alteração não é feita.
    Vc pode me ajudar a resolver?"

    ResponderExcluir
  14. Amigos,
    Isto acontece porque o template foi criado com anúncios adsense já configurados, aí o blogger numera cada anúncio como uma id diferente. Ex: Adsense1, Adsense2 etc de acordo com a quantidade de gadgets que vocês colocarem no template.
    Como ele já tinha alguns configurados e provavelmente o seu blog tambám vai dar conflito, então você tem que procurar no html do seu blog assim que instalar o template (Ctrl+F) e alterar apenas o número seguinte.
    Ex: Se tiver 3 Adsense1→ Deixe o 1º Adsense1, altere o 2º para Adsense2 e altere o 3º para Adsense3. Assim você terá ids diferentes para suas gadgets.
    Vou publicar um post explicando isso melhor, por enquanto espero ter ajudado.

    ResponderExcluir
  15. Olá, o link para baixar está corrompido. Gostaria muito de poder usá-lo, será que dá para consertar?

    Abraço

    ResponderExcluir
  16. Bady Boy,
    Link corrigido! Obrigada por falar!

    ResponderExcluir
  17. se souber de mais tampletes assim que ocupam todo o espaco da tela pode postar. eu gosto de template assim. ate hj esse template eh o do meu blog. to pensando em mudar pra o "clips"

    ResponderExcluir

Todos os comentários são lidos e moderados antes da publicação.
Para que seu comentário seja publicado leia a Política de Comentários do Blog no post Regras do Blog

Tecnologia do Blogger.