Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Criação de Blogs Profissionais e Redes Sociais.

Acessórios Vanessa S.

Slide com Posts Recentes Automático no Blogger

Já publiquei alguns modelos de slide para você usar no seu blog. Você já viu como instalar o S3lider e já viu também como instalar um slide com imagens deslizantes.

Hoje veremos um slide que apresenta as postagens recentes de forma automática.
Este slide funciona em conjunto com 3 tipo diferentes de arquivos javascript: o JQuery, o script S3lider e o script de posts recentes, criado pelo Anhvo.

A Rô Zancheta, do Bloggersphera, conseguiu fazer uma adaptação no script original de posts recentes, conseguindo aliar este script ao script do S3lider, fazendo com que os posts publicados recentemente apareçam automaticamente em forma de slider.
No tutorial da Rô, ela explica como conseguiu fazer tais adaptações, que por sinal, o tutorial dela é uma verdadeira aula, para usuários mais avançados.
Seguindo as explicações da Rô Zancheta, eu testei o código, e fiz umas pequenas adaptações nele, afim de facilitar a instalação e o uso, mas os créditos da adaptação dos scripts são todos dela.

[becape]Antes de mais nada, sempre é bom recomendar que você faça um Backup do seu template antes de prosseguir para evitar transtornos, caso algo saia errado.[/becape]

1º passo – Aplicar os estilos para o Slide:

No painel do blogger, acesse o menu “modelo”, clique em “editar html” e cole este código logo ACIMA da tag ]]></b:skin>


/* s3Slider
--------------------------- */
#slide-wrapper ul li{
list-style:none;
margin:0;
padding:0;
}
/*--- container geral do slide ---*/
#slide-wrapper{
margin:auto;
width:auto; /* coloque um valor na largura se quiser */
}

/*--- container do slide ---*/
#postslide{
height:250px; /* altura total do container */
width:auto; /* coloque um valor na largura se quiser - deve ser a mesma do container */
margin:5px auto;
overflow:hidden;
position:relative;
}

/*--- conteúdo do slide ---*/
#postslideContent{
position:absolute;
top:0;
right:0;
width:auto; /* coloque um valor na largura se quiser - deve ser a mesma do container */
background:#333; /* edite cor de fundo se quiser*/
}

.postslideImage{ /* --Não alterar-- */
display:none;
float:left;
position:relative;
}

/*--- fonte do texto do titulo dos posts ---*/
.postslideImage span{
background-color:#000;
color:#fff;
display:none;
filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity:0.7;
opacity:0.7;
font-size:20px;
left:0;
bottom:0;
padding:20px 15px;
position:absolute;
width:auto; /* coloque um valor na largura se quiser - deve ser a mesma do container */
}

/*--- fonte do texto do resumo do post ---*/
.postslideImage span p{
font-size:12px;
line-height:1.6em;
padding:10px 25px 15px 0;
margin:auto;
}

/*--- estilos dos links ---*/
.postslideImage a:link,
.postslideImage a:visited,
.postslideImage a:hover{
color:#fff; /* você pode alterar a cor dos links */
}

No código acima eu destaquei nas cores azul e verde, os trechos de códigos editáveis, para que você possa alterar as medidas e as cores de acordo com seu template.

2º passo - Instalar o arquivo Javascript do Slider:

Para o funcionamento do slide é necessário utilizar dois scripts:
1) postslide
2) recentpostslide

Clique nos links de cada arquivo acima para fazer o download automaticamente e veja neste artigos, uma relação de Sites para hospedar arquivos javascripts.
Depois de hospedados, você deverá acrescentar os arquivos no seu template.

Volte no menu "modelo", entre na edição html e cole o seguinte código logo ACIMA da tag </head>


<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js' type='text/javascript'/>
<script src='URL-DO-ARQUIVO-POSTSLIDE' type='text/javascript'/>

<script type='text/javascript'>
$(document).ready(function() {
$(&#39;#postslide&#39;).postslide({
timeOut: 6000});
});
</script>

3º passo - Escolhendo local que ficará o slide para Incorporar o script de posts recentes:

Agora escolha o local onde quer posicionar o seu slide.
Você pode instalar o slide logo abaixo do cabeçalho, ou pode instalá-lo acima da coluna de postagens, em "main".

Esta parte é muito importante e a mais complicada, preste bastante atenção, pois você precisará editar o código para ajustar o slide de acordo com o local que você escolher.
Vou explicar abaixo 2 exemplos de locais para você escolher e instalar o slide.
Eu aconselho, que após a instalação do slide no local que você escolheu, você volte no código CSS (1º passo) e ajuste as medidas de "width".

1. Instalar o Slide abaixo do cabeçalho:

? Templates nativos e/ou modificados:

Para instalar seu slide abaixo do cabeçalho, você deverá verificar se no seu template a div crosscol está visivel. Caso não esteja, é necessário que você habilite-a no seu template.
Veremos como fazer isso, a seguir.

Volte na edição HTML do seu blog, NÃO marque "Expandir Modelos de Widgets" e procure por:


<div id='crosscol-wrapper' style='text-align:center'>
 <b:section class='crosscol' id='crosscol'/>
</div>

Substitua tudo por:


<div id='crosscol-wrapper'>
<!-- Slide Posts Recentes início -->
<div id='slide-wrapper'>
<div id='postslide'>
<script type='text/javascript'>
imgr = new Array();
imgr[0] = &quot;http://lh3.ggpht.com/_UCfxgWHzU98/TJe2iGJDFPI/AAAAAAAADlQ/Kl037bivjzg/no-image.jpg&quot;;
showRandomImg = true;
imgwidth = 660; <!-- ajuste a largura da imagem -->
imgheight = 250;
summaryPost = 140;
startpost = 1;
numposts = 7; <!-- numero de posts que aparecem no slide -->
home_page = &quot;<data:blog.homepageUrl/>&quot;;
</script>
<script src='URL-DO-ARQUIVO-RECENTPOSTSLIDE' type='text/javascript'/>
</div>
</div><!-- Slide Posts Recentes fim -->

<b:section class='crosscol' id='crosscol'/>
</div>

Em imgwidth = 660; você deve colocar a largura da imagem de acordo com a mesma medida total do seu template. Pode ser a mesma medida que está em "outer-wrapper".

Caso não tenha a div crosscol no seu template, basta acrescentá-la, abaixo de
<div id='content-wrapper'>

 

 

2. Instalar o Slide acima da coluna de postagens:

? Templates nativos e/ou modificados:
Se você quiser que seu slide fique logo acima da coluna de postagens, você deverá colar o código logo abaixo da div main-wrapper.
Vá no menu "modelo", entre na edição html e procure por:


<div id='main-wrapper'>

E logo abaixo dela cole o seguinte código:


<!-- Slide Posts Recentes início -->
<div id='slide-wrapper'>
<div id='postslide'>
<script type='text/javascript'>
imgr = new Array();
imgr[0] = &quot;http://lh3.ggpht.com/_UCfxgWHzU98/TJe2iGJDFPI/AAAAAAAADlQ/Kl037bivjzg/no-image.jpg&quot;;
showRandomImg = true;
imgwidth = 410; <!-- ajuste a largura da imagem -->
imgheight = 250;
summaryPost = 140;
startpost = 1;
numposts = 7; <!-- numero de posts que aparecem no slide -->
home_page = &quot;<data:blog.homepageUrl/>&quot;;
</script>
<script src='URL-DO-ARQUIVO-RECENTPOSTSLIDE' type='text/javascript'/>
</div>
</div><!-- Slide Posts Recentes fim -->

Em imgwidth = 410; você deve colocar a largura da imagem de acordo com a mesma medida que tem em "main-wrapper" no seu template.

? Templates Designer de Modelo:
Se você usa uns dos modelos novos de template Designer de Modelo, eu aconselho que você instale o slide acima da coluna de postagens.
Eu testei o código, tentando instalá-lo abaixo do menu e particularmente, não deu certo, não ficou bom, mas se você quiser testar, fica a seu critério.
O melhor local para instalação deste slide para os templates designer de modelo, realmente é acima da coluna de postagens.
O código do local para instalar o slide acima da coluna de postagem é diferente, portanto preste atenção:

Vá no menu "modelo" >> "editar html" e procure por:


<div class='column-center-inner'>

E cole logo ABAIXO dela o seguinte código:


<!-- Slide Posts Recentes início -->
<div id='slide-wrapper'>
<div id='postslide'>
<script type='text/javascript'>
imgr = new Array();
imgr[0] = &quot;http://lh3.ggpht.com/_UCfxgWHzU98/TJe2iGJDFPI/AAAAAAAADlQ/Kl037bivjzg/no-image.jpg&quot;;
showRandomImg = true;
imgwidth = 560; <!-- ajuste a largura da imagem -->
imgheight = 250;
summaryPost = 140;
startpost = 1;
numposts = 7; <!-- numero de posts que aparecem no slide -->
home_page = &quot;<data:blog.homepageUrl/>&quot;;
</script>
<script src='URL-DO-ARQUIVO-RECENTPOSTSLIDE' type='text/javascript'/>
</div>
</div><!-- Slide Posts Recentes fim -->

 

Onde está imgwidth = 560; você deve ajustar esta medida e colocar a largura da imagem de acordo com a mesma medida que tem no seu template.
As larguras dos templates designers de modelo variam de acordo com o modelo do template, portanto não há como eu informar qual o valor correto que você deverá incluir neste campo, você terá que testar, incluindo valores e ir visualizando para ver se está de acordo com a largura do seu template.

 
[alerta]Lembrando que, a funcionalidade deste script pode variar de acordo com o template.
Templates que possuem muitos scripts, acabam gerando "conflitos" entre si, por isso alguns arquivos javascript dão erro pra alguns, mas funcionam perfeitamente para outros.
Caso este script não funcione em seu blog, verifique se você já tem instalado algum outro script que conflite com o JQuery.
Para melhor entendimento, leia: Por que alguns scripts não funcionam no meu blog.[/alerta]

Caso queira aprender como ocultar ou exibir este slide que você instalou, em determinadas páginas, leia o artigo:
Ocultar Elementos em Página Específica

Sobre o autor | Website

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Desculpe, os comentários deste artigo estão encerrados.

92 Comentários

  1. Malu disse:

    Pode me tirar uma dúvida? Tenho um slide com imagens de parceiros como gadgets no meu blog, mas depois que coloquei o slide de postagens recentes ele parou de funcionar. O que pode ser?

    • Vanessa disse:

      Alguns recursos em javascript podem variar de template para template, ou podem apresentar conflitos com outros arquivos javascript. Templates que possuem muitos scripts, acabam gerando “conflitos” entre si. Eu acredito que no seu caso, os slides entraram em conflito. Sugiro que vc decida qual é o mais necessário no seu template.

    • Vanessa disse:

      No tutorial tem o link de um artigo com uma lista de sites para hospedagem de arquivos. Procure utilizar alguns dos listados. Vc está usando o do tumbrl, não vai funcionar no blogger mesmo.

  2. Janilson disse:

    Não deu certo, aparece as imagens uma embaixo da outra não em slides como eu ajeito isso?

  3. Jose disse:

    Olá, poderia me dizer onde eu encontro esta URL, URL-DO-ARQUIVO-POSTSLIDE.

    • Vanessa disse:

      Jose, vc tem que fazer download dos arquivos nos links do 2º passo, hospedar os arquivos para somente, depois, pegar a url do arquivo que vc hospedou. Está explicado no tutorial.

  4. Clayton disse:

    Infelizmente no meu blog não funcionou. Ficou um espaço vazio no local apenas. Sei que segui certinho paço a paço, mas creio que deve ser algo do meu template.
    Adorei as dicas deste site. Parabéns pela iniciativa!!!

  5. Karine disse:

    Olá,muito obrigada, funcionou perfeitamente.Gostaria de saber como faço para colocar as setas de navegação no slide.

    Obrigada

  6. Lucas Kayque disse:

    fiz tudo aqui e funcionou certinho! hehe
    mas, eu queria saber se tem como colocar esse apenas da pagina principal… será que existe essa possibilidade?

    • Vanessa disse:

      No final do artigo tem um link apontando para um tutorial que explica como ocultar elementos em página especifica.

      • Michael disse:

        Vanessa, não deu certo. E nao consigo instalar o postslide e recentpostslide

        • Vanessa disse:

          Tais recursos podem variar de template para template. Sendo assim, lamento, mas não tenho como te ajudar, de qualquer forma agradeço pelo comentário.

  7. Natalia disse:

    nao consigo baixar o postslide e nem o recentpostslide o que pode ser?

  8. Vanessa disse:

    oi eu nao estou conseguindo colocar o slides, ele nao estao apresentando no site, vc pode me ajudar ????

    • Vanessa disse:

      Alguns recursos podem variar de template para template. Sendo assim, lamento, mas não tenho como te ajudar, de qualquer forma agradeço pelo comentário.

  9. Atoniel disse:

    Eu usei no meu blog e ficou ótimo obrigado pela pela ajuda Vanessa

    Quem quiser conferir e so visitar meu blog: http://fanaticoporcars.blogspot.com.br

  10. Wilson disse:

    Não está tão clara a sua explicação, há trechos que requerem melhorias. Por exemplo: No código acima eu identifiquei a que corresponde cada trecho, para que você possa alterar as medidas e as cores de acordo com seu template.
    Aqui vc não especifica por favor nos dê detalhes. Obrigado…

    • Vanessa disse:

      Eu quis dizer que no código acima eu destaquei nas cores azul e verde, os trechos de códigos editáveis, para facilitar a alteração das medidas e das cores de acordo com a sua preferencia. Mesmo que não tivesse esse informação no artigo, só de ler as partes na cor verde,no código, já daria para entender o que significa.

  11. Danielly Vieira disse:

    Não encontro o . Pelo que posso substituir?

  12. Rafael Lima disse:

    Gostaria de saber oque eu coloco em URL-DO-ARQUIVO-POSTSLIDE ???

  13. Lucas Lima disse:

    Obrigado, não consigo tirar o slide e danificou meu layout!

    • Acredito que tenha feito um backup antes de instalar o código.. É só ir no Drashboard do blogger, depois em MODELO e fazer o upload do código XML.

      Se não.. qual é o link do seu blog?

    • Vanessa disse:

      E vc não fez backup antes de realizar a instalação? O.o

  14. Allan Bahls disse:

    Eu fiz tudo certinho, repassei tudo umas 10 vezes, mas no meu nao esta aparecendo as imagens…
    Tipo, aparece o espaço por encima das postagens a onde devia aparecer os Slides, mas nao aparece…

    • Vanessa disse:

      Allan:
      Verifica se nos seus posts tem imagens demonstrativas, pq o slide só vai funcionar corretamente se tiver imagens em todos os artigos.

      • Jeniffer disse:

        O meu tbm aconteceu a mesma coisa, onde eu verifico se as imagens que tem no meu post são demostrativas.

    • Clayton disse:

      O meu blog aconteceu a mesma coisa =/

  15. Samuka Souza disse:

    Oi amigo, o slide ficou show de bola. Mas ainda estou sem saber para as postagens não se repetirem, ou seja, as postagens nos slides ser diferente das que posta-se no corpo do blogue. Grato.

  16. Camaçari Rock Clube disse:

    Eu usei o Slide aqui em meu blog e ficou ótimo… Muito obrigado pela ajuda…

    Quem quiser ver o resultado: camacarirockclub.blogspot.com

  17. Samuka Souza disse:

    Caro amigo, peguei o código e deu certo. Mas ele repete justamente as últimas postagens que estão na tela. Tem como ele postar as últimas 5 por exemplo e o blogspot postar abaixo sem as mesmas dos slides? Fico no aguardo. Grato.

  18. Augusto disse:

    oiii aqui eu queria saber se tem algum mode de retirar do slide as descrições (as palavras e a barra transparente cinza)?

    Obrigado!

  19. Fran disse:

    descobri o q era! era a hospedagem do script q nao estava funcionando :S muito obrigada pelo script *-*

  20. .:: Nessa ::. disse:

    @sempreseg
    O IE sempre é problema mesmo.

    @Fran
    Tais recursos podem variar de template para template. Sendo assim, lamento, mas não tenho como te ajudar, de qualquer forma agradeço pelo comentário.

  21. Fran disse:

    Nossa, tentei instalar esse slide 4 vezes em blogs diferentes e modelos diferentes, nunca dá… o q to fazendo de errado? fica só um espaço vazio onde o instalo! =S

  22. sempreseg disse:

    Olá! Boa noite,

    Não sei se você poderá me ajudar. Alguns meses atrás instalei este slide no meu blog e ele funciona direitinho em todos os navegadores somente no Internet Explorer não funciona!
    Vc tem alguma ideia do que possa estar acontecendo? Segui todas as suas recomendações de instalação!
    Como você não estava recebendo comentários resolvi aguardar!

    Desde já agradeço!
    Obrigado!

  23. .:: Clau ::. disse:

    Backstage
    Vc deve ter feito alguma coisa errada. Tente refazer o tutorial. Não há como eu saber o que vc fez de errado, lamento,mas não tenho como te ajudar.

  24. Backstage disse:

    Clau, eu preciso da sua ajuda: estou tentando de tudo quanto é jeito e acima da navbar aparece isso: "https://sites.google.com/…/postslide.js" Eu faço tudo direitinho como você explica mas mesmo assim não aparece o slide, apesar de o espeço ficar vago. Será que tem como me ajudar?

  25. kØ?dzill? ³D disse:

    walew tava procurando esse slide

  26. Felipe, O Nerd disse:

    Olá, gostei muito da postagem, eu coloquei no meu blog, e fiz apenas alguns ajustes, obrigado pela dica…

  27. Rodrigo Misorelli disse:

    Clau, me ajuda se for possível: eu não acho a tag no template do meu blog para colocar o slide em cima das postagens e nem em baixo do cabeçalho! e agora? obrigado, adoro o site *-*

  28. Bandolero disse:

    deu certinho aqui , mas quero colocar um segundo slide em baixo e ele fica preto , o que eu tenho que Alterar pra conseguir ,
    blogdobandolero@hotmail.com

  29. Henrique disse:

    Parece ser perfeito! Otimo trabalho, mas uma pergunta; eu gostei muito de um template para o wordpress, o Basicpress e na sua versao para blogger não há o slide.. Gostaria que voce me ajudasse a transefeir o js do wordpress para o blogger… Há como eu fazer isso? Ficarei muito grato com sua colaboração.

  30. Enche Lingüiça disse:

    Oie Clau
    Deu tudo certinho o que vc pediu para fazer, mas acontece que se eu abrir o blog no IE7 ele nao funciona, da um erro:

    Erro: Object doesn't support this propriety or method

    O que seria, hospedei meus aquivos java no google sites.

    abçs

  31. WMaster disse:

    Srº(¯` · _ å†ÿ£å Moza®t Rizzon_.· ´¯) e thoskera

    bem, se vocês são usuários que usam os novos modelos de template, realmente o Slide não irá aparecer =/ Puts, e aí tem solução? Sim Felizmente ^^'

    1. Certifiquice de onde vocês queiram colocar o Slider

    2. Vamos lá para o mini-Tuto de Criar classe

    3. nos novos templates a Classe "Crosscol" não é tão visivel e muito utilizavel, comparado aos templates antigos.
    "Criando a Classe crossocol"
    Se você já tem certeza de onde colocar o Slider, então vamos lá… no meu caso eu coloquei abaixo do
    Criei a Classe Crosscol Ex:

    div id='crosscol-wrapper'

    coloque acima da linha de comando:

    Ficando assim:
    div id='crosscol-wrapper'

    Abaixo dessa linha de comando:
    /div

    Adicione:
    div class='crosscol section' id='crosscol-wrapper'/
    /div /b:if
    /div
    /div

    E Pronto, pessoal é isso ;D
    Visualize e veja se tudo ficou certo, salve seu Template!

    P.S: não esqueçam de colocar o "< >" antes e depois dos DIV e /b:if

  32. WMaster disse:

    @Irving Maynard

    Olá Amigo!
    bem se você quiser centralizar o Slider faça o seguinte, Observe:
    /*— conteúdo do slide —*/
    #postslideContent{
    position:absolute;
    bottom:0px;
    top:0 0px;
    right:150px;
    width:auto; /* coloque um valor na largura se quiser – deve ser a mesma do container */
    background:#141414; /* edite cor de fundo se quiser*/
    }

    Na linha de comando "Right" acrescente pixel para o mover o slider e centralizar da maneira com que se adeque ao seu template ^^'

    Ex: no meu template o slide ficou lá no canto direito, então fiz assim acrescentei 150px e pronto ele centralizou aqui, Ou seja, vá acrescentando pixels e mais pixels e vá visualizando até ficar de seu agrado o/

    Dica: quanto mais pixels se acrescenta mais ele se moverá para a esquerda!

  33. .:: Clau ::. disse:

    Pessoal, leiam o aviso que tem dentro da caixinha no final do artigo. A funcionalidade deste slide pode variar de template para template, não há como eu saber o que ocorre no template de cada um, sendo assim,não tenho como ajuda-los.

  34. Irving Maynard disse:

    Olá, gostei do postn e do blog. Fiz conforme o tutorial e deu certo no entanto ele não está centralizando como o do demo. o que faço?

  35. thoskera disse:

    Olá, estou tendo os mesmos problemas que a galera teve de aparecer os espaços mas não os slides. Procurei em outros lugares , maneiras diferentes de como se fazer isso, e já percebi que é coisa do template, ele é muito particular e tem suas divs bem diferentes da que voce postou aí para pesquisar e postar.
    O que eu quero saber é: teria como você me indicar outras maneiras de como fazer isso, ou outro link/site que me ajude?

  36. Srº(¯` · _ å†ÿ£å Moza®t Rizzon_.· ´¯) disse:

    olá eu ñ entendii fiz passo a passo mais ñ aparece sera qui vcs podem posta aqui o codigo ja feito?vlw so para colocar as fotos vlwwwwww

  37. Petrus disse:

    Só tenho uma dúvida: Qual valor altero para diminuir o tamanho do retângulo com o texto?

  38. Petrus disse:

    Perfeito! Como sempre, um ótimo tutorial! Se quiser ver o resultado, que na minha opinião ficou muito bom.

  39. .:: Clau ::. disse:

    Jubamen
    Como vc pode observar nos blogs de testes, isso não ocorreu em nenhum dos 2 blogs demonstrativos.
    Não há como eu saber o que ocorre com seu template. Alguns recursos variam de template para template, sendo assim, não tenho como te ajudar.

  40. JUBAMEM disse:

    segui todo o tutorial certinho abre um espaço mais não aparece o slider no blog..

  41. Anderson Ribeiro da Silva disse:

    Valeu, gostei muito, se vc descobrir alguma forma de colocar um botão para adiantar ou voltar o slide posta ai pra nós, vc ta de parabens com seu blog, obrigado pelas dicas!

  42. Vinícius Pinto disse:

    Fiz todo o passo a passo do seu blog, porém no fim, apenas aparece um espaço em branco onde deveria aparecer os slides. O que faço?

  43. Leighton Meester disse:

    eu tenho um slide no meu blog mais não sei como posso atualizar ele

  44. compre facil fortaleza disse:

    vcs tem otimas dicas, mais essa nao foi tao boa quanto as outras. mesmo assim abraços afirmo que vcs tem potencial.

  45. .:: Clau ::. disse:

    Natália
    Lamento, mas não tenho como te ajudar. Faz uma pesquisa no google e veja se tem algo a respeito.

  46. Natália disse:

    Clau… sou apaixonada por PPS (Power Point Slides) e gostaria de ter um site no qual eu pudesse publicá-los
    com o texto e o próprio Slides para os visitantes baixá-los. Sei que o Blogger não nos permite isso. Tem como me ajudar em mais essa?

  47. .:: Clau ::. disse:

    Gontijø
    Por favor, leia o meu comentário de nº 27.

  48. Gontijø disse:

    Clau.. Procuro esse slider há muito tempo!!
    Mas no meu o erro é que as palavras apresentadas para cada post não é o título mas sim o texto que eu coloquei no post, ou seja, se eu não escrever nada no post não aparecerá descrição do mesmo!!
    O que devo fazer para corrigir esse erro!!
    Atenciosamente.

  49. GSV disse:

    Acessem o guerreirossaovicente.blogspot.com e vejam que realmente funciona, gostei demais desse tutorial!

  50. .:: Clau ::. disse:

    Guif
    Se vc verificar os blogs de testes que utilizei, o slide funciona perfeitamente, porém, a funcionalidade de alguns recursos podem variar de template para template. Não há como eu saber o que ocorreu no seu, sendo assim, não tenho como ajudar.

  51. Guif disse:

    Mesma coisa dos outros, instalo tudo, o blogger não identifica nenhum erro, salvo e plin, não aparece :/
    http://guifdownloads.blogspot.com/

  52. .:: Clau ::. disse:

    GSV
    As partes coloridas servem justamente para que o leitor consiga identificar o que o trecho representa. Para instaler este slide, é necessário que tenha um conhecimento no minimo intermediario em html,css e js.

    Eduada Alves
    Lamento mas não tenho como te ajudar.

  53. Eduada Alves disse:

    oi, eu não estou conseguindo hospedar o javascript do passo 2 🙁

  54. GSV disse:

    Obrigado pela resposta, mas realmente eu preciso desse slide no blog guerreirosaovicente.blogspot.com, não seria possível criar um HTML mais simples? Pois tentei por várias vezes, mas tem algumas coisas em colorido que não compreendo! OBG! *–*

  55. .:: Clau ::. disse:

    GSV
    Como você pode verificar, isso não aconteceu no blog onde fiz o teste. Tais recursos variam de template para template. Sendo assim, lamento, mas não tenho como te ajudar.

  56. GSV disse:

    Fiz todos os passos indicados nesse tutorial para incorporar a guia de posts recentes em slides no Blog GSV, quando fui salvar as alterações no meu HTML foi apontado erro de xml, mais precisamente o seguinte: The value of attribute "src" associated with an element type "null" must not contain the '<' character.
    Poderia me ajudar? Se possível envie e-mail para danielpaulus15@hotmail.com! Muito Obrigado!

  57. Kevvin Oliveira disse:

    A dica é boa, mas eu acho que fica meio chato algumas imagens sairem mal redimensionadas. Mas a dica é boa, o jeito é fazer imagens do tamanho do Slide para ficar organizadinho =D

  58. .:: Clau ::. disse:

    Administrador
    É possivel sim, desde que vc edite todo o código adaptando-o para se encaixar no tamanho da sua sidebar.

  59. Administrador disse:

    Olá Dr.ª!
    É possível instalar esse último código em um gadget?
    Vc tem algum tutorial sobre alteração do estilo em footer?
    Bjus!

    Flávio

  60. Dantas Neto disse:

    Clau será que você pode me ajudar em uma coisa?

    É o seguinte, esse slide vinha funcionando bem no meu blog, mas agora ele não está carregando e gostaria de saber o por que.

  61. .:: Clau ::. disse:

    Thiago
    Todo valor que vc ajustar na altura da imagem vai interferir na exibição do título sim. Se vc alterar a altura, vai ter que alterar a altura das imagens tb, senão o titulo não vai aparecer mesmo.

  62. Thiago Henrik disse:

    Olá, gostei muito do seu tutorial, foi o melhor que encontrei na rede sobre o assunto! Facílimo de seguir! Muito obrigado e parabéns.

    Mas fiquei com uma dúvida. Consegui colocar, utilizando os códigos do jeito que você colocou, mas quando tentei alterar a altura do conteiner (coloquei em 200px) o Título e a Descrição do post sumiram.

    Eles só aparecem se eu defino a altura das imagens em 200px tbm, mas não é minha intenção, quero que a imagem fique recortada mesmo, e não imprensada.

    Já tentei mudar alguns valores em outros lugares, mas sem sucesso. Pode me ajudar?

    Abraços!

  63. .:: Clau ::. disse:

    Next Level Games Brasil
    Mas todo recurso que depende do Feed para funcionar, se o blog não oferecer o modo Completo, não irão funcionar mesmo.
    No próprio artigo eu citei que esse slide é uma junção dos scripts de artigos recentes + s3lider. O de artigos recentes necessitam do feed,senão de onde ele iria buscar as ultimas postagens dos blogs, né?
    Eu achei que vc já sabia disso..O.o
    Que bom que já deu certo ai e vc já conseguiu resolver.
    Agora procure oferecer os feeds no modo completo mesmo,é a melhor opção.

  64. Next Level Games Brasil disse:

    Clau, descobri por que não apareciam mais as imagens no slide!

    É o seguinte, não entendo de programação, mas sou bastante curioso, e lendo o código java ví que o slide funciona juntamente com os feeds do site, e eu avia modificado o feed para que não fossem enviados por completo, e somente uma introdução(SINOPSE), aí mudei novamente para COMPLETO o modo de envio e voltou a funcionar as imagens. Então segue abaixo o modo correto de configurar o feed para quem tiver o problema também!

    No modo completo e não básico de comfiguração acesse abaixo:

    Configurações>Site Feed>

    Na aba

    Feed de postagens do blog

    selecione COMPLETA

    Bom, é isso aí, se você conseguir corrigir o javascript para que eu possa deixar no modo SINOPSE
    favor me avisar ou postar aqui o código correto, obrigado e espero ter ajudado!

  65. .:: Clau ::. disse:

    Next Level Games Brasil
    O problema com certeza está relacionado as imagens dos seus posts, principalmente se elas estavam hospedadas no site Tinypic.

  66. Next Level Games Brasil disse:

    gostaria de saber o que está acontecendo com o que coloquei no meu blog, pq aparece certinho mas não estão aparecendo as imagens mais, onde devo olhar pra ver se volta a funcionar, obrigodo

    http://nextlevelgamesbrasil.blogspot.com

    aguardo resposta!

  67. Dantas Neto disse:

    Oi Clau, olha eu coloquei esse slide no meu blog e ele funcionou bem, caso queira olhar.

    E mais uma vez, muito obrigado por mais uma excelente dica, eu tinha um slide no meu blog mais era meio ruim de ficar o tempo todo atualizando, esse e bem mais facil e pratico.

  68. 3DN4LDO disse:

    Vi o post, mais tarde irei implementar esse recurso no meu blog! Obrigado.

  69. .:: Clau ::. disse:

    David Aragon™
    Valeu pela dica, depois vou lá dar uma olhada. E obrigada pela visita e volte sempre viu?

    Kaytros
    Eu acredito q pra esse tipo de slide não tenha como, mas nada é impossível, é so vc tentar e vê se dá certo.
    Obrigada pelo comentário.

  70. kaytros disse:

    Gostaria de colocar um botao para voltar ou adiantar o slide…
    sera que tem como!

  71. .:: Clau ::. disse:

    Tonný
    Procura pelo tutorial "script aumentar dimunuir fonte do texto" lá no meu indice dos tutoriais q está no menu "Tutoriais Blogger".

    rubens
    é q meu menu é feito com imagens,não é texto, ele é bem complicado e não é personalizavel, por isso q nunca ensinei como instalá-lo aqui, pq requer um conhecimento bem avançado em códigos.

  72. rubens disse:

    Clau, eu acho que já perguntei isso mas não lembro em qual post, então vou perguntar de novo. Quando passo o mouse no menu do seu blog, vejo que o title está com um estilo diferente, como se faz isso?

  73. Tonný disse:

    Gosteii da dica, e tbm do seu blog., Queria saber como aumentar e diminuir a fonte, como esta no seu. bjxzjxjz

  74. Wilton Pinheiro disse:

    Tudo muito bem explicado. Mas o final sempre igual aos outros. Não se vê o resultado de como fica no nosso blog.

  75. .:: Clau ::. disse:

    Paulo Roberto Lopes
    Se vc conhece algum blog que esteja utilizando este slide é só falar, pq eu particularmente não conheço. Conforme eu citei no post, o script para o funcionamento do slide é uma adaptação feita pela Rô Zancheta, o q eu fiz foi testar o código dela e instalá-lo em alguns dos meus blogs de testes para ver o slide em funcionamento e com isso poder explicar e ensinar melhor como instalar este slide. Inclusive disponibilizei os links dos blogs de testes onde eu realizei as instalações para que os leitores possam vê-lo em funcionamento, basta verificar os links "Demo" que estão no tutorial.
    Obrigada pelo comentário e pela observação. Volte sempre que precisar.
    Abçs.

  76. Paulo Roberto Lopes disse:

    Gostei, mas faltou indicar alguns blogs que utilizam esses slides. No mais, parabéns pelo Mundo Blogger.

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.