07 outubro 2017

COMO COLOCAR SLIDES DE POST NO SEU BLOG

Oi meus amores no post de hoje vou compartilhar como coloquei os slides dos posts no meu blog

Tem um vídeo lá no canal explicando passa a passo, (CLIQUE AQUI )

1 - veja se se blog não tenha esse código ou parecido e apague-o:
<script src='https://dl.dropboxusercontent.com/u/32613589/recentslide.js' type='text/javascript'></script>

2-cole o codigo logo abaixo

<center><style type="text/css">
/*INICIO CSS FOTOS*/
.bsrp-gallery {
margin-top:70px;
width:1300px; ==LARGURA DO SLIDE==
float:center; ==POSIÇÃO DO SLIDE==
clear:both;F
}

.bsrp-gallery:after {
display: table;
clear: both;
}
.bsrp-gallery .bs-item a {
position: relative;
float:left;
margin: 0 10px 15px 0;
text-decoration:none;
}
.bsrp-gallery .bs-item .ptitle {
background:#DDA0DD; /*==COR AREA DE TITULO==*/

display: block;
clear: left;
font-family: 'lucida fax', cursive; ==FONTE DO SLIDE==
font-weight:200;
text-transform:none; /*==TDS LETRAS MAIÚSCULAS - altere se quiser==*/
font-size:20px; /*==TAMANHO DO TITULO==*/
line-height:1.3em;
height:50px;
position: absolute;
bottom:5%;
text-align: center;  /*==POSIÇÃO DO TITULO==*/
color:#000000; /*== COR DO TITULO==*/
width:90%;
padding:6px;
word-wrap: break-word;
overflow:hidden;
}
.bsrp-gallery a img {
background: #fff;
float: left;
}
.bsrp-gallery a:hover img {
filter:alpha(opacity=90);
-moz-opacity:0.8;
-khtml-opacity:0.8;
opacity:0.8;
}
/*FIM CSS FOTOS*/
</style>
<script>
//byjana
function bsrpGallery(root) {
var entries = root.feed.entry || [];
var html = ['<div class="bsrp-gallery nopin" title="Get this from poderondesign">'];
for (var i = 0; i < entries.length; ++i) {
var post = entries[i];
var postTitle = post.title.$t;
var orgImgUrl = post.media$thumbnail ? post.media$thumbnail.url : 'http://3.bp.blogspot.com/-sWtp_qRPNT8/UZYmQq5sAdI/AAAAAAAAEec/7YDbpK4Q6g8/s72-c/default+image.png';
var newImgUrl = orgImgUrl.replace('s72-c', 's' + bsrpg_thumbSize + '-c');
var links = post.link || [];
for (var j = 0; j < links.length; ++j) {
if (links[j].rel == 'alternate') break;
}
var postUrl = links[j].href;
var imgTag = '<img src="' + newImgUrl + '" width="' + bsrpg_thumbSize + '" height="' + bsrpg_thumbSize + '"/>';
var pTitle = bsrpg_showTitle ? '<span class="ptitle">' + postTitle + '</span>' : '';
var item = '<a href="' + postUrl + '" title="' + postTitle + '">' + imgTag + pTitle + '</a>';
html.push('<div class="bs-item">', item, '</div>');
}
html.push('</div>');
document.write(html.join(""));
}
hoje = new Date()
numposts =1
var bsrpg_thumbSize = 255;

var bsrpg_showTitle = true;

document.write("<script src=\"COLA AQUI LINK DO SEU BLOG//feeds/posts/default?start-index="+numposts+"&max-results=4&orderby=published&alt=json-in-script&callback=bsrpGallery\"><\/script>");</script></center>

Espero que tenham gostado se ficou alguma duvida deixe nos comentários 

10 comentários:

  1. Uma ótima dica para as blogueirinhas, sem contar que tá explicado de uma forma simples e bem fácil. Adorei!

    ResponderExcluir
  2. Sempre ajudando uhuuuu
    Eu ja ñ entendo nem sei mexer na aula de computação ñ era fã do Html kkķkkk.
    Bjs linda

    ResponderExcluir
  3. Ótima dica para quem está atrás de um slide, slide é um ótimo instrumento de divulgação de posts. Arrasou nega, beijos <3

    ResponderExcluir
  4. Amei o post bem interessante para as pessoas que estão iniciando

    ResponderExcluir
  5. Eu adorei pois nunca consigo achar os códigos corretos. Você é a única pessoa que consigo entender quando se trata de explicações de códigos pois você põe bem explica dinheiro ❤👏🎀

    ResponderExcluir
  6. Que demais hein !! Com essa ferramenta, o blog fica muito mais dinâmico e interativo. Obrigada por compartilhar. Beijos.

    ResponderExcluir
  7. Oi querida, eu sempre que posso coloco slides no meu blog, acho que dá uma outra aparência,né?
    Mais clean...
    Beijos

    ResponderExcluir
  8. Eu adorei Day, vou fazer no meu tbm é indicar para minhas amigas

    ResponderExcluir
  9. Adorei a explicação, é difícil de encontrar essas coisas no google, quando fui fazer o meu não achei e desisti... muito bom o post!

    ResponderExcluir
  10. ótima dica e explicação com certeza vai me ajudar muito, obrigada!

    ResponderExcluir

Desenvolvido por: Mariely Abreu | Todos os direitos reservados ©. voltar ao topo