Hoje vou te ensinar como instalar este, que deve ser usado para exibir posts de uma categoria específica de seu blog. Veja a demonstração:
Slide de posts recentes separados por categoria- como instalar
Vamos trabalhar?
Antes, porém, alguns alertas:
1- Esse slide é responsivo, portanto fica melhor em um template responsivo. Dá pra instalar em um que não seja responsivo, mas o resultado poderá ser diferente.
2- Esse slide pode causar conflito caso haja em seu blog algum outro recurso que use a biblioteca JQuery para funcionar. Tem que testar pra saber se terá conflito ou não.
3- A dica de ouro que sempre dou é: teste antes em um blog de testes que tenha exatamente o seu template real, do seu blog.
Só depois de haver testado e entendido todos os passos e particularidades do slide aplique-o em seu blog real.
E, mesmo assim, sempre faça backup antes de começar. Assim você tem uma cópia de segurança caso algo não fique como deveria ou você desista do slide.
4- Outra dica valiosa é: o blog onde for instalar o slide, mesmo se for de testes, precisa ser público. Blogs privados não distribuem feed e portanto um slide de posts recentes não vai funcionar.
5- O blog onde for inserir o slide precisa também ter ao menos 5 posts na categoria escolhida.
Meu blog-modelo, por exemplo, tem 15 posts no total e 5 na categoria que escolhi para demonstrar.
Entendeu as recomendações?
Então vamos trabalhar!
Agora vá ao painel administrativo de seu blog e clique em Tema.
Aí clique em Editar HTML e dentro da caixa do código-fonte tecle Ctrl+F.
Na barra de busca que expandir digite ]]></b:skin> e tecle Enter para localizar.
Acima dessa tag de fechamento cole o CÓDIGO CSS.
Salve.
Localize </head> e acima dela cole o CÓDIGO JAVASCRIPT.
Salve.
Localize finalmente a tag de fechamento </body< e acima dela cole o CÓDIGO DO PLUGIN.
Sim, é um código bem grande.
Cole e salve.
Agora vá até a aba Layout de seu blog e clique em Adicionar um gadget.
Escolha HTML/JAVASCRIPT e dentro da caixinha que expandir cole o CÓDIGO HTML.
Preste atenção!
No código você verá esse trecho:
<script>
document.write("<script src=\"/feeds/posts/default/-/Vintage?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=showlatestposts1\"><\/script>");
</script>
Troque a palavra Vintage pelo nome da categoria cujos posts deseja mostrar.
Tem que ser grafia exata, do mesmo jeitinho que aparece em seu blog.
Se eu fosse instalar esse slide aqui no blog eu iria mostrar os posts da categoria Dicas para blogs, então eu trocaria Vintage por Dicas para blogs.
Se colocasse dicas para blogs não funcionaria.
Entendeu? Grafia exata!
Colocou sua categoria escolhida? Salve, arraste para baixo de seu cabeçalho e salve a alteração do Layout.
Está feito!
Terminei!
Caso tenha alguma pergunta que não esteja contemplada no tutorial deixe sua dúvida nos comentários e eu ajudo assim que for possível.
Ah, curte o post!
Se for útil pra ti eu fico feliz, e se ganhar uma ajuda na divulgação fico ainda mais contente!
Template personalizado grátis para baixar
Quer baixar gratuitamente o Tema Amanda, do blog onde demonstrei o slide de hoje?
Clique no botão abaixo, leia as informações e baixe o template!
Dias online
Postagens
comentários
Coloquei a palavra que eu queria e mesmo assim não aparece o slider
ResponderExcluirEu também coloquei a palavra, e não aparece o slider.
ResponderExcluirAh, e quando coloquei o código CSS, apareceu esse Erro: Erro ao analisar XML, linha 1768, coluna 3: The element type "b:skin" must be terminated by the matching end-tag "" :(
ResponderExcluirSoraya, se não inserir o código css o slide não vai funcionar.
ExcluirSe está dando erro verifique se não esqueceu nenhum sinal, em geral esse erro acontece quando algum sinalzinho é deixado pra traz
olá. primeiramente, obrigada por disponibilizar esse conteúdo. seu blog realmente é muito legal e util.
ResponderExcluirqueria uma ajuda. o codigo que disponibilizou, não aparece lá no slide o titulo do post. fica a imagem do post, o quadradinho branco na frente e onde deveria aparecer o titulo do post, na frente desse quadradinho branco, nao aparece nada.
Thamiris, em geral isso acontece porque o slide foi colocado dentro da div do header e este não foi preparado para receber mais um elemento.
ExcluirQual o endereço do blog?
olá, fiz duas vezes bem devagar, lendo tudo direitinho e não apareceu o slide, como do da Kamilla e da Soraya, o que pode ter acontecido?
ResponderExcluirNão sei dizer, no blog de testes está normal...
ExcluirEm qual blog está sua tentativa?
Olá tudo bem? Instalei o template Amanda, mas gostaria de tirar essa barra na parte superior será que pode me ajudar ou só indicar quais os códigos que tenho que tirar.
ResponderExcluirNa faq do tema amanda tem um link para o tutorial do menu que usei.
ExcluirAí é só seguir o tutorial ao contrário, ir retirando os códigos ao invés de adicionar e o menu sumirá.
bom dia Elaine! Primeiramente, muito obrigada por compartilhar tanta informação legal com a gente!
ResponderExcluirInstalei esse slide no meu blog teste, porém só apaece a foto e a caixinha branca no slide, não aparece o texto como o título da postagem. Como consigo resolver?
meu blog teste: http://asukaviaja-teste.blogspot.com
Suka, o slide precisa ser colocado exatamente abaixo do cabeçalho.
ExcluirPara isso é preciso desbloquear essa área, que no tema amora é bloqueada pois originalmente não há slide ali.
Para desbloquear localize Cabeçalho no código fonte.
Aí aparecerá um trecho parecido com esse, que precisa ser alterado nas palavras que sinalizei:https://1.bp.blogspot.com/-f7xcMhuR23E/XSTMpjH-c2I/AAAAAAAAAsg/olD6yxoVR4I85to2XdAR3LizsKq2O5TnwCLcBGAs/s1600/ajuste.png
Isso vai liberar a área imediatamente abaixo do header e possibilitar incluir elementos ali, como o slide.
Oi, Elaine, tudo bem?
ResponderExcluirPode me dar uma ajuda? fiz o passo a passo exato como descrito e não funcionou. O Slide não apareceu! :(
Ola, eu queria alterar as abas do menu mas não consigo. Tentei por um tutorial seu que explica como mudar e adicionar links, mas achei confuso. Será que pode me ajudar?
ResponderExcluir