FÓRUM: julho 2010

Template Classic Style – Com Galeria de Fotos “Fancy JQuery”

Vi esse modelo para site e descobri que estava à disposição para free download. Não resisti em converte-lo para o Blogger. Ficou maravilhoso (sem modéstia nenhuma) não só pela funcionalidade, mas pela beleza do design minimalista. Cores neutras e espaço suficiente para não ofuscar a beleza das fotos.
A galeria Fancy JQuery apresenta um efeito lindo na ampliação das fotos além de funcionar como um slidshow fantástico. As fotos que aparecem ampliadas, podem ter o tamanho que você quiser. Muito bom!!!
Criei 7 páginas estáticas personalizadas para os links, nas quais não aparecem a galeria, nem a sidebar, dando assim um visual de site mesmo.
Veja o modelo DEMO . Clic nas fotos para ver o efeito.

DEMO

DOWNMLOAD XML

DOWNLOAD PASTA ZIPADA

Disponibilizei dois arquivos para download. O primeiro é o código para instalação direta e o segundo é a pasta zipada que inclui as imagens utilizadas no layout (exceto fotos) mais os scripts e imagens da galeria Fancy. Escolha o que quiser, mas eu aconselho a salvar a pasta zipada, hospedar as imagens eu seu próprio site de preferencia, assim como os scripts…Assim, se der algum problema, você já tem tudo organizado.
Propriedades:
Ícones para redes sociais no topo
Menu de navegação “Dropdown”
Galeria de fotos Fancy JQuery
Espaço para “Boas vindas” Editável na página “Layout”
Widget de Posts Relacionados no footer do post
Páginas Estáticas Personalizadas (7)
Footer editável na página “Layout”

Detalhes para instalação

Editar Menu:

No painel, clic em “layout” e depois em “Editar HTML”

Manter a caixa “Expandir modelos de widgets” DESMARCADA e procurar pelo trecho

Mude o endereço do link ( grifado em verde na imagem abaixo) e os nomes (se quiser) “Home”… “Gallery”, etc… (grifados em vermelho).

Detalhe importante:

Os links Retratos, Paisagens, Viagens, Arte e About me são dirigidos para as páginas estáticas.

Os links Cidades e Brasil são dirigidos a uma página de marcadores.

Esqueleto “Layout'’

Editar as fotos da galeria

Clic no elemento indicado na imagem, HTML/JavaScript e na caixa de edição que abrir repare no seguinte código:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyYK-TPqWkJAr37cIaAB0BcQ8gKym61KbOjn0423n3xMKkrAk9fRpzBMSEancG3ySlAcFyzv53jQfss0pdZhQ-pn9dgU8P-q0V4TfSvJqPyGil1vxirGwaY6H_3opKWq1IKjDH5e6ZxiA/s320/v.jpg
" title="pic" class="fancybox" rel="group"> https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikURpcWJvzmmriPN-GWExm0UsLhAL39_oRwIZCttFGh0kdSTcC9YNXKz2USS6GVhoaowGziAA8lEXQ11mldcT1mv1s3KU2zl4bHVE8nr2bNtBPToyl3aGfHSfCy55yCa4gYysl2m9ESQ0/s320/tumb2.jpg"alt="demo" />

Repare que entre as tags

> e

estão os endereços das fotos hospedadas. O Primeiro endereço é da foto grande e o segundo, da foto pequena.
Esse trecho se repete oito vezes porque temos 8 fotos na galeria sendo que para cada quadradinho, usamos duas imagens, a grande e a pequena. Substitua todas as fotos.
Editar a mensagem de “Boas Vindas”

Clic em “Editar” como indicado na imagem e no box que abrir você verá o espaço determinado para o texto apropriado.

Benvindo ao meu blog. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris quis risus ligula. Proin rhoncus felis at ipsum consequat eget commodo libero semper. Morbi sed purus arcu.

Editar as colunas do footer

Clic em “Editar” e no box você verá os códigos e os espaço para editar os textos e links.

Volte sempre. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris quis risus ligula. Proin rhoncus felis at ipsum consequat eget commodo libero semper. Morbi sed purus arcu.

Sobre o Blog

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros

http://demonovoestilo.blogspot.com/p/about-this-blog.html">mais..." />

Trabalhos Recentes

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros

http://demonovoestilo.blogspot.com">mais..." />

Serviços

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent cursus dolor hendrerit lacus egestas sollicitudin. Nullam pharetra commodo sem, sit amet mattis metus vestibulum at. Suspendisse in tellus metus. Ut lobortis gravida magna, et mollis nisl luctus et. Ut quis neque eros

http://demonovoestilo.blogspot.com/p/services.html">mais..." />

Repare que as colunas são direcionadas para páginas estáticas e para a principal, quando o leitor clicar em “mais…”. Aí você pode mudar o texto também para “Leia mais..” por exemplo.
Editar Páginas Estáticas:

Para editar as páginas estáticas, você deve clicar na aba “Postagens” e depois “Editar Páginas”
Clicando na opção “Editar” (sobre a miniatura de página) vai abrir a caixa de postagens onde você poderá inserir imagens e textos apropriados. Depois clic em Visualizar e copie o endereço do Browser (navegador do seu computador) . Cole esse endereço nos links relacionados no menu e nas colunas do footer do template.
Ex 1: No menu
Galerias , Retratos, Cidades, Brasil, Viagens, Arte, About me
Ex2: No footer
Serviços, About this blog
Parece um pouco complicado, mas com atenção, paciência e muita vontade, você consegue instalar esse template lindo e ter um blog profissional, com cara de site.
Caso você queira que eu faça as instalações a adequações a sua necessidade, fale comigo pelo Formulário de Contato ou por email e a gente pode combinar. Claro que o serviço será cobrado.

Atualizado 25/07/2010 e já foi devidamente corrigido.

Download XML
http://www.4shared.com/document/G3mxqwDG/ClassicStyle2010.html

Download psta zipada
http://www.4shared.com/account/file/rDWKWYqO/ClassicTemplate2010.html