Arquivo do blog em formato Calendário

em 13 de abril de 2015

Ensinei aqui uma forma fácil e simples de personalizar o gadget Arquivo de seu blog.
Recorde: http://www.elainegaspareto.com/2015/04/personalizar-o-gadget-arquivo-do-blog.html
Hoje vou ensinar uma personalização que de vez em quando faço em meus trabalhos de design e personalização de blogs.
Os créditos originais desse hack são de um blog que atualmente está fechado: http://phydeaux3.blogspot.com/


O modelo está presente no Template Pretty, à venda na minha loja de templates à pronta entrega.
Vai lá! Quem sabe você não se encanta e acaba adquirindo um dos templates?


Seguindo o tutorial você terá esse resultado:

Leia atentamente antes de começar

  1. Leia o tutorial todo antes de começar; muitas vezes a gente fica ansioso pra fazer e vai lendo e fazendo, pra no fim descobrir que deveria ter lido antes. Então, siga a dica: leia até se certificar de haver entendido.
  2. Faça antes em um blog de testes, até se sentir seguro.
  3. O blog onde for instalar o recurso precisa ser público, ter o arquivo instalado e configurado como explico no tutorial.
  4. E, claro, a dica da tia Elaine: faça backup de seu template sempre que for editar o código-fonte dele.

Tomadas as precauções, vamos ao tutorial, que apesar da aparente dificuldade é muito simples e fácil, são apenas alguns passos simples.

Para começar você deve ter o gadget Arquivo do blog instalado em seu blog.
Para isso vá em Layout/Adicionar um gadget/Arquivo do blog e configure-o exatamente assim:

como configurar o gadget arquivo do blog

Salve.

Agora vá ao seu painel do blog, clique na aba Modelo, escolha a opção Editar HTML e dentro da caixa de códigos tecle Ctrl+F.
Na barra de pesquisa que abrir digite ]]></b:skin> e tecle Enter para localizar.
Acima da tag localizada cole esse código:

Copiar o 1º código

Ele define a aparência de seu arquivo, coisas como cores, fontes, bordas.
Deixei marcado no código as áreas editáveis, ok?
Edite para que combine com seu blog, e salve.
Claro que por enquanto nada vai aparecer.
Vamos à etapa seguinte.

No menu superior do seu código-fonte, (onde está escrito Ir para um widget) localize o BlogArchive1, que é justamente o seu widget.
Assim:

Trata-se de um código longo, que começa com <b:widget id='BlogArchive1'  e termina com </b:widget>

Você precisa selecionar todo o código, e substituí-lo por este, que fará a personalização ser possível:

Copiar o 2º código

Depois de substituir o código original pelo código que disponibilizei, salve.
Estamos acabando.

Dentro da barra de busca digite </head> e tecle Enter.
ACIMA dessa tag de fechamento cole o 3º código:

Copiar o 3º código

Salve as alterações.
Se tudo deu certo você tem agora um lindo e fofo calendário que marca as suas postagens.

Fiz tudo e não deu certo. O que houve?

  1. Seu blog pode ter algum script que conflite com os códigos do arquivo;
  2. Você pulou alguma parte;
  3. Você colou algum código no lugar errado;
  4. Seu blog é privado (sim, tem que ser blog público);
  5. Você não configurou o Arquivo do jeito que mostrei no começo: lista simples, arquivamento mensal, nome do mês completo.

Sugiro que leia e releia, faça e refaça até ter certeza de que fez tudo certo.
Leia os códigos, em especial o primeiro, ele te dirá onde alterar cores, fontes, etc...



Importante

Já conhece minha Loja de templates à pronta entrega?
Tem novidades lá, templates novinhos, que acabaram de sair da minha fabriquinha de templates.
Vai lá ver, são modelos exclusivos, e com algumas novidades!


Alguém que escreve. Especialista em si mesma. Leitora que lê muito menos do que gostaria. Blogueira por paixão e profissão. Propriedade da Princesa e da Menininha, e de um cachorrinho muito levado chamado Bloguinho. Tentando viver. Sempre.

28 comentários , comente também!

  1. Olá, Elaine! Comentando só pra agradecer...funcionou direitinho. Já usei alguns de seus tutoriais e eles têm me ajudado bastante. No meu blog (que ainda está em construção) já tem lá na página "sobre" uma área de créditos aos blogs que me ajudam e o seu já está lá!

    ResponderExcluir
  2. Oi, Elaine.

    Passando para agradecer aqui no teu blog. Ficou muito bom. Obrigada pelo carinho.

    Bjs.

    ResponderExcluir
  3. Gostava tanto de saber fazer tudo isso que ensina!
    :) bjs

    ResponderExcluir
  4. Oi Elaine,
    Acabei de instalar o calendário, ficou uma graça. Amei a dica. Obrigada por compartilhar conosco.

    Beijos.

    ResponderExcluir
  5. Oi Elaine,

    Instalei o calendário e correu tudo bem, mas os dias da semana estão sendo exibidos duas vezes, teria como me dar uma dica de como concertar isso?

    http://blogrosaexplosivo.blogspot.com.br/p/home.html

    ResponderExcluir
  6. Oi Elaine!

    Coloquei a lista de arquivos do blog no estilo "Hierarquia", mas sempre que clico num mês, ele não se expande para exibir as postagens. Ele atualiza a página inteira... E tenho que usar a barra de rolagem para voltar até onde o abençoado está.
    Será que vc tem alguma dica pra me ajudar?
    Este é o meu bloguito: http://aestranhaestantedagi.blogspot.com.br/

    Beijokinhas!

    ResponderExcluir
    Respostas
    1. Giani, acho que esse script não funcionará em seu blog devido ao fato do seu template ser muito modificado.
      Lamento...

      Excluir
    2. Que pena...
      Mas obrigada mesmo assim! ^_^

      Excluir
  7. Elaine, eu não consigo achar nenhum desses códigos no templante do meu blog! :( Faz tempos que procuro uma forma de editar o HTML, mas nada é encontrado! Me ajude!!

    www.blogisabellefreire.blogspot.com

    ResponderExcluir
  8. Oi Elaine,
    antes demais muito obrigada pelas dicas são fantásticas!! Não sei o porquê mas quando instalei o calendário apareceu com o mês e os dias da semana, mas não com os dias... sabe porquê?
    Obrigada

    https://sweet-timeless.blogspot.com

    ResponderExcluir
  9. Oi Elaine,
    Apliquei o calendário no meu blog assim que você publicou (comentário n.4) e adoro. Só que de uns tempos pra cá percebi que o calendário mostra, por exemplo, 3 dias com posts, porém ao lado do nome do mês aparece o número 2. Analisando hoje o que estava acontecendo, percebi que os dias em que crio um "rascunho" também ficam assinalados no calendário. Será que tem alguma forma de contornar isso?

    Beijos
    patriciaaprendendo.com

    ResponderExcluir
  10. Elaine, sou eu de novo. Depois de algumas tentativas, consegui contornar o problema da exibição de datas dos rascunhos: programei o rascunho para publicação em dias que já tem post publicado, e salvei. Funcionou direitinho! Assim no calendário só aparecem os dias onde realmente tem post publicado.

    Beijos.

    ResponderExcluir
  11. Oi Elaine.
    Passando para agradecer suas dicas que estão sendo maravilhosas.
    Funcionando direitinho.

    Muito obrigada.

    Bjos

    http://historiasexistemparaseremcontadas.blogspot.com.br/

    ResponderExcluir
  12. Obrigada Elaine! Finalmente consegui deixar meu blog a minha cara !

    ResponderExcluir
  13. Como sempre um ótimo post, muito bem explicadinho...
    Ficou lindo...
    Beijo, e obrigado!
    Vivi
    http://coisasdavv.blogspot.com.br/

    ResponderExcluir
  14. Oi Elaine, tudo bom?
    Sempre uso seus tutoriais, é o blog que eu tenho como base pra esse tipo de coisa.
    Coloquei o arquivo no meu blog e está direitinho, só tem um probleminha: os dias do mês que eu postei estão aparecendo de qualquer maneira (dias aleatórios, geralmente um dia a mais do q eu realmente postei).
    Você acha que pode ser erro meu ou talvez seja no seu código????
    Obrigada!

    www.tipoludi.com

    ResponderExcluir
    Respostas
    1. Ludimara, experimente refazer em um blog de testes.
      É o mesmo código que uso em meu trabalho e nunca deu erro...
      bjssss

      Excluir
  15. Olá Elaine

    Será que não tem como mudar a cor, de rosa para outra cor?

    ResponderExcluir
    Respostas
    1. Não sou a Elaine mas acho que posso ajudar né?
      No código que se localiza dentro do tem alguns códigos de cores e é esse que você pode personalizar.
      Abaixo de /*Head Entries */ há uma tag background:#ff458b e é aí que você substitui, muda por exemplo para: #000 que é a cor preta.
      Veja a tabela aqui:http://html-color-codes.info/

      Excluir
  16. Oi Elaine, muito obrigada, eu consegui fazer, ficou lindo!

    ResponderExcluir
  17. Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format =/

    ResponderExcluir
  18. O único problema que deu foi não aparecer os dias do mês! Há alguma forma de resolver?

    ResponderExcluir
  19. Olá, Elaine! Deu certo, ainda bem. Faz tempo que queria colocar. Obrigada, bjs! ♥

    https://colossense.blogspot.com.br/

    ResponderExcluir
  20. Oi Eliane queria. amo seus tutorias... Me diz uma coisa como retiro os links que titulo que aparecem a baixo, pra deixar o o calendario, ja tirei um vez mas agora não estou conseguindo. Obrigado linda!

    ResponderExcluir
    Respostas
    1. Hum, não sei dizer.
      Minha dica é que retire os códigos e recoloque.
      Isso pode acontecer, varia de acordo com cada template...

      Excluir

Olá! Muito obrigada por ler meu blog e obrigada também por se dispor a comentar meus posts. Seja muito bem-vindo(a)!

Importante!
Devido à falta de tempo hábil eu não me comprometo a responder perguntas referentes aos tutoriais postados neste blog.
Pedidos de ajuda individual serão respondidos conforme o meu tempo e disponibilidade permitirem.
Por favor, entenda: comentários sem relação alguma com o post não serão liberados e nem respondidos.

Para saber mais sobre a melhor forma de utilizar este blog leia Termos de uso do blog.



Muito obrigada, fique à vontade para interagir.
Mas lembre-se:
Gentileza, educação e boas maneiras servem também para a vida nos blogs…