Template com menu horizontal, slide, postagens resumidas e posts relacionados.
Apesar de usar o modelo 'antigo' para criar este template, alguns detalhes podem ser modificados em
Designer de Modelo (como algumas fontes).
Sobre o template: Ano passado eu conheci o blog
SimplexDesign e tomei conhecimento do uso de um script que possibilitava mostrar na página inicial, não os últimos posts publicados, mas sim os últimos posts publicados por categoria (marcadores) escolhidas. A ideia de mostrar na página inicial somente os posts de determinados marcadores me pareceu muito interessante e comecei a trabalhar no sentido de entender e aplicar o script. Porém, ele demostrava problemas de exibição no navegador Internet Explore e sem conseguir obter suporte do criador/distribuidor do script, procurei a ajuda de amigos blogueiros. Pude, então, mais uma vez contar com a incrível colaboração do meu amigo
JMiur do blog Vagabundia, que novamente me 'salvou' e fez suas magias, me entregando um script limpo e enxuto, pronto para uso. JMiur, mais uma vez, obrigada :)
Enfim, como expliquei acima,
neste template o que será exibido na página inicial serão os posts relacionados a determinados marcadores que você selecionará dentro do script. Para tanto, procure dentro do código do template o seguinte trecho (clique em Expandir Modelo de Widget e use Ctrl+F para encontrar com facilidade):
imgr = new Array();
imgr[0] = "
http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
aBold = true;
summaryPost =
60; // numero de caracteres do resumo
summaryTitle =
25; //numero de caracteres do titulo
numposts =
3; // numero de resumos por categoria
var contarlabels = 0;
labelname = new Array("
Desfiles","
Gastronomia","
Moda","
Beleza");
labeltitle = new Array("
Desfiles","
Gastronomia","
Moda","
Beleza");
Em vermelho está a url da imagem que aparecerá quando não houver imagens no post. Você pode colocar aqui a url de qualquer outra imagem que preferir.
Onde está em negrito (Desfiles, Gastronomia, etc) substitua pelo nome dos marcadores que você deseja exibir na página inicial.
Cuidado para não remover nenhuma aspa ou vírgula!!
Também procure por:
salida += '<div class="featured">';
salida += '<h3>' + labeltitle[contarlabels] + '</h3>';
salida += salidainner;
salida += '<b><a href="
http://templatefeminina.blogspot.com/search/label/' + labelname[contarlabels] + '?max-results=10">More '+ labelname[contarlabels] +'</a></b>';
salida += '</div>';
document.write(salida);
contarlabels ++;
}
Onde está em negrito, substitua pela url do seu blog. Mais abaixo encontre os trechos:
<script src='
http://templatefeminina.blogspot.com/feeds/posts/default/-/
Desfiles?max-results=3&orderby=published&alt=json-in-script&callback=showrecentposts'/>
<script src='
http://templatefeminina.blogspot.com/feeds/posts/default/-/
Gastronomia?max-results=3&orderby=published&alt=json-in-script&callback=showrecentposts'/>
<script src='
http://templatefeminina.blogspot.com/feeds/posts/default/-/
Moda?max-results=3&orderby=published&alt=json-in-script&callback=showrecentposts'/>
<script src='
http://templatefeminina.blogspot.com/feeds/posts/default/-/
Beleza?max-results=3&orderby=published&alt=json-in-script&callback=showrecentposts'/>
Aqui você vai substituir o link do templatefeminina pela url do seu blog e em seguida colocará o nome dos marcadores (substituindo Desfiles,Gastronomia, Moda, Beleza). Note que aqui os marcadores devem aparacer na mesma ordem que você colocou no trecho lá em cima, entre parênteses, como no meu exemplo.
Para aumentar o número de posts a serem exibidos em cada categoria, mude a numeração aqui:
numposts =
3; // numero de resumos por categoria
e aqui:
<script src='
http://templatefeminina.blogspot.com/feeds/posts/default/-/
Beleza?
max-results=3&orderby=published&alt=json-in-script&callback=showrecentposts'/>
Obs: Se o número de postagens de um marcador for menor que o número determinado no script, nada aparecerá. Por exemplo, se estiver determinado que apareça 3 posts por marcador e você só tiver um post publicado com aquele marcador, não aparecerá nenhum. O número de posts deve ser igual ou maior.
Slide: no código está destacado o trecho relacionado ao slide de maneira bastante explicativa:
<!--INICIO DO SLIDE-->
<div id='s3slider'>
<ul id='s3sliderContent'>
<li class='s3sliderImage'>
<a href='COLOQUE AQUI O LINK DO POST'><img src='COLOQUE AQUI O LINK DA IMAGEM'/></a>
<span>COLOQUE AQUI A LEGENDA<br/>
</span>
</li>
<li class='s3sliderImage'>
<a href='COLOQUE AQUI O LINK DO POST'><img src='COLOQUE AQUI O LINK DA IMAGEM'/></a>
<span>COLOQUE AQUI A LEGENDA<br/>
</span>
</li>
<li class='s3sliderImage'>
<a href='COLOQUE AQUI O LINK DO POST'><img src='COLOQUE AQUI O LINK DA IMAGEM'/></a>
<span>COLOQUE AQUI A LEGENDA<br/>
</span>
</li>
<li class='s3sliderImage'>
<a href='COLOQUE AQUI O LINK DO POST'><img src='COLOQUE AQUI O LINK DA IMAGEM'/></a>
<span>COLOQUE AQUI A LEGENDA<br/>
</span>
</li>
<!--FIM DO SLIDE-->
O tamanho das imagens devem ser de 610px (largura) e 310px (altura).
Antes de baixar o template, por favor, leia as explicações e atente para o fato de que neste modelo, na página inicial, só aparecerão os posts relacionados aos marcadores que você determinar no script.
Para colocar os links no menu, crie uma lista de links e arraste para o espaço abaixo do cabeçalho.
Quero aproveitar e deixar um obrigado ao Fernando do
Blogueiros na Web. Apesar de não estar usando o script como ele modificou, não posso deixar de agradecer o tempo que dedicou tentando me ajudar.
EDIT 14/03/2011 : um novo link para download está disponível com os scripts para o slide dentro do código do template.
EDIT 21/03/2001: um novo link para download está disponível com uma correção para o problema de
duplicidade de texto nas páginas estáticas. Meu agradecimento ao
Raphael Viper que me alertou sobre o problema :)
