Template Blogger Games

 Antes de apresentar o novo template TNB, devo fazer uma confissão: costumogastar muitas horas de internet entretida com joguinhos em flash. Me diverte, distrai, estimula o meu raciocínio e minha agilidade mental. Enfim, eu gosto. E gosto tanto que tenho vários blogs de jogos no Blogger (os meus jogos preferidos são os do tipo Physics e Escape Room). Para criar meus blogs procurei  por templates que pudessem apresentar na página inicial uma grande quantidade de jogos, mas não tive muita sorte. Assim, passei a modificar o Template Mínima usando o hack de resumos automáticos e um pouco de condicionais. O template que disponibilizo agora é uma versão melhorada dos templates que eu mesma uso e espero que seja útil para quem tem ou pretende ter um blog de games no Blogger.

Blogger Games Template: versão sem slide na sidebar (clique na imagem para ver o blog).

A versão com slide na sidebar pode ser conferida AQUI

O Arquivo para Download contém:

• XML: dois arquivos xml; um com a versão sem slide e outro com  slide; escolha um modelopara fazer o Upload.
• Backgrounds: 10 backgrounds diferentes (na verdade só muda a cor do cabeçalho);
• Imagens: as imagens utilizadas no template;
• Screenshot: captura de telas com indicações dos trechos que devem ser modificados no template (e que constam no tutorial abaixo).

Por favor, antes de instalar o template, leia atentamente as explicações abaixo!

O Template Blogger Games utiliza o hack de resumos automático juntamente com o mesmo script utilizado no Template Feminina, que mostra na página inicial resumos de postagens por categoria. A diferença aqui é que, além de mostrar os resumos por categoria também aparecem os últimos posts publicados. Em Formatação, determine que apareça um número múltiplo de 3 na página inicial. Os resumos por categorias aparecerão abaixo das últimas postagens publicadas (Last Games).
Para editar o script, leia o tutorial do Template Feminina, o procedimento é o mesmo.

Não se esqueça: Você deve colocar o nome dos Marcadores exatamente como os criou, ou seja, se você criou um  marcador todo em letra minúscula (ou só com a primeira em maiúscula, seja como for) você deve colocar exatamente igual no script! Cuidado para não apagar nenhuma aspa ou vírgula. Não se esqueça de colocar a url do seu blog nos locais indicados e o nome dos marcadores na mesma ordem do início do script.

Passo 1: Localize este trecho do código e coloque o nome dos marcadores, exatamente como foram criados, entre aspas duplas e separados por vírgulas. Faça isso, na mesma ordem, na primeira e segunda linha.

Passo 2- Coloque a url do seu blog onde indicado.

Passo 03- Coloque o link do seu blog e o nome do Marcador (na mesma ordem do Passo 01) onde indicado. Não modifique mais nada!

Atenção! :No script está determinado que deve aparecer 3 posts por categoria;se você não tiver no mínimo 3 posts publicados em uma categoria, nada vai aparecer. Por isso, certifique-se de publicar primeiro um mínimo de 3 posts em cada categoria!

Social e Linkbar:

Social é o menu horizontal à esquerda com links para Twitter, Facebook e RSS. Estes links devem ser colocados diretamente no código do template, como mostra a imagem abaixo:

Linkbar: é o menu à direita. Basta criar uma lista de links e arrastar para o topo, em Elementos de Página, como mostra a imagem:

Menu: menu horizontal abaixo do cabeçalho; tal qual a Linkbar, é criado à partir de uma lista de Links em Elementos de Página.

Galeria: uma série de 10 widgets de imagens fixas abaixo do menu. Para editá-las, clicar emEditar, remova a imagem e coloque a imagem do jogo e o link para o post onde ele se encontra. AGaleria é mostrada em todas as páginas mas se você desejar mostrar apenas na página inicial,procure pelo trecho: <div id='galeria'> e acrescente os códigos em vermelho:

<b:if cond='data:blog.url == data:blog.homepageUrl'>

<div id='galeria'>

<b:section class='galeria' id='galeria1' maxwidgets='1' showaddelement='yes'>
<b:widget id='Image89' locked='true' title='' type='Image'/>
</b:section>

.......................................

</div>
</b:if>

Posts: os posts foram adaptados para mostrar jogos e suas descrições, com miniatura das imagens dos mesmo. A estrutura do post que usei foi: código do jogo + class description. Dentro desta class deve ser colocada a imagem do jogo mais a descrição. Para utilizar a class description, vá emConfigurações, Formatação e em Modelo de Postagem coloque o código:

<div class='description'>
</div>

salve a alteração e note que em todo post que iniciar (clicando na Aba HTML do Editor de Postagem) o código aparecerá. Coloque o código do jogo acima de <div class='description'> e antes de </div>, a imagem e a descrição. Deve ficar assim:

Toda imagem colocada dentro de <div class='description'> será reduzida automaticamente. Se não quiser ter uma imagem reduzida ou se desejar escrever um texto que não seja uma descrição do jogo, basta apagar o código antes de escrever seu post.

Post Footer: além dos dados costumeiro (postado por, marcadores, reações, etc), o post-footer conta com os links de compartilhamento do AddThis e posts-relacionados em forma de slide, mais um presente que o JMiur nos oferece (e fiz questão de acrescentar os créditos por seu trabalho no script que ele criou).

Slide: para quem pretende usar a versão com o slide na sidebar, saiba que ele é automático, ou seja, não é preciso editar nada, ele mostra as últimas publicações automaticamente. Este slide é tão bacana que você pode escolher mostrar publicações que não estão na home. Ou seja, se você mostra 9 publicações em Last Games, não vai querer que estas 9 apareçam no slide também, então você determina no script que ele mostre os posts anteriores a estas 9 publicações. Para isso, procure o trecho que aparece na imagem abaixo e modifique o valor apontado para o número de posts que pretende exibir na página inicial:

Aqui, quem nos oferece este recurso genial é a Rô Zanchetta do excelente BloggerSphera. (Aliás, os dois blogs que mais consulto na internet: BloggerSphera e Vagabundia).

Background: o arquivo contém 10 imagens diferentes de backgrounds (na verdade só alterei a cor do cabeçalho). Hospede as imagens em um post, copie a url da imagem escolhida e coloque em body, conforme abaixo:

Outras alterações: Como alterar ícones, favicon, logo, link Jogar!: o arquivo contém imagens apontando para os locais exatos onde as modificações devem ser feitas.

Todas as fontes e cores podem ser alteradas pelo painel do Blogger: clique em Desiner do Modeloe em Avançado.

DEMO 01

DEMO 02

Download:

• Testado nas últimas versões dos navegadores: Internet Explore, Chrome e Firefox. 
• Os jogos e imagens incluídos nos dois blogs onde se encontram os Demos foram retirados do site MochiMedia, que fornece uma quantidade enorme de códigos de jogos em flash de várias categorias.
• A barra no rodapé do Demo 01 é um serviço oferecido pelo site Wibiya (é necessário fazer  cadastro).
• O link para o Templates Novo Blogger não deve ser retirado do rodapé do template!
• Espero que gostem ;)